added browser tests

bjorn3 · Oct 10, 2023 · dbe77a6 · dbe77a6
1 parent f4d2382
commit dbe77a6
Show file tree

Hide file tree

Showing 16 changed files with 992 additions and 43 deletions.
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -2,6 +2,10 @@ module.exports = {
   extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
   parser: "@typescript-eslint/parser",
   plugins: ["@typescript-eslint"],
+  env: {
+    browser: true,
+    node: true,
+  },
   rules: {
     "@typescript-eslint/no-this-alias": "off",
   },

diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,8 @@
 node_modules/
 dist/
 typings/
+/test-results/
+/playwright-report/
+/playwright/.cache/
+
+wasmtime/
diff --git a/README.md b/README.md
@@ -38,6 +38,22 @@ $ npm install
 $ npm run build
 ```
 
+## Running tests
+
+This project uses playwright to run tests in a browser using WebAssembly built from the Wasmtime project.
+
+To clone wasmtime and build the test WebAssembly, run:
+
+```
+$ npm test:build
+```
+
+Once the WebAssembly is built, you can run the tests with:
+
+```
+$ npm test
+```
+
 ## Running the demo
 
 The demo requires the wasm rustc artifacts and the xterm js package. To get them run:

diff --git a/e2e/harness.html b/e2e/harness.html
@@ -0,0 +1,8 @@
+<html>
+  <head>
+    <title>Test Harness</title>
+  </head>
+  <h1>Status: <span id=status data-testid=status>Not started</span></h1>
+  <h2>Check console for details</h2>
+  <script src="harness.js" type="module"></script>
+</html>
diff --git a/e2e/harness.js b/e2e/harness.js
@@ -0,0 +1,71 @@
+import { WASI, File, PreopenDirectory } from "../dist/index.js";
+
+const stdio = {
+  stdin: undefined,
+  stdout: new File(),
+  stderr: new File(),
+};
+
+const WASI_ENVS = {
+  DEFAULT: [
+    stdio.stdin,
+    stdio.stdout,
+    stdio.stderr,
+    new PreopenDirectory("/", {}),
+  ],
+};
+
+async function main(options) {
+  const wasmReq = await fetch(options.file);
+
+  const args = [options.file];
+  args.push(...(options.args || []));
+
+  const wasi = new WASI(
+    args,
+    (options.env || "").split(","),
+    WASI_ENVS[options.wasi_env] || WASI_ENVS.DEFAULT,
+    {
+      debug: true,
+    },
+  );
+  const module = await WebAssembly.compileStreaming(wasmReq);
+
+  const instance = await WebAssembly.instantiate(module, {
+    wasi_snapshot_preview1: wasi.wasiImport,
+  });
+
+  const status = document.getElementById("status");
+  try {
+    if (options.reactor) {
+      wasi.initialize(instance);
+    }
+    if (options.command) {
+      wasi.start(instance);
+    }
+    printBuffer(stdio, "stdout", "log");
+    printBuffer(stdio, "stderr", "log");
+    status.innerText = "success";
+  } catch (e) {
+    printBuffer(stdio, "stdout", "log");
+    printBuffer(stdio, "stderr", "error");
+    status.innerText = "failure";
+    throw e;
+  }
+}
+
+function printBuffer(stdio, type, logger) {
+  const output = new TextDecoder().decode(stdio[type].data);
+  if (output.trim().length > 0) {
+    console[logger](`${type}`, output);
+  }
+}
+
+main(JSON.parse(decodeURI(location.search.slice(1))))
+  .then(() => {
+    console.log("done");
+  })
+  .catch((e) => {
+    console.error(e);
+    throw e;
+  });
diff --git a/e2e/wasmtime.spec.ts b/e2e/wasmtime.spec.ts
@@ -0,0 +1,24 @@
+import { test, expect } from "@playwright/test";
+
+const URL = "http://127.0.0.1:3000/e2e/harness.html";
+const WASMDIR = "../wasmtime/artifacts";
+
+const tests = [
+  {
+    file: `${WASMDIR}/preview1_path_open_read_write.wasm`,
+    command: true,
+    args: ["/"],
+  },
+];
+
+for (const testDef of tests) {
+  test(`first ${testDef.file}`, async ({ page }) => {
+    await page.goto(`${URL}?${JSON.stringify(testDef)}`);
+    await page.waitForFunction(
+      () => document.getElementById("status")?.textContent !== "Not started",
+    );
+    expect(await await page.getByTestId("status").textContent()).toBe(
+      "success",
+    );
+  });
+}