Run headless browser tests in ci

.github/workflows/main.yml

@@ -25,6 +25,8 @@ jobs:
     - run: npm config set fund false
     - run: make tests
     - run: make integration-tests
+    - run: npx playwright install chromium
+    - run: make browser-tests-headless
     - run: make lint
   benchmark:
     runs-on: ubuntu-22.04

Makefile

@@ -43,6 +43,9 @@ else
 	@echo Open "build/js/index.html" in your browser.
 endif
 
+browser-tests-headless: node_modules $(BUILDDIR)/$(JSON_ACIS) $(BUILDDIR)/$(BYTECODES)
+	npm run test:browser
+
 integration-tests: $(INTEGRATION_TESTS) | node_modules $(BUILDDIR)/$(JSON_ACIS)
 	@for file in $^; do bash $${file}; done
 

package.json

@@ -54,6 +54,7 @@
     "eslint-plugin-import": "2.29.1",
     "html-webpack-plugin": "^5.6.3",
     "nyc": "17.0.0",
+    "playwright": "^1.49.0",
     "process": "^0.11.10",
     "stream-browserify": "^3.0.0",
     "tape": "5.8.1",
@@ -64,7 +65,8 @@
     "files": [
       "tests/**/*",
       "!tests/test.js",
-      "!tests/benchmark/*"
+      "!tests/benchmark/*",
+      "!tests/browser/run.js"
     ]
   },
   "nyc": {
@@ -81,6 +83,7 @@
     "prepare": "npm run build",
     "test": "ava --verbose",
     "test:watch": "ava --verbose --watch",
+    "test:browser": "npm run browser-test-bundle && node ./tests/browser/run.js",
     "lint": "eslint src tests"
   }
 }

tests/browser/run.js

@@ -0,0 +1,21 @@
+import path from 'path'
+import { chromium } from 'playwright'
+
+const browser = await chromium.launch()
+const page = await browser.newPage()
+await page.goto(`file://${path.resolve('./build/js/index.html')}`)
+
+page.on('console', async (msg) => {
+    const text = msg.text()
+    console.log(text) // eslint-disable-line no-console
+
+    if (text.startsWith('# fail')) {
+        await browser.close()
+        process.exit(+text.replace('# fail', ''))
+    }
+
+    if (text === '# ok') {
+        await browser.close()
+        process.exit(0)
+    }
+})