Feature/playwright checks

.github/workflows/check.yml

@@ -9,9 +9,10 @@ on:
 
 jobs:
   check:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-24.04
     permissions:
       contents: read
+      checks: write
 
     steps:
       - uses: actions/checkout@v4
@@ -22,5 +23,20 @@ jobs:
           distribution: 'zulu'
       - uses: gradle/actions/setup-gradle@v4
 
+      - name: Download Icons
+        run: (cd mock && curl -Lo AdobeSpectrumIcons18.woff2 "https://developer.adobe.com/experience-manager/reference-materials/6-5/coral-ui/coralui3/resources/coralui-component-icon/AdobeSpectrumIcons18.woff2?651453a29a2cf87546cdc6215616731e" && curl -Lo AdobeSpectrumIcons24.woff2 "https://developer.adobe.com/experience-manager/reference-materials/6-5/coral-ui/coralui3/resources/coralui-component-icon/AdobeSpectrumIcons24.woff2?b750bfd862e4ef0daea700228de3e788")
+
       - name: Run checks
-        run: ./gradlew check --continue
+        run: ./gradlew playwrightInstall check --continue
+
+      - uses: actions/upload-artifact@v4
+        if: ${{ !cancelled() }}
+        with:
+          name: reports
+          path: build/reports/
+          retention-days: 30
+
+      - uses: mikepenz/action-junit-report@v5
+        if: ${{ !cancelled() }}
+        with:
+          report_paths: '**/build/**/TEST-*.xml'

CONTRIBUTING.md

@@ -24,9 +24,20 @@ The following checks must succeed before code can be merged:
 - Prettier
 - TypeScript compile
 - ESLint
+- Playwright
 
 The `./gradlew check` command executes them all. To reformat code, use `./gradlew prettierFormat`.
 
+The playwright tests also include visual regression tests. The reference images only exist for chromium on linux. All other variations have been deemed too flaky. If you are not on linux (or WSL), you can use docker to run the tests (check the current version of playwright in `package.json` and adjust `PLAYWRIGHT_VERSION` accordingly):
+
+```bash
+PLAYWRIGHT_VERSION=v1.49.0
+./gradlew frontendBuild
+docker run -v .:/app --workdir /app -it --rm mcr.microsoft.com/playwright:$PLAYWRIGHT_VERSION-noble npm run test:playwright
+```
+
+Exclude the playwright task from `./gradlew check` by passing `-x playwright`.
+
 ### Working on the GUI editor
 
 To run the editor GUI independently from AEM (and with mocked responses), the watch mode can be used: