These tests are designed to run from GitHub action or CI.
They are intended to verify basic functionality is working during the building of the application(Just before deployment to staging or production).
- https://playwright.dev/
- https://playwright.dev/docs/ci-intro
- https://direnv.net/docs/installation.html
Before you can run, you need to set up your environment.
Running these tests requires playwright set up on your local machine, as well as NodeJS.
If you are a NixOS user, you can set up direnv and then cd into this directory in your shell.
When you do so the first time, you will be prompted to allow direnv which you can do using this command:
direnv allow
This may take a while the first time as NixOS builds you a sandbox environment.
For a non-NixOS user(Debian/Ubuntu) set up your environment by the following commands:
npm install
To install playwright browsers with OS-level dependencies use:
npx playwright install --with-deps chromium
NOTE: This only works with Debian/Ubuntu as they receive official support from playwright. It will also request your master password to install the dependencies.
There is a bash helper script that will let you quickly create a new test:
Usage: ./record-test.sh TESTNAME
e.g. ./record-test.sh mytest
will write a new test to tests/mytest.spec.ts
Do not use spaces in your test name.
Test files MUST END in .spec.ts
After recording your test, close the test browser.
You can then run your test by doing:
./run-tests.sh
By default, this will run in headless
mode just as it is in CI.
./run-tests.sh
NOTE: To run it in UI
mode, add the --ui
tag to the script.
$PLAYWRIGHT \
test \
--ui \
--project chromium
To add tests for CI, use the recorded tests then modify it for CI.
The tests can be modified to include time-outs, and waiting for events/actions etc. For more look go through playwright's documentation.
An example of a line-recorded test would look like:
await page.getByRole('img', { name: 'image' }).click();
For the CI the line could be modified and turned into an assertion using expect
to test if the specific element is visible.
await expect(page.getByRole('img', { name: 'image' })).toBeVisible();