Migrate existing Puppeteer test suites
A guide to integrating your existing Puppeteer test suites to run on BrowserStack
A basic locally running Puppeteer script
The following is a very simple Puppeteer script that would spawn up a browser on your local system and run the script:
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({ headless: false }); // This line is responsible for launching a new chromium browser
const page = await browser.newPage();
await page.goto('https://google.com');
await page.screenshot({ path: 'google.png' });
await browser.close();
})();
What needs to change to make the script work on BrowserStack?
In the above script, we saw that puppeteer.launch
is used to spawn up a new browser window in the system where the script is running and the rest of the script works on that browser. To make the same script work on BrowserStack, you would need to add the following instead of puppeteer.launch
:
const caps = {
'browser': 'chrome',
'browser_version': 'latest',
'os': 'os x',
'os_version': 'mojave',
'browserstack.username': process.env.BROWSERSTACK_USERNAME || 'YOUR_USERNAME',
'browserstack.accessKey': process.env.BROWSERSTACK_ACCESS_KEY || 'YOUR_ACCESS_KEY'
};
const browser = await puppeteer.connect({
browserWSEndpoint:
`ws://cdp.browserstack.com/puppeteer?caps=${encodeURIComponent(JSON.stringify(caps))}`,
});
// puppeteer.connect needs to be used to connect to BrowserStack instead of using puppeteer.launch
As you can see in the above snippet, you need to use puppeteer.connect
to connect to the CDP endpoint at BrowserStack. The caps
variable is used to send the additional parameters to BrowserStack so that the specific browser/OS combination can be assigned to your test.
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
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
Thank you for your valuable feedback!