Browse Library
Sign In Start Free Trial
Close icon Search icon
Account
Browse Library Advanced Search Sign In Start Free Trial

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Enhanced Test Automation with WebdriverIO
  • Toc
  • feedback
Enhanced Test Automation with WebdriverIO

Enhanced Test Automation with WebdriverIO

By : Paul M. Grossman, Larry C. Goddard
5 (7)
close
Enhanced Test Automation with WebdriverIO

Enhanced Test Automation with WebdriverIO

5 (7)
By: Paul M. Grossman, Larry C. Goddard

Overview of this book

This book helps you embark on a comprehensive journey to master the art of WebdriverIO automation, from installation through to advanced framework development. You’ll start by following step-by-step instructions on installing WebdriverIO, configuring Node packages, and creating a simple test. Here you’ll gain an understanding of the mechanics while also learning to add reporting and screen captures to your test results to enhance your test case documentation. In the next set of chapters, you’ll delve into the intricacies of configuring and developing robust method wrappers, a crucial skill for supporting multiple test suites. The book goes beyond the basics, exploring testing techniques tailored for Jenkins as well as LambdaTest cloud environments. As you progress, you’ll gain a deep understanding of both TypeScript and JavaScript languages and acquire versatile coding skills. By the end of this book, you’ll have developed the expertise to construct a sophisticated test automation framework capable of executing an entire suite of tests using WebdriverIO in either TypeScript or JavaScript, as well as excel in your test automation endeavors and deliver reliable, efficient testing solutions.
Table of Contents (20 chapters)
close
close
Preface
Preface
Who this book is for
What this book covers
To get the most out of this book
Download the example code files
Conventions used
Get in touch
Share Your Thoughts
Download a free PDF copy of this book
1
Chapter 1: The Utility Belt – Tools Every Superhero SDET Needs
chevron up
Chapter 1: The Utility Belt – Tools Every Superhero SDET Needs
Virgin machine setup
Rule of thumb – the hardware resources and access rights must match the development team
Installing Visual Studio Code for your operating system
X-ray vision – writing better code with Prettier, ESLint, and GitLens
Installing Chrome extensions
Installing WebdriverIO
Summary
Free Chapter
2
Chapter 2: Fortress of Solitude – Configuring WebdriverIO
Chapter 2: Fortress of Solitude – Configuring WebdriverIO
WebdriverIO setup
Building and installing the project dependencies
Summary
3
Chapter 3: Cybernetic Enhancements – WebdriverIO Config and Debug Tips
Chapter 3: Cybernetic Enhancements – WebdriverIO Config and Debug Tips
The three main files of a WebdriverIO node project
Rule of thumb – match your developer’s hardware
Letting Yarn help keep files up to date
Configuring debugging with VS Code
Dynamic configuration
Our first custom wrapper method – global.log()
Rules to enforce coding standards
Summary
4
Chapter 4: Super Speed – Time-Travel Paradoxes and Broken Promises
Chapter 4: Super Speed – Time-Travel Paradoxes and Broken Promises
Technical requirements
The time-travel dilemma
Schrödinger and the quantum mechanics of test automation
Callbacks, promises, and async/await
The death of fibers and synchronous mode
Summary
5
Chapter 5: Alter Egos – The ClickAdv Wrapper
Chapter 5: Alter Egos – The ClickAdv Wrapper
Adding a helpers file
The “Hello, World!” of test automation
ES6 helper modules versus overriding intrinsic methods
Who tests the SDET’s code? Sanity testing of the automation framework
Extending our ES module helper file with a custom click method
Why are waits difficult to implement correctly?
Expanding the click method wrapper
Supercharged scroll before a click event
Expanding the click method wrapper
The importance of metrics
Self-healing elements
Stubbing out methods with the “alreadyFailed” switchboard key
Summary
6
Chapter 6: The setValue Wrapper – Entering Text and Dynamic Data Replacement
Chapter 6: The setValue Wrapper – Entering Text and Dynamic Data Replacement
Normalizing the element type
Adding the setValue() method wrapper
Is this trip really necessary?
Coal into diamonds – replacing dynamic data tags
Injecting versus typing text into a field
Checking whether the field is pre-populated for speed
Behind the mask – SetValuePassword() to keep data secure
Putting it all together
Summary
7
Chapter 7: The Select Wrapper – Choosing Values in Lists and Comboboxes
Chapter 7: The Select Wrapper – Choosing Values in Lists and Comboboxes
Adding the base functionality of clickAdv() and setValueAdv() to selectAdv()
Selecting an item from the list
Selecting from a combobox
Inspecting a list that closes when it loses focus with SelectorsHub
Writing a locator that is an element inside a list
Summary
8
Chapter 8: The Assert Wrapper – the Importance of Embedded Details
Chapter 8: The Assert Wrapper – the Importance of Embedded Details
expect, assert, and should –how did we get here?
Timeout – delay of game
What are hard and soft expect assertions?
Introduction to Allure reports
Summary
9
Chapter 9: The Ancient Spell Book – Building the Page Object Model
Chapter 9: The Ancient Spell Book – Building the Page Object Model
Technical requirements
What is Page Object Model?
What constitutes a good Page Object pattern?
Creating a page class for the tests
Adding object selectors
module.exports = new HomePage();Calling methods to be used in the test
Reducing code with common objects and methods
POM using Klassi-js
Summary
10
Chapter 10: Increased Flexibility – Writing Robust Selectors and Reducing Maintenance
Chapter 10: Increased Flexibility – Writing Robust Selectors and Reducing Maintenance
Technical requirements
Reducing page object maintenance with generic selectors
Anatomy of an XPath selector
Leveraging data-qa and ARIA attributes
Writing an XPath element that contains a textual substring
Second chances – getting valid objects from stale selectors
Summary
11
Chapter 11: Echo Location – Skipping the Page Object Model
Chapter 11: Echo Location – Skipping the Page Object Model
A reduced code base
Automation in plain English
Getting a visible button by name
Getting a visible field by name
Getting a visible list by name
Getting a visible element from a collection
Beware the endless rabbit hole!
Summary
12
Chapter 12: Superhero Landing – Setting Up Flexible Navigation Options
Chapter 12: Superhero Landing – Setting Up Flexible Navigation Options
Technical requirements
Using system variables
Adding data configuration files
Configuring Allure reporting
Summary
13
Chapter 13: The Multiverses – Cross-Browser Testing and Cross-Environment Testing
Chapter 13: The Multiverses – Cross-Browser Testing and Cross-Environment Testing
Horizontal scaling – cross-browser testing
Using built-in functionality via the wdio config file
Using LambdaTest online to automate the browser testing grid
Using Selenium Standalone server to locally build the testing grid
Avoiding the rabbit hole of horizontal scaling
Handling environment-specific logic
The multiverse – one test, two environments
Summary
14
Chapter 14: The Time-Traveler’s Dilemma – State-Driven End to End User Journeys
Chapter 14: The Time-Traveler’s Dilemma – State-Driven End to End User Journeys
Technical requirements
Divide and conquer!
Simplifying the complexities of a dynamic journey
The happy path
Changing decision points
Wash, rinse, repeat
Why not generate these Artifacts with API calls?
Summary
15
Chapter 15: The Sentient Cape – Running Tests in a CI/CD Pipeline with Jenkins and LambdaTest
Chapter 15: The Sentient Cape – Running Tests in a CI/CD Pipeline with Jenkins and LambdaTest
Technical requirements
What are Jenkins and Slack?
Installing OpenJDK for Jenkins
Installing Jenkins as a standalone application
Installing Jenkins
Creating a WebdriverIO project with Jenkins
Installing the Jenkins plugin for LambdaTest
Creating a freestyle project and job
Reporting in Slack from Jenkins
On-demand and scheduled suite runs
Types of debugging runs with Jenkins
CI/CD pipeline
Summary
16
Epilogue
Epilogue
17
Index
Index
Why subscribe?
18
Other Books You May Enjoy
Other Books You May Enjoy
Packt is searching for authors like you
Share Your Thoughts
Download a free PDF copy of this book
Appendix: The Ultimate Guide to TypeScript Error Messages, Causes, and Solutions
Appendix: The Ultimate Guide to TypeScript Error Messages, Causes, and Solutions
Problem: Install default WDIO settings by passing “--yes” parameter still asks configuration questions
Problem: Missing script “wdio”
Problem: “node : The term ‘node’ is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again.”
Problem: ‘wdio’ is not recognized as an internal or external command”
Problems:
Problem: Tests suddenly fail to run including the \specs\test.e2e.ts. sample test.
Problem: Statements execute out of order
Problem: “ERROR @wdio/runner: Error: describe expects a function argument; received [object AsyncFunction]”
Problem: “Unsupported engine”
Problem: JavaScript Debug Terminal skips breakpoints
Problem: Browser launches and locks up
Problem: “SevereServiceError: Couldn’t start Chromedriver: timeout. Please check if port [<PortNumber>] is in use”
This is how to do it using macOS: lsof -i :<PortNumber> : kill -9 <PID>
Problem: MODULE_NOT_FOUND
Problem: Error: Could not execute “run” due to missing configuration, file “C:\repos\wdio\test\wdio.conf.ts” not found! Would you like to create one?
Problem: “report does not exist” when running an Allure report
Problem: “[P]lugin “allure” reporter, neither as wdio scoped package “@wdio/allure-reporter” nor as community package “wdio-allure-reporter”. Please make sure you have it installed!”
Problem: TypeError: Cannot read properties of undefined (reading ‘open’)
Problem: Cannot read properties of undefined (reading ‘setWindowSize’)
Problem: A service failed in the ‘onPrepare’ hookSevereServiceError: Couldn’t start Chromedriver: timeout. Please check if port 9515 is in use!
Problem: “Cannot find name ‘expect’. Do you need to install type definitions for a test runner?” but the test still runs.
Problem: “An import path can only end with a ‘.ts’ extension when ‘allowImportingTsExtensions’ is enabled.ts(5097)”
Problem: browser.debug() generates “Failed to read descriptor from node connection: A device attached to the system is not functioning.”
Problem: Element implicitly has an ‘any’ type because type ‘typeof globalThis’ has no index signature
Problem: Cannot find type definition file for ‘jasmine’
Problem: “Execution of 0 workers” No tests get executed.
Problems: Cannot find name ‘browser’ and Cannot find name ‘$’
Problem: Property ‘toBeExisting’ does not exist on type
Problem: ERR! [Error: EACCES: permission denied (Mac OSX)
Problem: ERROR @wdio/selenium-standalone-service: Error: not found: java
Problem: “ECONNREFUSED 127.0.0.1:9515” a service failed in the ‘onPrepare’ hook tcp-port-used
Problem: Error: Cannot find module ‘C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js’
Problem: “Note: Package.json must be actual JSON, not just JavaScript”
Problem: Protocol error (Runtime.callFunctionOn) target closed
Problem: “unexpected token” in tsconfig.json
Problem: “TypeError: elem[prop] is not a function”
Problem: “ServerServiceError in “onPrepare” Cannot find package ‘chromedriver’
Problem: Property ‘{functionName}’ does not exist on type ‘({functionType<{argName>}) => void’
Problem “Property ‘addCommand’ does not exist on type ‘Browser’.” (macOS)
Problem: ConfigParser: pattern ./test/specs/**/*.ts did not match any file.
Problem: Error: Timeout - Async function did not complete within 10000ms (set by jasmine.DEFAULT_TIMEOUT_INTERVAL)
Problem: Error: Error: Couldn’t find page handle
Problem: This expression is not callable. Type ‘void’ has no call signatures.ts Are you missing a semicolon?
Problem: “File is not a module”
Problem: “Couldn’t find page handle”
Problem: “Error: {pageName} is not defined”
Problem: Argument of type ‘ChainablePromiseElement<Element>’ is not assignable to parameter of type ‘Element’.
Problem: Unable to delete or modify files or folders in the WebdriverIO project
Problem: EJSONPARSE Unexpected token in JSON while parsing Failed to parse JSON data
Problem: A long string of gibberish garbage characters is added to the wdio.config.ts file when running in JavaScript Debug Terminal in Windows
Yarn and Node Package Manager (npm), Node Version Manager (nvm), and Node Package Executor (npx) Shell command cheat sheet
Reference links

X-ray vision – writing better code with Prettier, ESLint, and GitLens

Developers need coding tools that help them efficiently write code that is formatted correctly, follow good coding practices, and know when team members make code changes. This is where Visual Studio Code extensions such as Prettier, ESLint, and GitLens become invaluable. Let’s install these tools.

Installing Visual Studio Code add-ons – Prettier

From the Extensions icon, add the Prettier Code formatter extension:

Figure 1.13 – Extensions can be accessed by clicking the cubes icon

Figure 1.13 – Extensions can be accessed by clicking the cubes icon

Prettier will automatically format code without taking extra time to type tabs manually. In this example, the code to the left is unformatted. We can now invoke Prettier by right-clicking the code and selecting Format Document:

Figure 1.14 – Example of unformatted code before Prettier

Figure 1.14 – Example of unformatted code before Prettier

The code is then reformatted in a structured manner...

Unlock full access

Continue reading for free

A Packt free trial gives you instant online access to our library of over 7000 practical eBooks and videos, constantly updated with the latest in tech
Start a 7-day FREE trial
End of Section 5
Next Section
bookmark search playlist download
font-size

Change the font size

margin-width

Change margin width

day-mode

Change background colour

Close icon Search
Country selected
Close icon Your notes and bookmarks

Delete Bookmark

Modal Close icon
Are you sure you want to delete it?
Cancel
Yes, Delete