Cypress visual regression testing

.github/workflows/cypress.yml

@@ -0,0 +1,38 @@
+name: Cypress visual regression tests
+
+on:
+  push:
+    branches: [ master ]
+  pull_request:
+    branches: [ master ]
+
+jobs:
+  cypress-run:
+    runs-on: ubuntu-22.04
+    container:
+      # This must stay in sync with the image used by the test-{site}-visual scripts in package.json.
+      image: cypress/browsers:node-20.14.0-chrome-125.0.6422.141-1-ff-126.0.1-edge-125.0.2535.85-1
+      options: --user 1001
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Cypress run (Ada)
+        uses: cypress-io/github-action@v6
+        with:
+          component: true
+          browser: chrome
+        env:
+          CYPRESS_SITE: ada
+      - name: Cypress run (Physics)
+        uses: cypress-io/github-action@v6
+        with:
+          component: true
+          browser: chrome
+        env:
+          CYPRESS_SITE: phy
+      - name: Upload artifacts
+        if: ${{ failure() }}
+        uses: actions/upload-artifact@v4
+        with:
+          name: visual-diffs
+          path: src/test/**/*.diff.png

.gitignore

@@ -8,6 +8,10 @@ bundle-stats-*.json
 
 # testing
 /coverage
+/cypress/screenshots
+/cypress/downloads
+*.actual.png
+*.diff.png
 
 # production
 /build

config/webpack.config.ada.cypress.js

@@ -0,0 +1,12 @@
+/* eslint-disable */
+const path = require('path');
+const configAda = require('./webpack.config.ada');
+const {merge} = require('webpack-merge');
+
+module.exports = env => {
+    let configAdaCypress = {
+        cache: {type: 'filesystem', name: 'cs'},
+    };
+
+    return merge(configAda({...env, isRenderer: false, prod: false}), configAdaCypress);
+};