playwright tests

.github/workflows/playwright.yml

@@ -0,0 +1,27 @@
+name: Playwright Tests
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+jobs:
+  test:
+    timeout-minutes: 60
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v3
+    - uses: actions/setup-node@v3
+      with:
+        node-version: 18
+    - name: Install dependencies
+      run: yarn install
+    - name: Build pysandbox
+      run: yarn build
+    - name: Run Playwright tests
+      run: yarn test
+    - uses: actions/upload-artifact@v3
+      if: always()
+      with:
+        name: playwright-report
+        path: playwright-report/
+        retention-days: 30

.github/workflows/tests/input.spec.ts

@@ -0,0 +1,11 @@
+import { test, expect } from "@playwright/test";
+
+test("main thread success", async ({ page }) => {
+  await page.goto("/examples/MainThread/input.html");
+  await expect(page.getByTestId("out")).toHaveText(/success/);
+});
+
+test("worker success", async ({ page }) => {
+  await page.goto("/examples/Worker/input.html");
+  await expect(page.getByTestId("out")).toHaveText(/success/);
+});

.github/workflows/tests/matplotlib.spec.ts

@@ -0,0 +1,13 @@
+import { test, expect } from "@playwright/test";
+
+test("main thread success", async ({ page }) => {
+  await page.goto("/examples/MainThread/matplotlib.html");
+  await expect(page.getByTestId("out")).not.toBeEmpty();
+  expect(page).toHaveScreenshot("matplotlib.png");
+});
+
+test("worker success", async ({ page }) => {
+  await page.goto("/examples/Worker/matplotlib.html");
+  await expect(page.getByTestId("out")).not.toBeEmpty();
+  expect(page).toHaveScreenshot("matplotlib.png");
+});

.github/workflows/tests/restricted.spec.ts

@@ -0,0 +1,11 @@
+import { test, expect } from "@playwright/test";
+
+test("main thread success", async ({ page }) => {
+  await page.goto("/examples/MainThread/restricted.html");
+  await expect(page.getByTestId("out")).toHaveText(/success/);
+});
+
+test("worker success", async ({ page }) => {
+  await page.goto("/examples/Worker/restricted.html");
+  await expect(page.getByTestId("out")).toHaveText(/success/);
+});

.github/workflows/tests/simple.spec.ts

@@ -0,0 +1,11 @@
+import { test, expect } from "@playwright/test";
+
+test("main thread success", async ({ page }) => {
+  await page.goto("/examples/MainThread/simple.html");
+  await expect(page.getByTestId("out")).toHaveText(/success/);
+});
+
+test("worker success", async ({ page }) => {
+  await page.goto("/examples/Worker/simple.html");
+  await expect(page.getByTestId("out")).toHaveText(/success/);
+});

examples/MainThread/autoimport.html

@@ -66,6 +66,6 @@
       await sandbox.installPackages(packages, { keep_going: true });
       await sandbox.exec(code, "out");
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/MainThread/input.html

@@ -29,6 +29,6 @@
         "out",
       );
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/MainThread/matplotlib-restricted.html

@@ -39,6 +39,6 @@
         "out",
       );
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/MainThread/matplotlib.html

@@ -38,6 +38,6 @@
         "out",
       );
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/MainThread/restricted.html

@@ -25,6 +25,6 @@
         );
       }
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/MainThread/simple.html

@@ -17,6 +17,6 @@
         "import js\njs.document.getElementById('out').innerText = 'success'",
       );
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/Worker/autoimport.html

@@ -64,6 +64,6 @@
       await sandbox.installPackages(packages, { keep_going: true });
       await sandbox.exec(code, "out");
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/Worker/input.html

@@ -29,6 +29,6 @@
         "out",
       );
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/Worker/matplotlib-restricted.html

@@ -41,6 +41,6 @@
         "out",
       );
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/Worker/matplotlib.html

@@ -38,6 +38,6 @@
         "out",
       );
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/Worker/restricted.html

@@ -25,6 +25,6 @@
         );
       }
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

examples/Worker/simple.html

@@ -17,6 +17,6 @@
         "import js\njs.document.getElementById('out').innerText = 'success'",
       );
     </script>
-    <div id="out"></div>
+    <div id="out" data-testid="out"></div>
   </body>
 </html>

package.json

@@ -37,11 +37,14 @@
     "format:py": "black src",
     "serve": "python serve.py",
     "prepare": "husky install",
-    "prepublish": "yarn build"
+    "prepublish": "yarn build",
+    "test": "playwright test"
   },
   "devDependencies": {
+    "@playwright/test": "^1.38.1",
     "husky": "^8.0.3",
     "lint-staged": "^14.0.1",
+    "playwright": "^1.38.1",
     "prettier": "^3.0.3",
     "tsup": "^7.2.0",
     "typescript": "^5.2.2"

playwright.config.ts

@@ -0,0 +1,16 @@
+import { defineConfig, devices } from "@playwright/test";
+
+export default defineConfig({
+  expect: {
+    timeout: 30 * 1000,
+  },
+  use: {
+    baseURL: "http://localhost:8000/",
+  },
+  webServer: {
+    command: "yarn serve",
+    reuseExistingServer: true,
+    url: "http://localhost:8000/",
+  },
+  workers: process.env.CI ? 1 : undefined,
+});

yarn.lock

@@ -165,6 +165,13 @@
     "@nodelib/fs.scandir" "2.1.5"
     fastq "^1.6.0"
 
+"@playwright/test@^1.38.1":
+  version "1.38.1"
+  resolved "https://registry.yarnpkg.com/@playwright/test/-/test-1.38.1.tgz#8ef4263e355cd1d8ad7905d471d268e8acb82ed6"
+  integrity sha512-NqRp8XMwj3AK+zKLbZShl0r/9wKgzqI/527bkptKXomtuo+dOjU9NdMASQ8DNC9z9zLOMbG53T4eihYr3XR+BQ==
+  dependencies:
+    playwright "1.38.1"
+
 "@ungap/structured-clone@^1.2.0":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@ungap/structured-clone/-/structured-clone-1.2.0.tgz#756641adb587851b5ccb3e095daf27ae581c8406"
@@ -450,6 +457,11 @@ fs.realpath@^1.0.0:
   resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
   integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
 
+[email protected]:
+  version "2.3.2"
+  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
+  integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
+
 fsevents@~2.3.2:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.3.tgz#cac6407785d03675a2a5e1a5305c697b347d90d6"
@@ -766,6 +778,20 @@ plain-tag@^0.1.3:
   resolved "https://registry.yarnpkg.com/plain-tag/-/plain-tag-0.1.3.tgz#d20c0fdf8fa80c170bc1d12d6c9ab38e27922836"
   integrity sha512-yyVAOFKTAElc7KdLt2+UKGExNYwYb/Y/WE9i+1ezCQsJE8gbKSjewfpRqK2nQgZ4d4hhAAGgDCOcIZVilqE5UA==
 
+[email protected]:
+  version "1.38.1"
+  resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.38.1.tgz#75a3c470aa9576b7d7c4e274de3d79977448ba08"
+  integrity sha512-tQqNFUKa3OfMf4b2jQ7aGLB8o9bS3bOY0yMEtldtC2+spf8QXG9zvXLTXUeRsoNuxEYMgLYR+NXfAa1rjKRcrg==
+
+[email protected], playwright@^1.38.1:
+  version "1.38.1"
+  resolved "https://registry.yarnpkg.com/playwright/-/playwright-1.38.1.tgz#82ecd9bc4f4f64dbeee8a11c31793748e2528130"
+  integrity sha512-oRMSJmZrOu1FP5iu3UrCx8JEFRIMxLDM0c/3o4bpzU5Tz97BypefWf7TuTNPWeCe279TPal5RtPPZ+9lW/Qkow==
+  dependencies:
+    playwright-core "1.38.1"
+  optionalDependencies:
+    fsevents "2.3.2"
+
 polyscript@^0.4.2:
   version "0.4.2"
   resolved "https://registry.yarnpkg.com/polyscript/-/polyscript-0.4.2.tgz#e59b18136aae7d8f3dd314f84b1b34cd40485a2f"