Playwright Running In Github Actions
March 04, 2021
How I got Playwright Working in a Github Action
A few weeks ago we started using Playwright to test some of our core user flows of our application, in an end-to-end fashion. We take a lot of our testing strategy from Kent C. Dodds, as well as test plan strategy from Roy Osherove.
Since a fair few cases we have are covered by our integration testing, we are only hitting main flows a user will take while using our application.
To deploy, we use a Github action that checks-out, builds, tests, and deploys our code. Here are the sticking points we ran into when getting the Playwright tests to work.
-
The Chrome sandbox not allowing tests to run - The fix:
browser = await chromium.launch({ headless: IS_HEADLESS, chromiumSandbox: false, args: ['--no-sandbox', '--disable-setuid-sandbox'], });
So, this is kind of breaking some security practices, but since we are running the tests in an isolated, secure sandbox, this was a tradeoff we were willing to make. We also aren't exposing any sensitive data or anything, so thats another reason why we found no problem running the chromium instance without sandboxing.
-
Not being able to upload a file - The fix:
page.on('filechooser', async (fileChooser) => { await fileChooser.setFiles('./__fixtures__/example.txt'); });
The file path is a relative path of where your node
cwd()
is, for example my__fixtures__
folder is in the directory in this structure:tests
|-------__tests__/
|-------package.json
|-------__fixtures__/
- Waiting for hidden selectors - The fix:
await page.waitForSelector('div:text-matches("example.txt")', {
state: 'hidden',
});
Which waits for the div with text content of example.txt
to be hidden from the page.
These were the main sticking points I had getting Playwright to work in production.