Update playwright + deps install

.github/workflows/ci.yml

@@ -208,6 +208,8 @@ jobs:
         npm ci
         sudo apt-get update
         sudo apt-get install lighttpd
+        sudo npm install -D @playwright/test@latest
+        npm install --save-dev @types/node @types/yauzl
     - name: Install Playwright Browsers
       run: npx playwright install --with-deps
     - name: Download online-ui

package.json

@@ -1,6 +1,6 @@
 {
   "devDependencies": {
-    "@playwright/test": "^1.47.2",
+    "@playwright/test": "^1.48.2",
     "@types/node": "^22.7.4",
     "@types/yauzl": "^2.10.3"
   },

tests/playwright/README.md

@@ -1,19 +1,26 @@
 This directory contains the webapp tests, that use playwright.
 
-### Install deps
+### Install/update playwright
+
+Regularly update playwright to test on up to date browsers, and match the CI version.
 
 ```sh
-npm install --save-dev @types/node @types/yauzl
+npm install -D @playwright/test@latest
+npx playwright install --with-deps
 ```
 
-### Recompute screenshots and downloaded exports
+### Install deps
 
 ```sh
-UPDATE_EXPORTS=true npx playwright test --update-snapshots --project firefox
+npm install --save-dev @types/node @types/yauzl
 ```
 
-for a given test or test group
+### Recompute screenshots and downloaded exports
+
+`UPDATE_EXPORTS=true` is similar to playwright `--update-snapshots`, but for downloaded files
 
 ```sh
-UPDATE_EXPORTS=true npx playwright procedure.spec.ts:449 files --update-snapshots --project firefox     
+UPDATE_EXPORTS=true npx playwright test --update-snapshots
+UPDATE_EXPORTS=true npx playwright test --update-snapshots --project firefox
+UPDATE_EXPORTS=true npx playwright test procedure.spec.ts:449 --update-snapshots
 ```

tests/playwright/procedure.spec.ts

@@ -790,7 +790,9 @@ test.describe('projects_and_files', () => {
     );
     await utils.wait_for_file_load(page, { timeout: 10000 });
     const contact_map = page.locator('#map-container');
-    await expect.soft(contact_map).toHaveScreenshot();
+
+    const opts_screen = { threshold: 0.2, maxDiffPixels: 150 }
+    await expect.soft(contact_map).toHaveScreenshot(opts_screen);
 
     // TODO: fix this flaky test: sometimes the graph doesn't show, bug?
     // simulate and test screenshot