Fix #17 - Bootstrap without a type

WebReflection · WebReflection · commit da7ed1b67322 · 2023-08-29T22:38:03.000+02:00
diff --git a/docs/core.js b/docs/core.js
diff --git a/esm/custom.js b/esm/custom.js
@@ -155,38 +155,64 @@ const registry = new Map();
  * @prop {(environment: object, node: Element) => void} [onInterpreterReady] the callback that will be invoked once
  */
 
+let dontBotherCount = 0;
+
 /**
  * Allows custom types and components on the page to receive interpreters to execute any code
  * @param {string} type the unique `<script type="...">` identifier
  * @param {CustomOptions} options the custom type configuration
  */
 export const define = (type, options) => {
-    if (defaultRegistry.has(type) || registry.has(type))
+    // allow no-type to be bootstrapped out of the box
+    let dontBother = type == null;
+
+    if (dontBother)
+        type = `_ps${dontBotherCount++}`;
+    else if (defaultRegistry.has(type) || registry.has(type))
         throw new Error(`<script type="${type}"> already registered`);
 
     if (!defaultRegistry.has(options?.interpreter))
         throw new Error('Unspecified interpreter');
 
     // allows reaching out the interpreter helpers on events
-    defaultRegistry.set(type, defaultRegistry.get(options?.interpreter));
+    defaultRegistry.set(type, defaultRegistry.get(options.interpreter));
+
+    // allows selector -> registry by type
+    const selectors = [`script[type="${type}"]`];
 
     // ensure a Promise can resolve once a custom type has been bootstrapped
     whenDefined(type);
 
-    // allows selector -> registry by type
-    const selectors = [`script[type="${type}"]`, `${type}-script`];
-    for (const selector of selectors) types.set(selector, type);
+    if (!dontBother) {
+        selectors.push(`${type}-script`);
+        prefixes.push(`${type}-`);
+    }
+    else {
+        // add a script then cleanup everything once that's ready
+        const { onInterpreterReady } = options;
+        options.onInterpreterReady = (resolved, node) => {
+            CUSTOM_SELECTORS.splice(CUSTOM_SELECTORS.indexOf(type), 1);
+            defaultRegistry.delete(type);
+            registry.delete(type);
+            waitList.delete(type);
+            node.remove();
+            onInterpreterReady?.(resolved);
+        };
+        document.head.append(
+            assign(document.createElement('script'), { type })
+        );
+    }
 
+    for (const selector of selectors) types.set(selector, type);
     CUSTOM_SELECTORS.push(...selectors);
-    prefixes.push(`${type}-`);
 
     // ensure always same env for this custom type
     registry.set(type, {
         options: assign({ env: type }, options),
         known: new WeakSet(),
     });
 
-    addAllListeners(document);
+    if (!dontBother) addAllListeners(document);
     $$(selectors.join(',')).forEach(handleCustomType);
 };
 
diff --git a/test/integration.html b/test/integration.html
@@ -5,5 +5,5 @@
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <title>polyscript integration tests</title>
     </head>
-    <body><ul><li><strong>micropython</strong><ul><li><a href="/test/integration/interpreter/micropython/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/micropython/config-object.html">config-object</a></li><li><a href="/test/integration/interpreter/micropython/fetch.html">fetch</a></li><li><a href="/test/integration/interpreter/micropython/worker-attribute.html">worker-attribute</a></li><li><a href="/test/integration/interpreter/micropython/worker-error.html">worker-error</a></li><li><a href="/test/integration/interpreter/micropython/worker-lua.html">worker-lua</a></li><li><a href="/test/integration/interpreter/micropython/worker-window.html">worker-window</a></li><li><a href="/test/integration/interpreter/micropython/worker.html">worker</a></li></ul><li><strong>pyodide</strong><ul><li><a href="/test/integration/interpreter/pyodide/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/pyodide/fetch.html">fetch</a></li><li><a href="/test/integration/interpreter/pyodide/sync.html">sync</a></li><li><a href="/test/integration/interpreter/pyodide/worker-error.html">worker-error</a></li><li><a href="/test/integration/interpreter/pyodide/worker-transform.html">worker-transform</a></li><li><a href="/test/integration/interpreter/pyodide/worker.html">worker</a></li></ul><li><strong>ruby-wasm-wasi</strong><ul><li><a href="/test/integration/interpreter/ruby-wasm-wasi/bootstrap.html">bootstrap</a></li></ul><li><strong>wasmoon</strong><ul><li><a href="/test/integration/interpreter/wasmoon/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/wasmoon/worker.html">worker</a></li></ul></ul></body>
+    <body><ul><li><strong>micropython</strong><ul><li><a href="/test/integration/interpreter/micropython/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/micropython/config-object.html">config-object</a></li><li><a href="/test/integration/interpreter/micropython/fetch.html">fetch</a></li><li><a href="/test/integration/interpreter/micropython/no-type.html">no-type</a></li><li><a href="/test/integration/interpreter/micropython/worker-attribute.html">worker-attribute</a></li><li><a href="/test/integration/interpreter/micropython/worker-error.html">worker-error</a></li><li><a href="/test/integration/interpreter/micropython/worker-lua.html">worker-lua</a></li><li><a href="/test/integration/interpreter/micropython/worker-window.html">worker-window</a></li><li><a href="/test/integration/interpreter/micropython/worker.html">worker</a></li></ul><li><strong>pyodide</strong><ul><li><a href="/test/integration/interpreter/pyodide/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/pyodide/fetch.html">fetch</a></li><li><a href="/test/integration/interpreter/pyodide/sync.html">sync</a></li><li><a href="/test/integration/interpreter/pyodide/worker-error.html">worker-error</a></li><li><a href="/test/integration/interpreter/pyodide/worker-transform.html">worker-transform</a></li><li><a href="/test/integration/interpreter/pyodide/worker.html">worker</a></li></ul><li><strong>ruby-wasm-wasi</strong><ul><li><a href="/test/integration/interpreter/ruby-wasm-wasi/bootstrap.html">bootstrap</a></li></ul><li><strong>wasmoon</strong><ul><li><a href="/test/integration/interpreter/wasmoon/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/wasmoon/worker.html">worker</a></li></ul></ul></body>
 </html>
diff --git a/test/integration/interpreter/micropython/no-type.html b/test/integration/interpreter/micropython/no-type.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script type="module">
+        import { define } from '/core.js';
+        define(null, {
+          interpreter: 'micropython',
+          onInterpreterReady(mpy, node) {
+            if (node) throw new Error('unexpected node');
+            mpy.run(`
+              from js import document
+              document.documentElement.classList.add('ready');
+              document.body.textContent = 'OK'
+            `);
+          }
+        });
+    </script>
+</head>
+</html>
diff --git a/test/integration/micropython.js b/test/integration/micropython.js
@@ -3,7 +3,7 @@
 const { shared, python } = require('./_shared.js');
 
 module.exports = (playwright, baseURL) => {
-    const { test } = playwright;
+    const { expect, test } = playwright;
 
     test('MicroPython bootstrap', python.bootstrap(playwright, baseURL));
 
@@ -20,4 +20,11 @@ module.exports = (playwright, baseURL) => {
     test('MicroPython config as object', python.configAsObject(playwright, baseURL));
 
     test('MicroPython worker attribute', python.workerAttribute(playwright, `${baseURL}/worker-attribute.html`));
+
+    test('MicroPython w/out type', async ({ page }) => {
+        await page.goto(`${baseURL}/no-type.html`);
+        await page.waitForSelector('html.ready');
+        const result = await page.evaluate(() => document.body.innerText);
+        await expect(result.trim()).toBe('OK');
+    });
 };
