Merge remote-tracking branch 'origin/version-4' into sites

.github/workflows/ci.yml

@@ -5,6 +5,11 @@ on:
   pull_request:
 permissions:
   contents: read # to fetch code (actions/checkout)
+
+env:
+  # We only install Chromium manually 
+  PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: '1'
+
 jobs:
   Tests:
     runs-on: ${{ matrix.os }}
@@ -30,7 +35,7 @@ jobs:
           node-version: ${{ matrix.node-version }}
           cache: pnpm
       - run: pnpm install --frozen-lockfile
-      - run: node node_modules/puppeteer/install.js
+      - run: pnpm playwright install chromium
       - run: pnpm test:integration
         env:
           CI: true

package.json

@@ -114,6 +114,7 @@
   "devDependencies": {
     "@ampproject/remapping": "^2.2.1",
     "@jridgewell/sourcemap-codec": "^1.4.15",
+    "@playwright/test": "^1.33.0",
     "@rollup/plugin-commonjs": "^24.1.0",
     "@rollup/plugin-json": "^6.0.0",
     "@rollup/plugin-node-resolve": "^15.0.2",
@@ -148,7 +149,6 @@
     "periscopic": "^3.1.0",
     "prettier": "^2.8.8",
     "prettier-plugin-svelte": "^2.10.0",
-    "puppeteer": "^19.8.5",
     "rollup": "^3.20.2",
     "source-map": "^0.7.4",
     "source-map-support": "^0.5.21",

pnpm-lock.yaml

@@ -10,6 +10,9 @@ importers:
       '@jridgewell/sourcemap-codec':
         specifier: ^1.4.15
         version: 1.4.15
+      '@playwright/test':
+        specifier: ^1.33.0
+        version: 1.33.0
       '@rollup/plugin-commonjs':
         specifier: ^24.1.0
         version: 24.1.0(rollup@3.20.2)
@@ -112,9 +115,6 @@ importers:
       prettier-plugin-svelte:
         specifier: ^2.10.0
         version: 2.10.0(prettier@2.8.8)(svelte@3.59.1)
-      puppeteer:
-        specifier: ^19.8.5
-        version: 19.8.5(typescript@5.0.4)
       rollup:
         specifier: ^3.20.2
         version: 3.20.2
@@ -262,14 +262,17 @@ packages:
   /@babel/code-frame@7.21.4:
     resolution: {integrity: sha512-LYvhNKfwWSPpocw8GI7gpK2nq3HSDuEPC/uSYaALSJu9xjsalaaYFOq0Pwt5KmVqwEbZlDu81aLXwBOmD/Fv9g==}
     engines: {node: '>=6.9.0'}
+    requiresBuild: true
     dependencies:
       '@babel/highlight': 7.18.6
     dev: true
+    optional: true
 
   /@babel/helper-validator-identifier@7.19.1:
     resolution: {integrity: sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==}
     engines: {node: '>=6.9.0'}
     dev: true
+    optional: true
 
   /@babel/highlight@7.18.6:
     resolution: {integrity: sha512-u7stbOuYjaPezCuLj29hNW1v64M2Md2qupEKP1fHc7WdOA3DgLh37suiSrZYY7haUB7iBeQZ9P1uiRF359do3g==}
@@ -279,6 +282,7 @@ packages:
       chalk: 2.4.2
       js-tokens: 4.0.0
     dev: true
+    optional: true
 
   /@codemirror/autocomplete@6.7.1(@codemirror/language@6.6.0)(@codemirror/state@6.2.0)(@codemirror/view@6.11.1)(@lezer/common@1.0.2):
     resolution: {integrity: sha512-hSxf9S0uB+GV+gBsjY1FZNo53e1FFdzPceRfCfD1gWOnV6o21GfB5J5Wg9G/4h76XZMPrF0A6OCK/Rz5+V1egg==}
@@ -1122,32 +1126,20 @@ packages:
       fastq: 1.15.0
     dev: true
 
-  /@polka/url@1.0.0-next.21:
-    resolution: {integrity: sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==}
-
-  /@puppeteer/browsers@0.4.0(typescript@5.0.4):
-    resolution: {integrity: sha512-3iB5pWn9Sr55PKKwqFWSWjLsTKCOEhKNI+uV3BZesgXuA3IhsX8I3hW0HI+3ksMIPkh2mVYzKSpvgq3oicjG2Q==}
-    engines: {node: '>=14.1.0'}
+  /@playwright/test@1.33.0:
+    resolution: {integrity: sha512-YunBa2mE7Hq4CfPkGzQRK916a4tuZoVx/EpLjeWlTVOnD4S2+fdaQZE0LJkbfhN5FTSKNLdcl7MoT5XB37bTkg==}
+    engines: {node: '>=14'}
     hasBin: true
-    peerDependencies:
-      typescript: '>= 4.7.4'
-    peerDependenciesMeta:
-      typescript:
-        optional: true
     dependencies:
-      debug: 4.3.4(supports-color@8.1.1)
-      extract-zip: 2.0.1
-      https-proxy-agent: 5.0.1
-      progress: 2.0.3
-      proxy-from-env: 1.1.0
-      tar-fs: 2.1.1
-      typescript: 5.0.4
-      unbzip2-stream: 1.4.3
-      yargs: 17.7.1
-    transitivePeerDependencies:
-      - supports-color
+      '@types/node': 20.1.3
+      playwright-core: 1.33.0
+    optionalDependencies:
+      fsevents: 2.3.2
     dev: true
 
+  /@polka/url@1.0.0-next.21:
+    resolution: {integrity: sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==}
+
   /@replit/codemirror-lang-svelte@6.0.0(@codemirror/autocomplete@6.7.1)(@codemirror/lang-css@6.2.0)(@codemirror/lang-html@6.4.3)(@codemirror/lang-javascript@6.1.8)(@codemirror/language@6.6.0)(@codemirror/state@6.2.0)(@codemirror/view@6.11.1)(@lezer/common@1.0.2)(@lezer/highlight@1.1.4)(@lezer/javascript@1.4.3)(@lezer/lr@1.3.4):
     resolution: {integrity: sha512-U2OqqgMM6jKelL0GNWbAmqlu1S078zZNoBqlJBW+retTc5M4Mha6/Y2cf4SVg6ddgloJvmcSpt4hHrVoM4ePRA==}
     peerDependencies:
@@ -1723,14 +1715,6 @@ packages:
       '@types/node': 20.1.3
     dev: false
 
-  /@types/yauzl@2.10.0:
-    resolution: {integrity: sha512-Cn6WYCm0tXv8p6k+A8PvbDG763EDpBoTzHdA+Q/MF6H3sapGjCm9NzoaJncJS9tUKSuCoDs9XHxYYsQDgxR6kw==}
-    requiresBuild: true
-    dependencies:
-      '@types/node': 20.1.3
-    dev: true
-    optional: true
-
   /@typescript-eslint/eslint-plugin@5.58.0(@typescript-eslint/parser@5.58.0)(eslint@8.35.0)(typescript@5.0.4):
     resolution: {integrity: sha512-vxHvLhH0qgBd3/tW6/VccptSfc8FxPQIkmNTVLWcCOVqSBvqpnKkBTYrhcGlXfSnd78azwe+PsjYFj0X34/njA==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
@@ -1988,6 +1972,7 @@ packages:
     dependencies:
       color-convert: 1.9.3
     dev: true
+    optional: true
 
   /ansi-styles@4.3.0:
     resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
@@ -2221,6 +2206,7 @@ packages:
       escape-string-regexp: 1.0.5
       supports-color: 5.5.0
     dev: true
+    optional: true
 
   /chalk@4.1.2:
     resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==}
@@ -2253,15 +2239,6 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
-  /chromium-bidi@0.4.6(devtools-protocol@0.0.1107588):
-    resolution: {integrity: sha512-TQOkWRaLI/IWvoP8XC+7jO4uHTIiAUiklXU1T0qszlUFEai9LgKXIBXy3pOS3EnQZ3bQtMbKUPkug0fTAEHCSw==}
-    peerDependencies:
-      devtools-protocol: '*'
-    dependencies:
-      devtools-protocol: 0.0.1107588
-      mitt: 3.0.0
-    dev: true
-
   /cliui@7.0.4:
     resolution: {integrity: sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==}
     dependencies:
@@ -2270,15 +2247,6 @@ packages:
       wrap-ansi: 7.0.0
     dev: true
 
-  /cliui@8.0.1:
-    resolution: {integrity: sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==}
-    engines: {node: '>=12'}
-    dependencies:
-      string-width: 4.2.3
-      strip-ansi: 6.0.1
-      wrap-ansi: 7.0.0
-    dev: true
-
   /code-block-writer@12.0.0:
     resolution: {integrity: sha512-q4dMFMlXtKR3XNBHyMHt/3pwYNA69EDk00lloMOaaUMKPUXBw6lpXtbu3MMVG6/uOihGnRDOlkyqsONEUj60+w==}
     dev: true
@@ -2312,6 +2280,7 @@ packages:
     dependencies:
       color-name: 1.1.3
     dev: true
+    optional: true
 
   /color-convert@2.0.1:
     resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
@@ -2323,6 +2292,7 @@ packages:
   /color-name@1.1.3:
     resolution: {integrity: sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==}
     dev: true
+    optional: true
 
   /color-name@1.1.4:
     resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
@@ -2376,16 +2346,6 @@ packages:
     resolution: {integrity: sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==}
     engines: {node: '>= 0.6'}
 
-  /cosmiconfig@8.1.3:
-    resolution: {integrity: sha512-/UkO2JKI18b5jVMJUp0lvKFMpa/Gye+ZgZjKD+DGEN9y7NRcf/nK1A0sp67ONmKtnDCNMS44E6jrk0Yc3bDuUw==}
-    engines: {node: '>=14'}
-    dependencies:
-      import-fresh: 3.3.0
-      js-yaml: 4.1.0
-      parse-json: 5.2.0
-      path-type: 4.0.0
-    dev: true
-
   /crelt@1.0.5:
     resolution: {integrity: sha512-+BO9wPPi+DWTDcNYhr/W90myha8ptzftZT+LwcmUbbok0rcP/fequmFYCw8NMoH7pkAZQzU78b3kYrlua5a9eA==}
     dev: false
@@ -2396,6 +2356,7 @@ packages:
       node-fetch: 2.6.7
     transitivePeerDependencies:
       - encoding
+    dev: false
 
   /cross-spawn@7.0.3:
     resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
@@ -2588,10 +2549,6 @@ packages:
   /devalue@4.3.0:
     resolution: {integrity: sha512-n94yQo4LI3w7erwf84mhRUkUJfhLoCZiLyoOZ/QFsDbcWNZePrLwbQpvZBUG2TNxwV3VjCKPxkiiQA6pe3TrTA==}
 
-  /devtools-protocol@0.0.1107588:
-    resolution: {integrity: sha512-yIR+pG9x65Xko7bErCUSQaDLrO/P1p3JUzEk7JCU4DowPcGHkTGUGQapcfcLc4qj0UaALwZ+cr0riFgiqpixcg==}
-    dev: true
-
   /diff@5.0.0:
     resolution: {integrity: sha512-/VTCrvm5Z0JGty/BWHljh+BAiw3IK+2j87NGMu8Nwc/f48WoDAC395uomO9ZD117ZOBaHmkX1oyLvkVM/aIT3w==}
     engines: {node: '>=0.3.1'}
@@ -2657,12 +2614,6 @@ packages:
     engines: {node: '>=0.12'}
     dev: true
 
-  /error-ex@1.3.2:
-    resolution: {integrity: sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==}
-    dependencies:
-      is-arrayish: 0.2.1
-    dev: true
-
   /es-abstract@1.21.2:
     resolution: {integrity: sha512-y/B5POM2iBnIxCiernH1G7rC9qQoM77lLIMQLuob0zhp8C56Po81+2Nj0WFKnd0pNReDTnkYryc+zhOzpEIROg==}
     engines: {node: '>= 0.4'}
@@ -2808,6 +2759,7 @@ packages:
     resolution: {integrity: sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==}
     engines: {node: '>=0.8.0'}
     dev: true
+    optional: true
 
   /escape-string-regexp@4.0.0:
     resolution: {integrity: sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==}
@@ -3112,20 +3064,6 @@ packages:
       type: 2.7.2
     dev: false
 
-  /extract-zip@2.0.1:
-    resolution: {integrity: sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg==}
-    engines: {node: '>= 10.17.0'}
-    hasBin: true
-    dependencies:
-      debug: 4.3.4(supports-color@8.1.1)
-      get-stream: 5.2.0
-      yauzl: 2.10.0
-    optionalDependencies:
-      '@types/yauzl': 2.10.0
-    transitivePeerDependencies:
-      - supports-color
-    dev: true
-
   /fast-deep-equal@3.1.3:
     resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}
     dev: true
@@ -3155,12 +3093,6 @@ packages:
       reusify: 1.0.4
     dev: true
 
-  /fd-slicer@1.1.0:
-    resolution: {integrity: sha512-cE1qsB/VwyQozZ+q1dGxR8LBYNZeofhEdUNGSMbQD3Gw2lAzX9Zb3uIU6Ebc/Fmyjo9AWWfnn0AUCHqtevs/8g==}
-    dependencies:
-      pend: 1.2.0
-    dev: true
-
   /fenceparser@1.1.1:
     resolution: {integrity: sha512-VdkTsK7GWLT0VWMK5S5WTAPn61wJ98WPFwJiRHumhg4ESNUO/tnkU8bzzzc62o6Uk1SVhuZFLnakmDA4SGV7wA==}
     engines: {node: '>=12'}
@@ -3328,13 +3260,6 @@ packages:
       has-symbols: 1.0.3
     dev: true
 
-  /get-stream@5.2.0:
-    resolution: {integrity: sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==}
-    engines: {node: '>=8'}
-    dependencies:
-      pump: 3.0.0
-    dev: true
-
   /get-symbol-description@1.0.0:
     resolution: {integrity: sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw==}
     engines: {node: '>= 0.4'}
@@ -3472,6 +3397,7 @@ packages:
     resolution: {integrity: sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==}
     engines: {node: '>=4'}
     dev: true
+    optional: true
 
   /has-flag@4.0.0:
     resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==}
@@ -3639,10 +3565,6 @@ packages:
       is-typed-array: 1.1.10
     dev: true
 
-  /is-arrayish@0.2.1:
-    resolution: {integrity: sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==}
-    dev: true
-
   /is-arrayish@0.3.2:
     resolution: {integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==}
     dev: true
@@ -3876,6 +3798,7 @@ packages:
   /js-tokens@4.0.0:
     resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
     dev: true
+    optional: true
 
   /js-yaml@4.1.0:
     resolution: {integrity: sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==}
@@ -3925,10 +3848,6 @@ packages:
       - utf-8-validate
     dev: true
 
-  /json-parse-even-better-errors@2.3.1:
-    resolution: {integrity: sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==}
-    dev: true
-
   /json-schema-traverse@0.4.1:
     resolution: {integrity: sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==}
     dev: true
@@ -4159,10 +4078,6 @@ packages:
       yallist: 4.0.0
     dev: true
 
-  /mitt@3.0.0:
-    resolution: {integrity: sha512-7dX2/10ITVyqh4aOSVI9gdape+t9l2/8QxHrFmUXu4EEUpdlxl6RudZUPZoc+zuY2hk1j7XxVroIVIan/pD/SQ==}
-    dev: true
-
   /mkdirp-classic@0.5.3:
     resolution: {integrity: sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A==}
     dev: true
@@ -4468,16 +4383,6 @@ packages:
     resolution: {integrity: sha512-ft3iAoLOB/MlwbNXgzy43SWGP6sQki2jQvAyBg/zDFAgr9bfNWZIUj42Kw2eJIl8kEi4PbgE6U1Zau/HwI75HA==}
     dev: true
 
-  /parse-json@5.2.0:
-    resolution: {integrity: sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==}
-    engines: {node: '>=8'}
-    dependencies:
-      '@babel/code-frame': 7.21.4
-      error-ex: 1.3.2
-      json-parse-even-better-errors: 2.3.1
-      lines-and-columns: 1.2.4
-    dev: true
-
   /parse5@7.1.2:
     resolution: {integrity: sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==}
     dependencies:
@@ -4517,10 +4422,6 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
-  /pend@1.2.0:
-    resolution: {integrity: sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==}
-    dev: true
-
   /periscopic@3.1.0:
     resolution: {integrity: sha512-vKiQ8RRtkl9P+r/+oefh25C3fhybptkHKCZSPlcXiJux2tJF55GnEj3BVn4A5gKfq9NWWXXrxkHBwVPUfH0opw==}
     dependencies:
@@ -4552,6 +4453,12 @@ packages:
       pngjs: 3.4.0
     dev: true
 
+  /playwright-core@1.33.0:
+    resolution: {integrity: sha512-aizyPE1Cj62vAECdph1iaMILpT0WUDCq3E6rW6I+dleSbBoGbktvJtzS6VHkZ4DKNEOG9qJpiom/ZxO+S15LAw==}
+    engines: {node: '>=14'}
+    hasBin: true
+    dev: true
+
   /pngjs@3.4.0:
     resolution: {integrity: sha512-NCrCHhWmnQklfH4MtJMRjZ2a8c80qXeMlQMv2uVp9ISJMTt562SbGd6n2oq0PaPgKm7Z6pL9E2UlLIhC+SHL3w==}
     engines: {node: '>=4.0.0'}
@@ -4634,15 +4541,6 @@ packages:
     engines: {node: '>= 0.6.0'}
     dev: true
 
-  /progress@2.0.3:
-    resolution: {integrity: sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==}
-    engines: {node: '>=0.4.0'}
-    dev: true
-
-  /proxy-from-env@1.1.0:
-    resolution: {integrity: sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==}
-    dev: true
-
   /psl@1.9.0:
     resolution: {integrity: sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==}
     dev: true
@@ -4659,52 +4557,6 @@ packages:
     engines: {node: '>=6'}
     dev: true
 
-  /puppeteer-core@19.8.5(typescript@5.0.4):
-    resolution: {integrity: sha512-zoGhim/oBQbkND6h4Xz4X7l5DkWVH9wH7z0mVty5qa/c0P1Yad47t/npVtt2xS10BiQwzztWKx7Pa2nJ5yykdw==}
-    engines: {node: '>=14.14.0'}
-    peerDependencies:
-      typescript: '>= 4.7.4'
-    peerDependenciesMeta:
-      typescript:
-        optional: true
-    dependencies:
-      '@puppeteer/browsers': 0.4.0(typescript@5.0.4)
-      chromium-bidi: 0.4.6(devtools-protocol@0.0.1107588)
-      cross-fetch: 3.1.5
-      debug: 4.3.4(supports-color@8.1.1)
-      devtools-protocol: 0.0.1107588
-      extract-zip: 2.0.1
-      https-proxy-agent: 5.0.1
-      proxy-from-env: 1.1.0
-      tar-fs: 2.1.1
-      typescript: 5.0.4
-      unbzip2-stream: 1.4.3
-      ws: 8.13.0
-    transitivePeerDependencies:
-      - bufferutil
-      - encoding
-      - supports-color
-      - utf-8-validate
-    dev: true
-
-  /puppeteer@19.8.5(typescript@5.0.4):
-    resolution: {integrity: sha512-WSjouU7eux6cwBMEz4A7mDRVZWTQQTDXrb1R6AhKDdeEgpiBBkAzcAusPhILxiJOKj60rULZpWuCZ7HZIO6GTA==}
-    requiresBuild: true
-    dependencies:
-      '@puppeteer/browsers': 0.4.0(typescript@5.0.4)
-      cosmiconfig: 8.1.3
-      https-proxy-agent: 5.0.1
-      progress: 2.0.3
-      proxy-from-env: 1.1.0
-      puppeteer-core: 19.8.5(typescript@5.0.4)
-    transitivePeerDependencies:
-      - bufferutil
-      - encoding
-      - supports-color
-      - typescript
-      - utf-8-validate
-    dev: true
-
   /querystringify@2.2.0:
     resolution: {integrity: sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==}
     dev: true
@@ -5231,6 +5083,7 @@ packages:
     dependencies:
       has-flag: 3.0.0
     dev: true
+    optional: true
 
   /supports-color@7.2.0:
     resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==}
@@ -5403,10 +5256,6 @@ packages:
       any-promise: 1.3.0
     dev: true
 
-  /through@2.3.8:
-    resolution: {integrity: sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==}
-    dev: true
-
   /timm@1.7.1:
     resolution: {integrity: sha512-IjZc9KIotudix8bMaBW6QvMuq64BrJWFs1+4V0lXwWGQZwH+LnX87doAYhem4caOEusRP9/g6jVDQmZ8XOk1nw==}
     dev: true
@@ -5567,13 +5416,6 @@ packages:
       which-boxed-primitive: 1.0.2
     dev: true
 
-  /unbzip2-stream@1.4.3:
-    resolution: {integrity: sha512-mlExGW4w71ebDJviH16lQLtZS32VKqsSfk80GCfUlwT/4/hNRFsoscrF/c++9xinkMzECL1uL9DDwXqFWkruPg==}
-    dependencies:
-      buffer: 5.7.1
-      through: 2.3.8
-    dev: true
-
   /undici@5.22.1:
     resolution: {integrity: sha512-Ji2IJhFXZY0x/0tVBXeQwgPlLWw13GVzpsWPQ3rV50IFMMof2I55PZZxtm4P6iNq+L5znYN9nSTAq0ZyE6lSJw==}
     engines: {node: '>=14.0'}
@@ -5905,11 +5747,6 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
-  /yargs-parser@21.1.1:
-    resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==}
-    engines: {node: '>=12'}
-    dev: true
-
   /yargs-unparser@2.0.0:
     resolution: {integrity: sha512-7pRTIA9Qc1caZ0bZ6RYRGbHJthJWuakf+WmHK0rVeLkNrrGhfoabBNdue6kdINI6r4if7ocq9aD/n7xwKOdzOA==}
     engines: {node: '>=10'}
@@ -5933,26 +5770,6 @@ packages:
       yargs-parser: 20.2.4
     dev: true
 
-  /yargs@17.7.1:
-    resolution: {integrity: sha512-cwiTb08Xuv5fqF4AovYacTFNxk62th7LKJ6BL9IGUpTJrWoU7/7WdQGTP2SjKf1dUNBGzDd28p/Yfs/GI6JrLw==}
-    engines: {node: '>=12'}
-    dependencies:
-      cliui: 8.0.1
-      escalade: 3.1.1
-      get-caller-file: 2.0.5
-      require-directory: 2.1.1
-      string-width: 4.2.3
-      y18n: 5.0.8
-      yargs-parser: 21.1.1
-    dev: true
-
-  /yauzl@2.10.0:
-    resolution: {integrity: sha512-p4a9I6X6nu6IhoGmBqAcbJy1mlC4j27vEPZX9F4L4/vZT3Lyq1VkFHw/V/PUcB9Buo+DG3iHkT0x3Qya58zc3g==}
-    dependencies:
-      buffer-crc32: 0.2.13
-      fd-slicer: 1.1.0
-    dev: true
-
   /yocto-queue@0.1.0:
     resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
     engines: {node: '>=10'}

test/custom-elements/index.js

@@ -1,73 +1,33 @@
+import { chromium } from '@playwright/test';
+import virtual from '@rollup/plugin-virtual';
+import { deepStrictEqual } from 'assert';
 import * as fs from 'fs';
 import * as path from 'path';
-import * as http from 'http';
 import { rollup } from 'rollup';
-import virtual from '@rollup/plugin-virtual';
-import puppeteer from 'puppeteer';
-import { addLineNumbers, loadConfig, loadSvelte, retryAsync, executeBrowserTest } from '../helpers';
-import { deepEqual } from 'assert';
-
-const page = `
-<body>
-	<main></main>
-	<script src='/bundle.js'></script>
-</body>
-`;
+import { loadConfig, loadSvelte } from '../helpers';
 
 const assert = fs.readFileSync(`${__dirname}/assert.js`, 'utf-8');
 
 describe('custom-elements', function () {
-	// Note: Increase the timeout in preparation for restarting Chromium due to SIGSEGV.
-	this.timeout(10000);
+	this.timeout(20000);
+
 	let svelte;
-	let server;
+	/** @type {import('@playwright/test').Browser} */
 	let browser;
-	let code;
-
-	function create_server() {
-		return new Promise((fulfil, reject) => {
-			const server = http.createServer((req, res) => {
-				if (req.url === '/') {
-					res.end(page);
-				}
-
-				if (req.url === '/bundle.js') {
-					res.end(code);
-				}
-			});
-
-			server.on('error', reject);
 
-			server.listen('6789', () => {
-				fulfil(server);
-			});
-		});
-	}
-
-	async function launchPuppeteer() {
-		return await retryAsync(() => puppeteer.launch());
-	}
-
-	before(async () => {
+	before(async function () {
 		svelte = loadSvelte();
-		console.log('[custom-element] Loaded Svelte');
-		server = await create_server();
-		console.log('[custom-element] Started server');
-		browser = await launchPuppeteer();
-		console.log('[custom-element] Launched puppeteer browser');
+		console.log('[custom-elements] Loaded Svelte');
+		browser = await chromium.launch();
+		console.log('[custom-elements] Launched browser');
 	});
 
 	after(async () => {
-		if (server) server.close();
 		if (browser) await browser.close();
 	});
 
 	fs.readdirSync(`${__dirname}/samples`).forEach((dir) => {
 		if (dir[0] === '.') return;
-		// MEMO: puppeteer can not execute Chromium properly with Node8,10 on Linux at GitHub actions.
-		const { version } = process;
-		if ((version.startsWith('v8.') || version.startsWith('v10.')) && process.platform === 'linux')
-			return;
 
 		const solo = /\.solo$/.test(dir);
 		const skip = /\.skip$/.test(dir);
@@ -114,12 +74,11 @@ describe('custom-elements', function () {
 				]
 			});
 
-			const result = await bundle.generate({ format: 'iife', name: 'test' });
-			code = result.output[0].code;
+			const generated_bundle = await bundle.generate({ format: 'iife', name: 'test' });
 
 			function assertWarnings() {
 				if (expected_warnings) {
-					deepEqual(
+					deepStrictEqual(
 						warnings.map((w) => ({
 							code: w.code,
 							message: w.message,
@@ -132,10 +91,17 @@ describe('custom-elements', function () {
 				}
 			}
 
-			browser = await executeBrowserTest(browser, launchPuppeteer, assertWarnings, () => {
-				console.log(addLineNumbers(code));
-				assertWarnings();
+			const page = await browser.newPage();
+			page.on('console', (type) => {
+				console[type.type()](type.text());
 			});
+			await page.setContent('<main></main>');
+			await page.evaluate(generated_bundle.output[0].code);
+			const test_result = await page.evaluate(`test(document.querySelector('main'))`);
+
+			if (test_result) console.log(test_result);
+			assertWarnings();
+			page.close();
 		});
 	});
 });

test/helpers.js

@@ -101,8 +101,7 @@ function cleanChildren(node) {
 		node.setAttribute(attr.name, attr.value);
 	});
 
-	// recurse
-	[...node.childNodes].forEach((child) => {
+	for (let child of [...node.childNodes]) {
 		if (child.nodeType === 3) {
 			// text
 			if (
@@ -130,7 +129,7 @@ function cleanChildren(node) {
 		}
 
 		previous = child;
-	});
+	}
 
 	// collapse whitespace
 	if (node.firstChild && node.firstChild.nodeType === 3) {
@@ -324,74 +323,10 @@ export function mkdirp(dir) {
 	}
 }
 
-export function prettyPrintPuppeteerAssertionError(message) {
+export function prettyPrintBrowserAssertionError(message) {
 	const match = /Error: Expected "(.+)" to equal "(.+)"/.exec(message);
 
 	if (match) {
 		assert.equal(match[1], match[2]);
 	}
 }
-
-/**
- *
- * @param {() => Promise<import ('puppeteer').Browser>} fn
- * @param {number} maxAttempts
- * @param {number} interval
- * @returns {Promise<import ('puppeteer').Browser>}
- */
-export async function retryAsync(fn, maxAttempts = 3, interval = 1000) {
-	let attempts = 0;
-	while (attempts <= maxAttempts) {
-		try {
-			return await fn();
-		} catch (err) {
-			if (++attempts >= maxAttempts) throw err;
-			await new Promise((resolve) => setTimeout(resolve, interval));
-		}
-	}
-}
-
-/**
- * NOTE: Chromium may exit with SIGSEGV, so retry in that case
- * @param {import ('puppeteer').Browser} browser
- * @param {() => Promise<import ('puppeteer').Browser>} launchPuppeteer
- * @param {() => void} additionalAssertion
- * @param {(err: Error) => void} onError
- * @returns {Promise<import ('puppeteer').Browser>}
- */
-export async function executeBrowserTest(browser, launchPuppeteer, additionalAssertion, onError) {
-	let count = 0;
-	do {
-		count++;
-		try {
-			const page = await browser.newPage();
-
-			page.on('console', (type) => {
-				console[type.type()](type.text());
-			});
-
-			page.on('error', (error) => {
-				console.log('>>> an error happened');
-				console.error(error);
-			});
-			await page.goto('http://localhost:6789');
-			const result = await page.evaluate(() => {
-				// @ts-ignore -- It runs in browser context.
-				return test(document.querySelector('main'));
-			});
-			if (result) console.log(result);
-			additionalAssertion();
-			await page.close();
-			break;
-		} catch (err) {
-			if (count === 5 || browser.isConnected()) {
-				onError(err);
-				throw err;
-			}
-			console.debug(err.stack || err);
-			console.log('RESTARTING Chromium...');
-			browser = await launchPuppeteer();
-		}
-	} while (count <= 5);
-	return browser;
-}

test/runtime-browser/assert.js

@@ -43,8 +43,23 @@ function normalizeHtml(window, html) {
 			.replace(/<!--.*?-->/g, '')
 			.replace(/>[\s\r\n]+</g, '><')
 			.trim();
+
+		normalizeStyles(node);
+
 		return node.innerHTML.replace(/<\/?noscript\/?>/g, '');
 	} catch (err) {
 		throw new Error(`Failed to normalize HTML:\n${html}`);
 	}
 }
+
+function normalizeStyles(node) {
+	if (node.nodeType === 1) {
+		if (node.hasAttribute('style')) {
+			node.style = node.style.cssText;
+		}
+
+		for (const child of node.childNodes) {
+			normalizeStyles(child);
+		}
+	}
+}

test/runtime-browser/index.js

@@ -1,79 +1,38 @@
-import * as path from 'path';
+import virtual from '@rollup/plugin-virtual';
 import * as fs from 'fs';
-import * as http from 'http';
+import * as path from 'path';
 import { rollup } from 'rollup';
-import virtual from '@rollup/plugin-virtual';
-import puppeteer from 'puppeteer';
-
-import {
-	loadConfig,
-	loadSvelte,
-	mkdirp,
-	prettyPrintPuppeteerAssertionError,
-	retryAsync,
-	executeBrowserTest
-} from '../helpers';
-import { deepEqual } from 'assert';
-
-const page = `
-<body>
-	<main></main>
-	<script src='/bundle.js'></script>
-</body>
-`;
 
-let svelte;
-let server;
-let code;
-let browser;
+import { chromium } from '@playwright/test';
+import { deepStrictEqual } from 'assert';
+import { loadConfig, loadSvelte, mkdirp, prettyPrintBrowserAssertionError } from '../helpers';
 
 const internal = path.resolve('internal/index.mjs');
 const index = path.resolve('index.mjs');
 
-function create_server() {
-	return new Promise((fulfil, reject) => {
-		const server = http.createServer((req, res) => {
-			if (req.url === '/') {
-				res.end(page);
-			}
-
-			if (req.url === '/bundle.js') {
-				res.end(code);
-			}
-		});
-
-		server.on('error', reject);
-
-		server.listen('6789', () => {
-			fulfil(server);
-		});
-	});
-}
+const assert = fs.readFileSync(`${__dirname}/assert.js`, 'utf-8');
 
-async function launchPuppeteer() {
-	return await retryAsync(() => puppeteer.launch());
-}
+describe('runtime (browser)', function () {
+	this.timeout(20000);
 
-const assert = fs.readFileSync(`${__dirname}/assert.js`, 'utf-8');
+	let svelte;
+	let browser;
 
-describe('runtime (puppeteer)', () => {
 	before(async () => {
 		svelte = loadSvelte(false);
-		console.log('[runtime-puppeteer] Loaded Svelte');
-		server = await create_server();
-		console.log('[runtime-puppeteer] Started server');
-		browser = await launchPuppeteer();
-		console.log('[runtime-puppeteer] Launched puppeteer browser');
+		console.log('[runtime-browser] Loaded Svelte');
+
+		browser = await chromium.launch();
+		console.log('[runtime-browser] Launched browser');
 	});
 
 	after(async () => {
-		if (server) server.close();
 		if (browser) await browser.close();
 	});
 
 	const failed = new Set();
 
-	function runTest(dir, hydrate, is_first_run) {
+	function runTest(dir, hydrate) {
 		if (dir[0] === '.') return;
 
 		const config = loadConfig(`${__dirname}/samples/${dir}/_config.js`);
@@ -100,7 +59,7 @@ describe('runtime (puppeteer)', () => {
 					input: 'main',
 					plugins: [
 						{
-							name: 'testing-runtime-puppeteer',
+							name: 'testing-runtime-browser',
 							resolveId(importee) {
 								if (importee === 'svelte/internal' || importee === './internal') {
 									return internal;
@@ -221,12 +180,11 @@ describe('runtime (puppeteer)', () => {
 					]
 				});
 
-				const result = await bundle.generate({ format: 'iife', name: 'test' });
-				code = result.output[0].code;
+				const generated_bundle = await bundle.generate({ format: 'iife', name: 'test' });
 
 				function assertWarnings() {
 					if (config.warnings) {
-						deepEqual(
+						deepStrictEqual(
 							warnings.map((w) => ({
 								code: w.code,
 								message: w.message,
@@ -243,20 +201,30 @@ describe('runtime (puppeteer)', () => {
 					}
 				}
 
-				browser = await executeBrowserTest(browser, launchPuppeteer, assertWarnings, (err) => {
+				try {
+					const page = await browser.newPage();
+					page.on('console', (type) => {
+						console[type.type()](type.text());
+					});
+					await page.setContent('<main></main>');
+					await page.evaluate(generated_bundle.output[0].code);
+					const test_result = await page.evaluate(`test(document.querySelector('main'))`);
+
+					if (test_result) console.log(test_result);
+					assertWarnings();
+					await page.close();
+				} catch (err) {
 					failed.add(dir);
-					prettyPrintPuppeteerAssertionError(err.message);
+					prettyPrintBrowserAssertionError(err.message);
 					assertWarnings();
-				});
+					throw err;
+				}
 			}
-		).timeout(is_first_run ? 20000 : 10000);
+		);
 	}
 
-	// Increase the timeout on the first run in preparation for restarting Chromium due to SIGSEGV.
-	let first_run = true;
 	fs.readdirSync(`${__dirname}/samples`).forEach((dir) => {
-		runTest(dir, false, first_run);
-		runTest(dir, true, first_run);
-		first_run = false;
+		runTest(dir, false);
+		runTest(dir, true);
 	});
 });

test/runtime-browser/samples/component-event-handler-contenteditable-false/_config.js

@@ -1,4 +1,4 @@
-// A puppeteer test because JSDOM doesn't support contenteditable
+// A browser test because JSDOM doesn't support contenteditable
 export default {
 	html: '<div contenteditable="false"></div>',
 

test/runtime-browser/samples/component-event-handler-contenteditable-spread/_config.js

@@ -1,4 +1,4 @@
-// A puppeteer test because JSDOM doesn't support contenteditable
+// A browser test because JSDOM doesn't support contenteditable
 export default {
 	html: '<div contenteditable="true"></div>',
 	ssrHtml: '<div contenteditable=""></div>',

test/runtime-browser/samples/component-event-handler-contenteditable/_config.js

@@ -1,4 +1,4 @@
-// A puppeteer test because JSDOM doesn't support contenteditable
+// A browser test because JSDOM doesn't support contenteditable
 export default {
 	html: '<div contenteditable=""></div>',
 

test/server-side-rendering/index.js

@@ -141,7 +141,7 @@ describe('ssr', () => {
 
 	// duplicate client-side tests, as far as possible
 	runRuntimeSamples('runtime');
-	runRuntimeSamples('runtime-puppeteer');
+	runRuntimeSamples('runtime-browser');
 
 	function runRuntimeSamples(suite) {
 		fs.readdirSync(`test/${suite}/samples`).forEach((dir) => {