Refactor transform to be isomorphic (Node/web compatibility)

.eslintrc.json

@@ -48,9 +48,9 @@
             {
                 "devDependencies": [
                     "app.js",
-                    "app.ts",
                     "vite.config.ts",
                     "src/api.ts",
+                    "src/app.ts",
                     "test/**/*.ts"
                 ],
                 "optionalDependencies": false,
@@ -95,10 +95,19 @@
         {
             "files": ["./**/*.ts"],
             "rules": {
+                "consistent-return": "off",
                 "no-useless-constructor": "off",
                 "@typescript-eslint/no-useless-constructor": "error",
                 "no-unused-vars": "off",
-                "@typescript-eslint/no-unused-vars": "error",
+                "@typescript-eslint/no-unused-vars": [
+                    "error",
+                    {
+                        "argsIgnorePattern": "^_",
+                        "varsIgnorePattern": "^_"
+                    }
+                ],
+                "no-dupe-class-members": "off",
+                "@typescript-eslint/no-dupe-class-members": "error",
                 "no-empty-function": "off",
                 "@typescript-eslint/no-empty-function": "error",
                 "no-undef": "off",
@@ -129,6 +138,7 @@
         {
             "files": ["./**/*.d.ts"],
             "rules": {
+                "lines-between-class-members": "off",
                 "no-unused-vars": "off"
             }
         },

.github/workflows/npmjs.yml

@@ -12,13 +12,26 @@ jobs:
         runs-on: ubuntu-latest
         strategy:
             matrix:
+                target: ['node']
                 node: ['14', '16']
+                include:
+                    - target: web
+                      node: 16
+                      browser: firefox
+                    - target: web
+                      node: 16
+                      browser: chromium
+                    - target: web
+                      node: 16
+                      browser: webkit
         steps:
             - uses: actions/checkout@v2
             - uses: actions/cache@v2
               id: cache
               with:
-                  path: node_modules
+                  path: |
+                      node_modules
+                      ~/.cache/ms-playwright
                   key: ${{ matrix.node }}-${{ hashFiles('**/package-lock.json') }}
             - uses: actions/setup-node@v2
               with:
@@ -27,9 +40,11 @@ jobs:
             - run: npm install -g npm@^6
             - if: steps.cache.outputs.cache-hit != 'true'
               run: npm ci
-            - run: npm test
-            - run: npm run benchmarks
-            - if: github.event_name == 'release' && github.event.action == 'published' && matrix.node == '16'
+            - if: matrix.node == '16' && matrix.browser == 'webkit'
+              run: sudo npx playwright install-deps
+            - run: ENV=${{ matrix.target }} BROWSER=${{ matrix.browser }} npm test
+            - run: ENV=${{ matrix.target }} BROWSER=${{ matrix.browser }} npm run benchmarks
+            - if: github.event_name == 'release' && github.event.action == 'published' && matrix.node == '16' && matrix.target == 'node'
               run: npm publish
               env:
                   NODE_AUTH_TOKEN: ${{secrets.npm_token}}

.vscode/settings.json

@@ -22,7 +22,6 @@
         "editor.defaultFormatter": "esbenp.prettier-vscode",
         "editor.formatOnSave": true
     },
-
     // Note: it would be nice to reverse this! But it's currently preventing a *ton* of whitespace diff noise
     "[xml]": {
         "editor.formatOnSave": false
@@ -32,5 +31,6 @@
     },
 
     // Code navigation
-    "javascript.referencesCodeLens.enabled": true
+    "javascript.referencesCodeLens.enabled": true,
+    "typescript.tsdk": "node_modules/typescript/lib"
 }

app.js

@@ -1,63 +1 @@
-// @ts-check
-
-import { createServer } from 'vite';
-import { VitePluginNode } from 'vite-plugin-node';
-import {
-    config,
-    external,
-    resolvePath,
-    rootDir,
-} from './config/build.shared.js';
-
-const appPath = resolvePath('./app.ts');
-
-const init = async () => {
-    /** @type {import('vite').UserConfig} */
-    const baseOptions = {
-        mode: 'development',
-        build: {
-            rollupOptions: {
-                external,
-            },
-        },
-        optimizeDeps: {
-            disabled: true,
-        },
-        root: rootDir,
-        ssr: {
-            target: 'node',
-        },
-    };
-
-    const servers = await Promise.all([
-        createServer({
-            ...baseOptions,
-            configFile: false,
-            plugins: VitePluginNode({
-                adapter: 'express',
-                appPath,
-                exportName: 'app',
-                tsCompiler: 'esbuild',
-            }),
-            server: {
-                port: config.port,
-            },
-        }),
-        createServer({
-            ...baseOptions,
-            configFile: false,
-            publicDir: resolvePath('./test/forms'),
-            server: {
-                port: 8081,
-            },
-        }),
-    ]);
-
-    await Promise.all(servers.map((server) => server.listen()));
-
-    servers.forEach((server) => {
-        server.printUrls();
-    });
-};
-
-init();
+import './dist/enketo-transformer/app.cjs';

index.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <link rel="icon" href="./icon.png" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>Enketo Transformer (web)</title>
+    </head>
+    <body>
+        <script type="module">
+            import { transform } from './src/transformer.ts';
+
+            globalThis.enketo = {
+                transformer: { transform },
+            };
+        </script>
+    </body>
+</html>