Key points
After the wizard, the project folder looks like this:
| File or folder | Role |
|---|---|
tests/ | Your tests. Any file ending in .spec.ts is a test file |
playwright.config.ts | Run settings: browsers, reports, retries |
package.json | Project details and the packages it uses |
package-lock.json | Exact package versions. Not edited by hand |
node_modules/ | The downloaded packages. Heavy, and not touched |
.gitignore | What not to store in version control |
After the first run, two folders are added: playwright-report/ (the HTML report) and test-results/ (screenshots, video and trace of failed tests).
How to read a test
The example test is a few lines. test defines a test, page is the browser tab, await waits for each step to finish, and expect checks a result.