We use Argos CI to detect visual regressions on Docusaurus.

This workspace can be run manually, but is generally run through the Argos GitHub Action.

The workflow execute those following steps:

• Build the website locally with yarn build:website:fast
• Start the website server with yarn serve:website on http://localhost:3000
• Take screenshots of all pages found in sitemap.xml with Playwright
• Upload all screenshots to Argos CI

This workflow runs for main and PR branches, and add a commit status to each PR with a visual diff that we can easily inspect.

Some additional capabilities:

• Use ./tests/screenshot.spec.ts to customize the screenshots we take, eventually filter out some useless sitemap pages like versioned docs
• Use ./tests/screenshot.css to hide flaky CSS elements: iframe, video, gif...