Skip to main content
Transform your testing process with: Real Device Features, Company-wide Licences, & Test Observability

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.

Note: Puppeteer tests run on BrowserStack using a client-server architecture. So, test assertions run on the client side and hence BrowserStack won’t know whether your tests have passed or failed. Learn more about how to mark tests as passed or failed on BrowserStack.

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

Is this page helping you?

Yes
No

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!

Talk to an Expert
Download Copy