What is @wdio/browserstack-service?
@wdio/browserstack-service is a WebdriverIO service that provides integration with BrowserStack, a cloud-based cross-browser testing platform. This service allows you to run your WebdriverIO tests on BrowserStack's infrastructure, enabling you to test your web applications across a wide range of browsers and devices.
What are @wdio/browserstack-service's main functionalities?
BrowserStack Local Testing
This feature allows you to test your local applications on BrowserStack by establishing a secure connection between your local machine and BrowserStack's infrastructure.
const { remote } = require('webdriverio');
const browserstack = require('@wdio/browserstack-service');
const options = {
user: 'YOUR_BROWSERSTACK_USERNAME',
key: 'YOUR_BROWSERSTACK_ACCESS_KEY',
services: ['browserstack'],
capabilities: {
'bstack:options': {
os: 'Windows',
osVersion: '10',
local: true,
seleniumVersion: '3.141.59'
},
browserName: 'chrome',
browserVersion: 'latest'
}
};
(async () => {
const browser = await remote(options);
await browser.url('http://localhost:3000');
console.log(await browser.getTitle());
await browser.deleteSession();
})();
Parallel Testing
This feature allows you to run tests in parallel across multiple browsers and operating systems, significantly reducing the time required for test execution.
const { remote } = require('webdriverio');
const browserstack = require('@wdio/browserstack-service');
const options = {
user: 'YOUR_BROWSERSTACK_USERNAME',
key: 'YOUR_BROWSERSTACK_ACCESS_KEY',
services: ['browserstack'],
capabilities: [
{
'bstack:options': {
os: 'Windows',
osVersion: '10',
seleniumVersion: '3.141.59'
},
browserName: 'chrome',
browserVersion: 'latest'
},
{
'bstack:options': {
os: 'OS X',
osVersion: 'Big Sur',
seleniumVersion: '3.141.59'
},
browserName: 'safari',
browserVersion: 'latest'
}
]
};
(async () => {
const browser1 = await remote(options.capabilities[0]);
const browser2 = await remote(options.capabilities[1]);
await browser1.url('https://www.example.com');
await browser2.url('https://www.example.com');
console.log(await browser1.getTitle());
console.log(await browser2.getTitle());
await browser1.deleteSession();
await browser2.deleteSession();
})();
Automated Screenshots
This feature allows you to take automated screenshots of your web application during test execution, which can be useful for visual regression testing and debugging.
const { remote } = require('webdriverio');
const browserstack = require('@wdio/browserstack-service');
const options = {
user: 'YOUR_BROWSERSTACK_USERNAME',
key: 'YOUR_BROWSERSTACK_ACCESS_KEY',
services: ['browserstack'],
capabilities: {
'bstack:options': {
os: 'Windows',
osVersion: '10',
seleniumVersion: '3.141.59'
},
browserName: 'chrome',
browserVersion: 'latest'
}
};
(async () => {
const browser = await remote(options);
await browser.url('https://www.example.com');
await browser.saveScreenshot('./screenshot.png');
await browser.deleteSession();
})();
Other packages similar to @wdio/browserstack-service
@wdio/sauce-service
@wdio/sauce-service is a WebdriverIO service that provides integration with Sauce Labs, another cloud-based cross-browser testing platform. Similar to @wdio/browserstack-service, it allows you to run your WebdriverIO tests on Sauce Labs' infrastructure, offering features like parallel testing and automated screenshots.
webdriverio
WebdriverIO is a popular testing framework for Node.js that allows you to run tests on various browsers and devices. While it does not provide direct integration with BrowserStack or Sauce Labs, it can be extended with services like @wdio/browserstack-service and @wdio/sauce-service to achieve similar functionalities.
nightwatch
Nightwatch is an end-to-end testing framework that supports running tests on various browsers and devices. It offers built-in support for BrowserStack and Sauce Labs, making it a viable alternative to using WebdriverIO with @wdio/browserstack-service.
WebdriverIO Browserstack Service
A WebdriverIO service that manages local tunnel and job metadata for Browserstack users.
Installation
The easiest way is to keep @wdio/browserstack-service
as a devDependency in your package.json
.
{
"devDependencies": {
"@wdio/browserstack-service": "^5.0.0"
}
}
You can simple do it by:
npm install @wdio/browserstack-service --save-dev
Instructions on how to install WebdriverIO
can be found here.
Configuration
WebdriverIO has Browserstack support out of the box. You should simply set user
and key
in your wdio.conf.js
file. This service plugin provides supports for Browserstack Tunnel. Set browserstackLocal: true
also to activate this feature.
export.config = {
services: ['browserstack'],
user: process.env.BROWSERSTACK_USERNAME,
key: process.env.BROWSERSTACK_ACCESS_KEY,
browserstackLocal: true,
};
Options
user
Your Browserstack username.
Type: String
key
Your Browserstack access key.
Type: String
browserstackLocal
Set this to true to enable routing connections from Browserstack cloud through your computer. You will also need to set browserstack.local
to true in browser capabilities.
Type: Boolean
Default: false
browserstackLocalForcedStop
Set this to true to kill the browserstack process on complete, without waiting for the browserstack stop callback to be called. This is experimental and should not be used by all. Mostly necessary as a workaraound for this issue.
Type: Boolean
Default: false
browserstackOpts
Specified optional will be passed down to BrowserstackLocal. See this list for details.
Type: Object
Default: {}
Known Issues
- It's more of how webdriverio desigend the multi-process model. It is extremely hard if not impossible to reliable transfer localIdentifier to child-processes. We recommend to use it without the identifier at this moment, which will create an account-wide local tunnel.
Credits
For more information on WebdriverIO see the homepage.
Thanks for Browserstack to provide us with a free account for automated tests.