I plan to create a playwright-demo repository showing off different features of playwright.
For many of the tests I will be using - https://www.automationexercise.com/
The framework we are using is Playwright. If you want a good video to introduce you to Playwright, check out this video. You can try out playwright in the cloud here.
For helpful tips checkout https://playwrightsolutions.com
If you want to run this on your local machine, git clone the repo to local. In the main directory run the below commands. This will install playwright dependencies on your machine.
npm install
npx playwright installYou can easily start a project from scratch by running the below command from an empty directory. This will even create the GitHub Actions file for running these tests in the cloud.
npm init playwright@latestFrom a new directory run npm init playwright
npx playwright testnpx playwright codegenThe Playwright team has released a VS Code Extension that allows you to debug tests easily with the click or right click of a button.
*Playwright API Assertions - docs to the API assertions using Jest
I use genson-js to generate JSONSchema for schema snapshot testing. https://github.com/aspecto-io/genson-js. For most of our API calls we will do a JSON schema check. This can be done with the below lines of code.
//This section does Json Schema Assertions
let jsonName = "{VERB}_{endpoint_name}";
let path = "{path}";
//Comment this command once you have created the schema and saved
//createJsonSchema(jsonName, path, body);
let existingSchema = require("../../.api/" +
path +
"/" +
jsonName +
"_schema.json");
let responseSchema = getSchemaFromJson(body);
expect(responseSchema).toEqual(existingSchema);
schemaEqual(existingSchema, body);Update current snapshots
npx playwright test --update-snapshotsYou will run into scenarios where you will need to add a update a snapshot image. The best way to do this is running the test within a local docker container with the flag --update-snapshots.
If running on a M1 mac, this playwright docker image will work
docker run --ipc=host --shm-size=1gb --rm --network host -v $(pwd):/work/ -w /work/ -it mcr.microsoft.com/playwright:v1.32.3-arm64 npx playwright test tests/ui/loginUser.spec.ts While at the bash prompt in the docker container you can run this command which will install playwright and all the dependencies and run all the tests and update the snapshots
npm ci && npx playwright install --with-deps && npx playwright test --update-snapshotsNote these packages are automatically installed when running the install commands above
- @playwright/test | Playwright Docs - allows us to use the playwright test runner along with playwright
- dotenv - allows us to use the .env file at the root of the directory to use environment variables
- genson-js - used in JSON schema generation and comparison