Run Playwright test from behind proxies

A guide to running Playwright tests on BrowserStack from behind a proxy

Important: Playwright testing on BrowserStack (beta) is not available to all users yet. If you’d like to get access, please submit a request here.

What is the use case?

If you are behind a corporate proxy then it is likely that your playwright script would not be able to reach the CDP endpoint of BrowserStack which is invoked from within the playwright.connect method. To make it work, you’d need to make some additional configuration settings at your end and that is exactly what is explained in this document.

If the website that you want to test is also behind a proxy then you would need to set up BrowserStack Local with additional config parameters in addition to following the instructions as mentioned in this document.

Configuration to enable Playwright testing on BrowserStack from behind a proxy

We would be using the global-agent npm package for the configuration. You have to ensure that the package is installed as a dev-dependency by running:

npm i --save-dev global-agent

The next step is to set the following environment variable in your system with the relevant proxy-host, proxy-port and proxy credential (if any):

export GLOBAL_AGENT_HTTP_PROXY=http://someuser:test123@127.0.0.1:3128

In the above example proxy-host is 127.0.0.1, proxy-port is 3128, proxy-username is someuser and proxy-password is test123. Please ensure that you set this environment variable with the correct values as relevant for your system, before starting the tests.

Running the Playwright test on BrowserStack using the proxy config

The following sample script makes use of the global0-agent npm package and calls bootstrap() which takes care of proxy and ensures that the test runs without any hurdles (you can also find this sample script in this GitHub repository):

const expect = require('chai').expect
const { chromium } = require('playwright');

const cp = require('child_process');
const clientPlaywrightVersion = cp.execSync('npx playwright --version').toString().trim().split(' ')[1];

const { bootstrap } = require('global-agent');

// Have to set this environment variable with required data before executing this script 
// export GLOBAL_AGENT_HTTP_PROXY=http://someuser:test123@127.0.0.1:3128

bootstrap();

(async () => {
    const caps = {
        'browser': 'chrome',  // allowed browsers are `chrome`, `edge`, `playwright-chromium`, `playwright-firefox` and `playwright-webkit`
        'os': 'osx',
        'os_version': 'catalina',
        'name': 'My first playwright test',
        'build': 'playwright-build-1',
        'browserstack.username': process.env.BROWSERSTACK_USERNAME || 'YOUR_USERNAME',
        'browserstack.accessKey': process.env.BROWSERSTACK_ACCESS_KEY || 'YOUR_ACCESS_KEY',
        'client.playwrightVersion': clientPlaywrightVersion  // Playwright version being used on your local project needs to be passed in this capability for BrowserStack to be able to map request and responses correctly
    };
    const browser = await chromium.connect({
        wsEndpoint: `wss://cdp.browserstack.com/playwright?caps=${encodeURIComponent(JSON.stringify(caps))}`,
    });
    const page = await browser.newPage();
    await page.goto('https://www.google.com/ncr');
    const element = await page.$('[aria-label="Search"]');
    await element.click();
    await element.type('BrowserStack');
    await element.press('Enter');
    const title = await page.title('');
    console.log(title);
    try {
        expect(title).to.equal("BrowserStack - Google Search", 'Expected page title is incorrect!');
        // following line of code is responsible for marking the status of the test on BrowserStack as 'passed'. You can use this code in your after hook after each test
        await page.evaluate(_ => {}, `browserstack_executor: ${JSON.stringify({action: 'setSessionStatus',arguments: {status: 'passed',reason: 'Title matched'}})}`);
    } catch {
        await page.evaluate(_ => {}, `browserstack_executor: ${JSON.stringify({action: 'setSessionStatus',arguments: {status: 'failed',reason: 'Title did not match'}})}`);
    }
    await browser.close();
  })();
Note: If the website that you want to test is also behind a proxy then you would need to set up BrowserStack Local with additional config parameters in addition to following the instructions as mentioned in this document.

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
Talk to an Expert