Merge pull request #112 from pyscript/async-by-default

Make interpreters code async by default

Author: WebReflection

docs/index.js

@@ -1,7 +1,7 @@
 import '@ungap/with-resolvers';
 import { $$ } from 'basic-devtools';
 
-import { JSModules, assign, create, createOverload, createResolved, dedent, defineProperty, nodeInfo, registerJSModules } from './utils.js';
+import { JSModules, isSync, assign, create, createOverload, createResolved, dedent, defineProperty, nodeInfo, registerJSModules } from './utils.js';
 import { getDetails } from './script-handler.js';
 import { registry as defaultRegistry, prefixes, configs } from './interpreters.js';
 import { getRuntimeID } from './loader.js';
@@ -69,7 +69,7 @@ export const handleCustomType = async (node) => {
                         type: runtime,
                         custom: type,
                         config: node.getAttribute('config') || config || {},
-                        async: node.hasAttribute('async'),
+                        async: !isSync(node),
                         serviceWorker: node.getAttribute('service-worker'),
                     });
                     defineProperty(node, 'xworker', { value: xworker });

docs/index.js.map

@@ -6,7 +6,7 @@ import $xworker from './worker/class.js';
 import workerURL from './worker/url.js';
 import { getRuntime, getRuntimeID } from './loader.js';
 import { registry } from './interpreters.js';
-import { JSModules, all, dispatch, resolve, defineProperty, nodeInfo, registerJSModules } from './utils.js';
+import { JSModules, isSync, all, dispatch, resolve, defineProperty, nodeInfo, registerJSModules } from './utils.js';
 
 const getRoot = (script) => {
     let parent = script;
@@ -55,12 +55,6 @@ const execute = async (currentScript, source, XWorker, isAsync) => {
         source,
     ]);
     try {
-        // temporarily override inherited document.currentScript in a non writable way
-        // but it deletes it right after to preserve native behavior (as it's sync: no trouble)
-        defineProperty(document, 'currentScript', {
-            configurable: true,
-            get: () => currentScript,
-        });
         registerJSModules(type, module, interpreter, JSModules);
         module.registerJSModule(interpreter, 'polyscript', {
             XWorker,
@@ -69,10 +63,16 @@ const execute = async (currentScript, source, XWorker, isAsync) => {
             workers: workersHandler,
         });
         dispatch(currentScript, type, 'ready');
-        const result = module[isAsync ? 'runAsync' : 'run'](interpreter, content);
+        // temporarily override inherited document.currentScript in a non writable way
+        // but it deletes it right after to preserve native behavior (as it's sync: no trouble)
+        defineProperty(document, 'currentScript', {
+            configurable: true,
+            get: () => currentScript,
+        });
         const done = dispatch.bind(null, currentScript, type, 'done');
-        if (isAsync) result.then(done);
-        else done();
+        let result = module[isAsync ? 'runAsync' : 'run'](interpreter, content);
+        if (isAsync) result = await result;
+        done();
         return result;
     } finally {
         delete document.currentScript;
@@ -125,7 +125,6 @@ export const handle = async (script) => {
         // and/or source code with different config or interpreter
         const {
             attributes: {
-                async: isAsync,
                 config,
                 env,
                 name: wn,
@@ -137,19 +136,21 @@ export const handle = async (script) => {
             type,
         } = script;
 
+        /* c8 ignore start */
+        const isAsync = !isSync(script);
+
         const versionValue = version?.value;
         const name = getRuntimeID(type, versionValue);
         let configValue = getValue(config, '|');
         const id = getValue(env, '') || `${name}${configValue}`;
         configValue = configValue.slice(1);
 
-        /* c8 ignore start */
         const url = workerURL(script);
         if (url) {
             const XWorker = $xworker(type, versionValue);
             const xworker = new XWorker(url, {
                 ...nodeInfo(script, type),
-                async: !!isAsync,
+                async: isAsync,
                 config: configValue,
                 serviceWorker: sw?.value,
             });
@@ -176,7 +177,7 @@ export const handle = async (script) => {
         // start fetching external resources ASAP
         const source = src ? fetch(src).text() : script.textContent;
         details.queue = details.queue.then(() =>
-            execute(script, source, details.XWorker, !!isAsync),
+            execute(script, source, details.XWorker, isAsync),
         );
     }
 };

esm/custom.js

@@ -124,6 +124,10 @@ export const importCSS = href => new Promise((onload, onerror) => {
 });
 
 export const isCSS = source => /\.css$/i.test(new URL(source).pathname);
+
+export const isSync = element =>
+    /^(?:false|0|no)$/i.test(element.getAttribute('async'));
+
 /* c8 ignore stop */
 
 export {

esm/script-handler.js

@@ -1,6 +1,6 @@
 {
     "name": "polyscript",
-    "version": "0.14.5",
+    "version": "0.15.0",
     "description": "PyScript single core to rule them all",
     "main": "./esm/index.js",
     "types": "./types/polyscript/esm/index.d.ts",

esm/utils.js

@@ -12,9 +12,10 @@
           hooks: {
             main: {
               onReady: ({ run, runAsync }, element) => {
+                const isAsync = element.getAttribute('async') !== 'false';
                 console.log('onMainReady');
                 dispatchEvent(new Event('mpy:ready'));
-                const exec = element.hasAttribute('async') ? runAsync : run;
+                const exec = isAsync ? runAsync : run;
                 exec(element.textContent.trim());
               },
               onWorker: () => console.log('onWorkerMain'),
@@ -70,10 +71,8 @@
             const isScript = type === 'script';
             const tag = document.createElement(isScript ? 'script' : type + '-script');
             if (isScript) tag.type = 'mpy';
-            if (current.async) {
-              type += '-async';
-              tag.setAttribute('async', '');
-            }
+            if (current.async) type += '-async';
+            else tag.setAttribute('async', 'false');
             if (current.worker) {
               type += '-worker';
               tag.setAttribute('worker', '');

package-lock.json

@@ -19,6 +19,9 @@ export const loadMicroPython = () => ({
             python.target = document.currentScript.target;
         }
     },
+    runPythonAsync(content) {
+        return this.runPython(content);
+    },
     globals: {
         set(name, value) {
             globalThis[name] = value;

package.json

@@ -26,6 +26,9 @@ export const loadPyodide = () => ({
         }
         python.target = document.currentScript.target;
     },
+    runPythonAsync(content) {
+        return this.runPython(content);
+    },
     globals: {
         set(name, value) {
             globalThis[name] = value;