A collection of websites focused on browsers usage and features.
Open an issue or (faster) a pull request.
Old good public/index.html
editing.
npm install
- (optional) create
.env
from.env.example
, then edit it - (local)
npm run dev
or (prod)npm run build
Websites colors are CSS custom properties in /src/css/config/sites.css
.
Note
Thou plain CSS is used in this project, you can write inline CSS comments using //
thanks to the PostCSS config.
Tests use Playwright and can be run with npm test
. They can all run locally or in a GitHub action.
Before running tests locally:
- make sure the project is accessible from a URL (e.g. using
npm run preview
); - add this URL in the
PW_BASE_URL
entry of your.env
; npx playwright install
pulls the headless browsers used by the test.
You can also play with Playwright GUI by running npm run test:ui
.
URLs are tested on merge requests using Lychee in a GitHub Action. To test URLs locally install Lychee and run npm run test:absolute-links
.
When running the tests locally, the results are in /tests/results
:
{tld}-{timestamp}.json
: JSON report of the test suites;html/index.html
: HTML report of the latest test suites;axe-html/{tld}-{timestamp}-{wcag2-a|wcag2-aa|others}.html
: HTML reports of the accessibility tests, split by category (WCAG 2 A, WCAG 2 AA, others);
When running in a GitHub action, the “summary” view of the GitHub Action has an artifact section at the very bottom. The artifact archive contains the same HTML report as in html/index.html
when you run tests locally.
When you open it and pick one of the accessibility tests, look into the “attachment” to find the HTML report dedicated to accessibility issues (as well as a JSON file).
Last deployment: