Update github action and puppeteer due to new security measures in `u…

…buntu-latest`/`ubuntu-24.04` (#2962) * fix(percy): update puppeteer * fix(percy): update puppeteer * fix(puppeteer tests): enable no-sandbox arg in puppeteer launch * fix(puppeteer tests): prepend vrt:components command with aa-exec --profile=chrome * fix(puppeteer tests): prepend vrt:components command with aa-exec --profile=chrome -- * fix(puppeteer tests): update page.waitForTimeout to use node setTimeout instead * fix(puppeteer tests): add comment about aa-exec/ubuntu-24.04 --------- Co-authored-by: Ddouglasz <[email protected]> Co-authored-by: Byron Wall <[email protected]>
commercetools · Oct 14, 2024 · 43599af · 43599af
1 parent 7b68886
commit 43599af
Show file tree

Hide file tree

Showing 4 changed files with 331 additions and 120 deletions.
diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
@@ -55,7 +55,13 @@ jobs:
         run: yarn visual-testing-app:build
 
       - name: Running Visual Regression Tests for UI components
-        run: yarn vrt:components
+      # aa-exec:
+      # ubuntu-24.04, the image used for `ubuntu-latest` as of Oct 14 2024(https://github.com/actions/runner-images/issues/10636), 
+      # introduced security measures in its app-armor security  (https://github.com/puppeteer/puppeteer/issues/12818#issuecomment-2247844464) 
+      # that made it so that puppeteers chromium installation is not whitelisted,
+      # which made it so that the chromium sandbox is not available and puppeteer errors out,
+      # so we need to specify that we are using app armor's chrome profile when running puppeteer (https://github.com/mermaid-js/mermaid-cli/issues/730#issuecomment-2408615110)
+        run: aa-exec --profile=chrome -- yarn vrt:components
         timeout-minutes: 20
         env:
           PERCY_TOKEN: ${{ secrets.PERCY_TOKEN }}

diff --git a/package.json b/package.json
@@ -136,7 +136,7 @@
     "postcss-value-parser": "4.2.0",
     "pptr-testing-library": "0.8.0",
     "prettier": "2.8.8",
-    "puppeteer": "19.11.1",
+    "puppeteer": "22.8.2",
     "qs": "6.13.0",
     "rcfile": "1.0.3",
     "react": "17.0.2",

diff --git a/packages/components/loading-spinner/src/loading-spinner.visualspec.js b/packages/components/loading-spinner/src/loading-spinner.visualspec.js
@@ -1,9 +1,10 @@
 import percySnapshot from '@percy/puppeteer';
+import { setTimeout } from 'node:timers/promises';
 
 describe('LoadingSpinner', () => {
   beforeAll(async () => {
     await page.goto(`${globalThis.HOST}/loading-spinner`);
-    await page.waitForTimeout(1001);
+    await setTimeout(1001);
   });
 
   it('Default', async () => {