Connect & Get help from fellow developers on our Discord community.

Run accessibility checks on a WebDriverIO sample repo

Try out App Accessibility Automation with BrowserStack’s sample repository.

BrowserStack App Automate supports running WebDriverIO (WDIO) tests on a wide range of real Android and iOS devices. You can integrate your existing WDIO test suites with App Automate to run accessibility checks on your mobile apps.
This guide helps you run your first WDIO test build on a real Android or iOS device on BrowserStack.

Prerequisites

Ensure you have a BrowserStack Username and Access Key. Obtain your userName and accessKey from the Account & Profile section on the dashboard.
If you have not yet created an account, sign up for a free trial.
Supported test runners:
- Mocha
- Cucumber
Supported WDIO versions:
- WDIO v8
- WDIO v9
Supported WDIO Service versions:
- For WDIO v8, the minimum supported version is v8.42.0.
- For WDIO v9, the minimum supported version is v9.6.0.
Node.js recommendations:
- For WDIO v8, use Node.js v16.19.0.
- For WDIO v9, use Node.js v20.11.1.
- To install, run nvm install <node.js version> in your terminal.

Run a sample build

Get the sample project

Get the sample project using one of the following options:

Option 1: Download repository

Download the sample WDIO repository.

Option 2: Clone repository

Clone the sample Git repository using the following command:

git clone -b sdk https://github.com/browserstack/webdriverio-appium-app-browserstack

Navigate to the platform directory

Based on your testing platform, navigate to the android or iOS directory.

cd webdriverio-appium-app-browserstack/android

cd webdriverio-appium-app-browserstack/ios

Set up the dependencies

Open the package.json file.

Update the WDIO dependencies to either version 8 or 9, depending on your current setup. This applies to both Android and iOS projects.
For example, see the following sample package.json file with WDIO dependencies set to version 9.

...
"dependencies": {
 "@wdio/cli": "^9",
 "chai": "^4.3.6",
 "webdriverio": "^9"
  },
  "devDependencies": {
 "@wdio/browserstack-service": "^9",
 "@wdio/local-runner": "^9",
 "@wdio/mocha-framework": "^9"
  }
...

Install the dependencies.
```
npm install
```

Modify the WDIO configuration file

The WDIO configuration file, parallel.conf.js, defines the required capabilities to run tests on BrowserStack. It is platform-specific and located in the corresponding platform folder. In the BrowserStack sample repository, it is located in the android/examples/run-parallel-tests or ios/examples/run-parallel-tests folder. Make sure you modify the file that corresponds to your testing platform.

Open the parallel.conf.js file.
Set your BrowserStack userName and accessKey.
Set the accessibility flag to true. The default value is false.
Based on your test runner, set the framework to mocha or cucumber.
Save the file.

The projectName and buildName config must be static and not change across different runs of the same build. This is a deviation in approach as specified by BrowserStack App Automate since Automated tests will automatically identify different build runs.

Copy

Run the sample test

From your platform folder (Android or iOS), run the following command:

npm run test

View the Accessibility test report

After the test completes, access the report in your project folder on the App Accessibility dashboard.

Visit App Accessibility dashboard

Next steps

Integrate App Accessibility Automation with your existing WDIO test suite.

Did this page help you?

We're sorry to hear that. Please share your feedback so we can do better

Contact our Support team for immediate help while we work on improving our docs.

We're continuously improving our docs. We'd love to know what you liked

This page has exactly what I am looking for
This content & code samples are accurate and up-to-date
The content on this page is easy to understand
Other (please tell us more below)

Any additional feedback?

Thank you for your valuable feedback

Is this page helping you?

Yes

We're sorry to hear that. Please share your feedback so we can do better

Contact our Support team for immediate help while we work on improving our docs.

We're continuously improving our docs. We'd love to know what you liked

This page has exactly what I am looking for
This content & code samples are accurate and up-to-date
The content on this page is easy to understand
Other (please tell us more below)

Any additional feedback?

Thank you for your valuable feedback!