End-to-end tests (short e2e) are split into two parts:
- The rendered UI (short: fixture)
- Instrumentation of that UI
The composition of all tests happens in ./index.js
.
The rendered UI is located inside a separate file in ./fixtures
and written as a React component.
If you're adding a new test prefer a new component instead of editing existing files since that might unknowingly alter existing tests.
We're using playwright
to replay user actions.
Each test tests only a single fixture.
A fixture can be loaded with await renderFixture(fixturePath)
, for example renderFixture('FocusTrap/OpenFocusTrap')
.
For development pnpm test:e2e:dev
and pnpm test:e2e:run --watch
in separate terminals is recommended.
command | description |
---|---|
pnpm test:e2e |
Full run |
pnpm test:e2e:dev |
Prepares the fixtures to be able to test in watchmode |
pnpm test:e2e:run |
Runs the tests (requires pnpm test:e2e:dev or pnpm test:e2e:build +pnpm test:e2e:server ) |
pnpm test:e2e:build |
Builds the webpack bundle for viewing the fixtures |
pnpm test:e2e:server |
Serves the fixture bundle. |