Run Playwright test from behind proxies
A guide to running Playwright tests on BrowserStack Automate from behind a proxy
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();
})();
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.
Prerequisites
NodeJS, Python, and Playwright-python installed.
Inside the package
folder, the driver
folder contains the Playwright JavaScript source code.
Get the location of the playwright-python
package on your machine.
The location of packages installed by pip
is shown below. The python3.10
might change depending on the version of Python installed on your machine.
/usr/local/lib/python3.10/site-packages
Navigate to the Playwright package path:
/usr/local/lib/python3.10/site-packages/playwright
Install the global-agent npm
package in the /usr/local/lib/python3.10/site-packages/playwright/driver/
package folder by running the following command:
npm i global-agent
Add the code in the Playwright codebase to run the bootstrap
function.
Open the file /usr/local/lib/python3.10/site-packages/playwright/driver/package/lib/cli/cli.js
This file is called to execute the Playwright commands.
In the file, add the following code:
const { bootstrap } = require('global-agent');
if (process.env.GLOBAL_AGENT_HTTP_PROXY) bootstrap();
The changes mentioned above are a one-time change and only need to be re-done if we uninstall/reinstall/update the playwright-python package.
Pass the proxy information to the playwright run
command.
Here is an example command:
export GLOBAL_AGENT_HTTP_PROXY=http://localhost:8888; python3 py_pw.py
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
- RESOURCES
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!