Update publish-release GH workflow to automatically include the offline.zip asset. (#2411)

* Update publish-release GH workflow to include offline.zip asset.

* Adjust upload offline.zip to use gh CLI instead of a third party GH action.

* Update release page template to reference offline.zip.

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

---------

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>

.github/workflows/prepare-release.yml

@@ -14,10 +14,10 @@ jobs:
         runs-on: ubuntu-latest
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v5
 
             - name: Install node
-              uses: actions/setup-node@v4
+              uses: actions/setup-node@v5
               with:
                   node-version: 20.x
 

.github/workflows/publish-release.yml

@@ -13,13 +13,13 @@ jobs:
         runs-on: ubuntu-latest
         permissions:
             id-token: write
-            contents: read
+            contents: write
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v5
 
             - name: Install node
-              uses: actions/setup-node@v4
+              uses: actions/setup-node@v5
               with:
                   node-version: 20.x
 
@@ -57,6 +57,9 @@ jobs:
             - name: build
               run: npm run build
 
+            - name: build offline
+              run: npm run build:offline
+
             - name: Generate index.html in snapshot
               working-directory: .
               run: sed -e 's#_PATH_#https://pyscript.net/releases/${{ github.ref_name }}/#' -e 's#_DOC_VERSION_#${{ github.ref_name }}#' -e 's#_TAG_VERSION_#/tag/${{ github.ref_name }}#' -e 's#_VERSION_#${{ github.ref_name }}#' ./public/index.html > ./core/dist/index.html
@@ -65,14 +68,18 @@ jobs:
               working-directory: .
               run: tar -cvf ../release.tar * && mv ../release.tar .
 
+            - name: Upload offline.zip to release
+              env:
+                  GH_TOKEN: ${{ github.token }}
+              run: gh release upload ${{ github.ref_name }} ./dist/offline.zip
+
             - name: Configure AWS credentials
-              uses: aws-actions/configure-aws-credentials@v4
+              uses: aws-actions/configure-aws-credentials@v5
               with:
                   aws-region: ${{ secrets.AWS_REGION }}
                   role-to-assume: ${{ secrets.AWS_OIDC_RUNNER_ROLE }}
 
             - name: Sync to S3
               run:
-                  | # Update /latest and create an explicitly versioned directory under releases/YYYY.MM.MICRO/
-                  aws s3 sync --quiet ./dist/ s3://pyscript.net/latest/
+                  | # Create an explicitly versioned directory under releases/YYYY.MM.MICRO/
                   aws s3 sync --quiet ./dist/ s3://pyscript.net/releases/${{ github.ref_name }}/

.github/workflows/publish-snapshot.yml

@@ -20,10 +20,10 @@ jobs:
             id-token: write
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v5
 
             - name: Install node
-              uses: actions/setup-node@v4
+              uses: actions/setup-node@v5
               with:
                   node-version: 20.x
 
@@ -62,7 +62,7 @@ jobs:
               run: npm run build
 
             - name: Configure AWS credentials
-              uses: aws-actions/configure-aws-credentials@v4
+              uses: aws-actions/configure-aws-credentials@v5
               with:
                   aws-region: ${{ secrets.AWS_REGION }}
                   role-to-assume: ${{ secrets.AWS_OIDC_RUNNER_ROLE }}

.github/workflows/publish-unstable.yml

@@ -21,10 +21,10 @@ jobs:
                 working-directory: ./core
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v5
 
             - name: Install node
-              uses: actions/setup-node@v4
+              uses: actions/setup-node@v5
               with:
                   node-version: 20.x
 
@@ -67,7 +67,7 @@ jobs:
               run: sed -e 's#_PATH_#./#' -e 's#_DOC_VERSION_#latest#' -e 's#_TAG_VERSION_##' -e 's#_VERSION_#latest#' ./public/index.html > ./core/dist/index.html
 
             - name: Configure AWS credentials
-              uses: aws-actions/configure-aws-credentials@v4
+              uses: aws-actions/configure-aws-credentials@v5
               with:
                   aws-region: ${{ secrets.AWS_REGION }}
                   role-to-assume: ${{ secrets.AWS_OIDC_RUNNER_ROLE }}

.github/workflows/test.yml

@@ -24,7 +24,7 @@ jobs:
             MINICONDA_VERSION: 4.11.0
         steps:
             - name: Checkout
-              uses: actions/checkout@v4
+              uses: actions/checkout@v5
               with:
                   fetch-depth: 3
 
@@ -37,7 +37,7 @@ jobs:
               run: git log --graph -3
 
             - name: Install node
-              uses: actions/setup-node@v4
+              uses: actions/setup-node@v5
               with:
                   node-version: 20.x
 

.pre-commit-config.yaml

@@ -7,7 +7,7 @@ ci:
 default_stages: [pre-commit]
 repos:
     - repo: https://github.com/pre-commit/pre-commit-hooks
-      rev: v5.0.0
+      rev: v6.0.0
       hooks:
           - id: check-builtin-literals
           - id: check-case-conflict
@@ -24,23 +24,30 @@ repos:
             exclude: core/dist|\.min\.js$
           - id: trailing-whitespace
 
-    - repo: https://github.com/psf/black
-      rev: 24.10.0
+    - repo: https://github.com/psf/black-pre-commit-mirror
+      rev: 25.9.0
       hooks:
           - id: black
+            exclude: core/tests
             args: ["-l", "88", "--skip-string-normalization"]
 
     - repo: https://github.com/codespell-project/codespell
-      rev: v2.3.0
+      rev: v2.4.1
       hooks:
           - id: codespell # See 'pyproject.toml' for args
-            exclude: \.js\.map$
+            exclude: fs\.py|\.js\.map$
             additional_dependencies:
                 - tomli
 
+    - repo: https://github.com/astral-sh/ruff-pre-commit
+      rev: v0.13.3
+      hooks:
+          - id: ruff
+            exclude: core/tests
+
     - repo: https://github.com/hoodmane/pyscript-prettier-precommit
       rev: "v3.0.0-alpha.6"
       hooks:
           - id: prettier
-            exclude: core/test|core/dist|core/types|core/src/stdlib/pyscript.js|pyscript\.sw/|core/src/3rd-party
+            exclude: core/tests|core/dist|core/types|core/src/stdlib/pyscript.js|pyscript\.sw/|core/src/3rd-party
             args: [--tab-width, "4"]

.prettierignore

@@ -1,3 +1,4 @@
 ISSUE_TEMPLATE
 *.min.*
 package-lock.json
+bridge/

Makefile

@@ -41,8 +41,8 @@ check-python:
 # Check the environment, install the dependencies.
 setup: check-node check-npm check-python
 	cd core && npm ci && cd ..
-ifeq ($(VIRTUAL_ENV),)
-	echo "\n\n\033[0;31mCannot install Python dependencies. Your virtualenv is not activated.\033[0m"
+ifeq (,$(VIRTUAL_ENV)$(CONDA_PREFIX))
+	echo "\n\n\033[0;31mCannot install Python dependencies. Your virtualenv or conda env is not activated.\033[0m"
 	false
 else
 	python -m pip install -r requirements.txt

README.md

@@ -13,15 +13,15 @@ Using PyScript is as simple as:
         <title>PyScript!</title>
         <link
             rel="stylesheet"
-            href="https://pyscript.net/snapshots/2024.9.2/core.css"
+            href="https://pyscript.net/releases/2025.11.1/core.css"
         />
         <script
             type="module"
-            src="https://pyscript.net/snapshots/2024.9.2/core.js"
+            src="https://pyscript.net/releases/2025.11.1/core.js"
         ></script>
     </head>
     <body>
-        <!-- Use MicroPython to evaluate some Python -->
+        <!-- type mpy (MicroPython) or py (Pyodide) to run some Python -->
         <script type="mpy" terminal>
             print("Hello, world!")
         </script>
@@ -83,3 +83,12 @@ documentation for more information on how to setup your development environment.
 
 The [PyScript organization governance](https://github.com/pyscript/governance)
 is documented in a separate repository.
+
+## Supporters
+
+PyScript is an independent open source project.
+
+However, PyScript was born at [Anaconda Inc](https://anaconda.com/) and its
+core contributors are currently employed by Anaconda to work on PyScript. We
+would like to acknowledge and celebrate Anaconda's continued support of this
+project. Thank you [Anaconda Inc](https://anaconda.com/)!

bridge/README.md

@@ -0,0 +1,59 @@
+# @pyscript/bridge
+
+Import Python utilities directly in JS
+
+```js
+// main thread
+const { ffi: { func_a, func_b } } = await import('./test.js');
+
+// test.js
+import bridge from 'https://esm.run/@pyscript/bridge';
+export const ffi = bridge(import.meta.url, { type: 'mpy', worker: false });
+
+// test.py
+def func_a(value):
+    print(f"hello {value}")
+
+def func_b():
+    import sys
+    return sys.version
+```
+
+### Options
+
+  * **pyscript**: the release version to automatically import if not already available on the page. If no version is provided the *developers' channel* version will be used instead (for developers' purposes only).
+  * **type**: `py` by default to bootstrap *Pyodide*.
+  * **worker**: `true` by default to bootstrap in a *Web Worker*.
+  * **config**: either a *string* or a PyScript compatible config *JS literal* to make it possible to bootstrap files and whatnot. If specified, the `worker` becomes implicitly `true` to avoid multiple configs conflicting on the main thread.
+  * **env**: to share the same environment across multiple modules loaded at different times.
+
+
+## Tests
+
+Run `npx mini-coi .` within this folder to then reach out `http://localhost:8080/test/` that will show:
+
+```
+PyScript Bridge
+------------------
+no config
+```
+
+The [test.js](./test/test.js) files uses the following defaults:
+
+  * `pyscript` as `"2025.8.1"`
+  * `type` as `"mpy"`
+  * `worker` as `false`
+  * `config` as `undefined`
+  * `env` as `undefined`
+
+To test any variant use query string parameters so that `?type=py` will use `py` instead, `worker` will use a worker and `config` will use a basic *config* that brings in another file from the same folder which exposes the version.
+
+To recap: `http://localhost:8080/test/?type=py&worker&config` will show this instead:
+
+```
+PyScript Bridge
+------------------
+3.12.7 (main, May 15 2025, 18:47:24) ...
+```
+
+Please note when a *config* is used, the `worker` attribute is always `true`.

bridge/index.js

@@ -0,0 +1,163 @@
+/*! (c) PyScript Development Team */
+
+const { stringify } = JSON;
+const { assign, create, entries } = Object;
+
+const el = (name, props) => assign(document.createElement(name), props);
+
+/**
+ * Transform a list of keys into a Python dictionary.
+ * `['a', 'b']` => `{ "a": a, "b": b }`
+ * @param {Iterable<string>} keys
+ * @returns {string}
+ */
+const dictionary = keys => {
+  const fields = [];
+  for (const key of keys)
+    fields.push(`${stringify(key)}: ${key}`);
+  return `{ ${fields.join(',')} }`;
+};
+
+/**
+ * Resolve properly config files relative URLs.
+ * @param {string|Object} config - The configuration to normalize.
+ * @param {string} base - The base URL to resolve relative URLs against.
+ * @returns {string} - The JSON serialized config.
+ */
+const normalize = async (config, base) => {
+  if (typeof config === 'string') {
+    base = config;
+    config = await fetch(config).then(res => res.json());
+  }
+  if (typeof config.files === 'object') {
+    const files = {};
+    for (const [key, value] of entries(config.files)) {
+      files[key.startsWith('{') ? key : new URL(key, base)] = value;
+    }
+    config.files = files;
+  }
+  return stringify(config);
+};
+
+// this logic is based on a 3 levels cache ...
+const cache = new Map;
+
+/**
+ * Return a bridge to a Python module via a `.js` file that has a `.py` alter ego.
+ * @param {string} url - The URL of the JS module that has a Python counterpart.
+ * @param {Object} options - The options for the bridge.
+ * @param {string} [options.type='py'] - The `py` or `mpy` interpreter type, `py` by default.
+ * @param {boolean} [options.worker=true] - Whether to use a worker, `true` by default.
+ * @param {string|Object} [options.config=null] - The configuration for the bridge, `null` by default.
+ * @param {string} [options.env=null] - The optional shared environment to use.
+ * @param {string} [options.serviceWorker=null] - The optional service worker to use as fallback.
+ * @returns {Object} - The bridge to the Python module.
+ */
+export default (url, {
+  type = 'py',
+  worker = true,
+  config = null,
+  env = null,
+  serviceWorker = null,
+  pyscript = null,
+} = {}) => {
+  const { protocol, host, pathname } = new URL(url);
+  const py = pathname.replace(/\.m?js(?:\/\+\w+)?$/, '.py');
+  const file = `${protocol}//${host}${py}`;
+
+  // the first cache is about the desired file in the wild ...
+  if (!cache.has(file)) {
+    // the second cache is about all fields one needs to access out there
+    const exports = new Map;
+    let python;
+
+    cache.set(file, new Proxy(create(null), {
+      get(_, field) {
+        if (!exports.has(field)) {
+          // create an async callback once and always return the same later on
+          exports.set(field, async (...args) => {
+            // the third cache is about reaching lazily the code only once
+            // augmenting its content with exports once and drop it on done
+            if (!python) {
+              // do not await or multiple calls will fetch multiple times
+              // just assign the fetch `Promise` once and return it
+              python = fetch(file).then(async response => {
+                const code = await response.text();
+                // create a unique identifier for the Python context
+                const identifier = pathname.replace(/[^a-zA-Z0-9_]/g, '');
+                const name = `__pyscript_${identifier}${Date.now()}`;
+                // create a Python dictionary with all accessed fields
+                const detail = `{"detail":${dictionary(exports.keys())}}`;
+                // create the arguments for the `dispatchEvent` call
+                const eventArgs = `${stringify(name)},${name}to_ts(${detail})`;
+                // bootstrap the script element type and its attributes
+                const script = el('script', { type, textContent: [
+                  '\n', code, '\n',
+                  // this is to avoid local scope name clashing
+                  `from pyscript import window as ${name}`,
+                  `from pyscript.ffi import to_js as ${name}to_ts`,
+                  `${name}.dispatchEvent(${name}.CustomEvent.new(${eventArgs}))`,
+                  // remove these references even if non-clashing to keep
+                  // the local scope clean from undesired entries
+                  `del ${name}`,
+                  `del ${name}to_ts`,
+                ].join('\n') });
+
+                // if config is provided it needs to be a worker to avoid
+                // conflicting with main config on the main thread (just like always)
+                script.toggleAttribute('worker', !!config || !!worker);
+                if (config) {
+                  const attribute = await normalize(config, file);
+                  script.setAttribute('config', attribute);
+                }
+
+                if (env) script.setAttribute('env', env);
+                if (serviceWorker) script.setAttribute('service-worker', serviceWorker);
+
+                // let PyScript resolve and execute this script
+                document.body.appendChild(script);
+
+                // intercept once the unique event identifier with all exports
+                globalThis.addEventListener(
+                  name,
+                  event => {
+                    resolve(event.detail);
+                    script.remove();
+                  },
+                  { once: true }
+                );
+
+                // return a promise that will resolve only once the event
+                // has been emitted and the interpreter evaluated the code
+                const { promise, resolve } = Promise.withResolvers();
+
+                if (!(Symbol.for('@pyscript/core') in globalThis)) {
+                  // bring in PyScript if not available already
+                  const cdn = pyscript ?
+                    `https://pyscript.net/releases/${pyscript}` :
+                    // ⚠️ fallback to developers' channel !!!
+                    'https://cdn.jsdelivr.net/npm/@pyscript/core/dist'
+                    ;
+                  document.head.appendChild(
+                    el('link', { rel: 'stylesheet', href: `${cdn}/core.css` }),
+                  );
+                  try { await import(`${cdn}/core.js`) }
+                  catch {}
+                }
+                return promise;
+              });
+            }
+
+            // return the `Promise` that will after invoke the exported field
+            return python.then(foreign => foreign[field](...args));
+          });
+        }
+
+        // return the lazily to be resolved once callback to invoke
+        return exports.get(field);
+      }
+    }));
+  }
+
+  return cache.get(file);
+};

bridge/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@pyscript/bridge",
+  "version": "0.2.2",
+  "description": "A JS based way to use PyScript modules",
+  "type": "module",
+  "module": "./index.js",
+  "unpkg": "./index.js",
+  "jsdelivr": "./jsdelivr.js",
+  "browser": "./index.js",
+  "main": "./index.js",
+  "keywords": [
+    "PyScript",
+    "JS",
+    "Python",
+    "bridge"
+  ],
+  "files": [
+    "index.js",
+    "README.md"
+  ],
+  "author": "Anaconda Inc.",
+  "license": "APACHE-2.0",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/pyscript/pyscript.git"
+  },
+  "bugs": {
+    "url": "https://github.com/pyscript/pyscript/issues"
+  },
+  "homepage": "https://github.com/pyscript/pyscript#readme"
+}

bridge/test/index.html

@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width,initial-scale=1">
+        <title>PyScript Bridge</title>
+        <style>body { font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; }</style>
+        <!-- for local testing purpose only-->
+        <script type="importmap">{"imports":{"https://esm.run/@pyscript/bridge":"../index.js"}}</script>
+        <script type="module">
+          const { ffi: { test_func, test_other, version } } = await import('./test.js');
+
+          console.time("⏱️ first invoke");
+          const result = await test_func("PyScript Bridge");
+          console.timeEnd("⏱️ first invoke");
+
+          document.body.append(
+            Object.assign(
+              document.createElement("h3"),
+              { textContent: result },
+            ),
+            document.createElement("hr"),
+            await version(),
+          );
+
+          console.time("⏱️ other invokes");
+          await test_other("🐍");
+          console.timeEnd("⏱️ other invokes");
+        </script>
+    </head>
+</html>

bridge/test/remote/index.html

@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width,initial-scale=1">
+        <title>PyScript Bridge</title>
+        <script type="importmap">
+          {
+            "imports": {
+              "https://esm.run/@pyscript/bridge": "https://esm.run/@pyscript/bridge@latest",
+              "https://esm.run/@pyscript/bridge/test/test.js": "https://esm.run/@pyscript/bridge@latest/test/test.js"
+            }
+          }
+        </script>
+        <style>body { font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; }</style>
+        <link rel="stylesheet" href="https://pyscript.net/releases/2025.5.1/core.css" />
+        <script type="module" src="https://pyscript.net/releases/2025.5.1/core.js"></script>
+        <script type="module">
+          const cdn_test = 'https://esm.run/@pyscript/bridge/test/test.js';
+          const { ffi: { test_func, test_other, version } } = await import(cdn_test);
+
+          console.time("⏱️ first invoke");
+          const result = await test_func("PyScript Bridge");
+          console.timeEnd("⏱️ first invoke");
+
+          document.body.append(
+            Object.assign(
+              document.createElement("h3"),
+              { textContent: result },
+            ),
+            document.createElement("hr"),
+            await version(),
+          );
+
+          console.time("⏱️ other invokes");
+          await test_other("🐍");
+          console.timeEnd("⏱️ other invokes");
+        </script>
+    </head>
+</html>

bridge/test/sys_version.py

@@ -0,0 +1,5 @@
+import sys
+
+
+def version():
+    return sys.version

bridge/test/test.js

@@ -0,0 +1,18 @@
+import bridge from "https://esm.run/@pyscript/bridge";
+
+// for local testing purpose only
+const { searchParams } = new URL(location.href);
+
+// the named (or default) export for test.py
+export const ffi = bridge(import.meta.url, {
+  pyscript: "2025.8.1",
+  env: searchParams.get("env"),
+  type: searchParams.get("type") || "mpy",
+  worker: searchParams.has("worker"),
+  config: searchParams.has("config") ?
+    ({
+      files: {
+        "./sys_version.py": "./sys_version.py",
+      },
+    }) : undefined,
+});

bridge/test/test.py

@@ -0,0 +1,22 @@
+from pyscript import config, RUNNING_IN_WORKER
+
+type = config["type"]
+print(f"{type}-script", RUNNING_IN_WORKER and "worker" or "main")
+
+
+def test_func(message):
+    print("Python", message)
+    return message
+
+
+def test_other(message):
+    print("Python", message)
+    return message
+
+
+def version():
+    try:
+        from sys_version import version
+    except ImportError:
+        version = lambda: "no config"
+    return version()

core/LICENSE

@@ -0,0 +1,205 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+
+   Copyright (c) 2022-present, PyScript Development Team
+
+   Originated at Anaconda, Inc. in 2022
+
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

core/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@pyscript/core",
-    "version": "0.6.22",
+    "version": "0.7.11",
     "type": "module",
     "description": "PyScript",
     "module": "./index.js",
@@ -25,25 +25,33 @@
             "types": "./types/core.d.ts",
             "import": "./src/core.js"
         },
+        "./js": {
+            "types": "./types/core.d.ts",
+            "import": "./dist/core.js"
+        },
         "./css": {
             "import": "./dist/core.css"
         },
         "./storage": {
             "import": "./dist/storage.js"
         },
+        "./service-worker": {
+            "import": "./dist/service-worker.js"
+        },
         "./package.json": "./package.json"
     },
     "scripts": {
         "server": "echo \"➡️  TESTS @ $(tput bold)http://localhost:8080/tests/$(tput sgr0)\"; npx static-handler --coi .",
-        "build": "export ESLINT_USE_FLAT_CONFIG=true;npm run build:3rd-party && npm run build:stdlib && npm run build:plugins && npm run build:core && npm run build:tests-index && if [ -z \"$NO_MIN\" ]; then eslint src/ && npm run ts && npm run test:integration; fi",
+        "build": "export ESLINT_USE_FLAT_CONFIG=true;npm run build:3rd-party && npm run build:stdlib && npm run build:plugins && npm run build:core && npm run build:tests-index && if [ -z \"$NO_MIN\" ]; then eslint src/ && npm run test:integration; fi",
         "build:core": "rm -rf dist && rollup --config rollup/core.config.js && cp src/3rd-party/*.css dist/",
         "build:flatted": "node rollup/flatted.cjs",
         "build:plugins": "node rollup/plugins.cjs",
         "build:stdlib": "node rollup/stdlib.cjs",
         "build:3rd-party": "node rollup/3rd-party.cjs",
+        "build:offline": "node rollup/offline.cjs | bash",
         "build:tests-index": "node rollup/build_test_index.cjs",
         "clean:3rd-party": "rm src/3rd-party/*.js && rm src/3rd-party/*.css",
-        "test:integration": "npm run test:ws; static-handler --coi . 2>/dev/null & SH_PID=$!; EXIT_CODE=0; playwright test tests/js_tests.spec.js tests/py_tests.spec.js || EXIT_CODE=$?; kill $SH_PID 2>/dev/null; exit $EXIT_CODE",
+        "test:integration": "npm run test:ws; static-handler --coi . 2>/dev/null & SH_PID=$!; EXIT_CODE=0; (playwright test tests/js_tests.spec.js && playwright test tests/py_tests.main.spec.js && playwright test tests/py_tests.worker.spec.js) || EXIT_CODE=$?; kill $SH_PID 2>/dev/null; exit $EXIT_CODE",
         "test:ws": "bun tests/javascript/ws/index.js & playwright test tests/javascript/ws/index.spec.js",
         "dev": "node dev.cjs",
         "release": "npm run build && npm run zip",
@@ -60,40 +68,40 @@
     "dependencies": {
         "@ungap/with-resolvers": "^0.1.0",
         "@webreflection/idb-map": "^0.3.2",
+        "@webreflection/utils": "^0.1.1",
         "add-promise-listener": "^0.1.3",
         "basic-devtools": "^0.1.6",
-        "polyscript": "^0.16.10",
-        "sabayon": "^0.6.1",
+        "polyscript": "^0.20.0",
         "sticky-module": "^0.1.1",
         "to-json-callback": "^0.1.1",
         "type-checked-collections": "^0.1.7"
     },
     "devDependencies": {
-        "@codemirror/commands": "^6.7.1",
-        "@codemirror/lang-python": "^6.1.6",
-        "@codemirror/language": "^6.10.6",
-        "@codemirror/state": "^6.4.1",
-        "@codemirror/view": "^6.35.0",
-        "@playwright/test": "1.45.3",
-        "@rollup/plugin-commonjs": "^28.0.1",
-        "@rollup/plugin-node-resolve": "^15.3.0",
+        "@codemirror/commands": "^6.10.0",
+        "@codemirror/lang-python": "^6.2.1",
+        "@codemirror/language": "^6.11.3",
+        "@codemirror/state": "^6.5.2",
+        "@codemirror/view": "^6.38.8",
+        "@playwright/test": "^1.56.1",
+        "@rollup/plugin-commonjs": "^29.0.0",
+        "@rollup/plugin-node-resolve": "^16.0.3",
         "@rollup/plugin-terser": "^0.4.4",
-        "@webreflection/toml-j0.4": "^1.1.3",
+        "@webreflection/toml-j0.4": "^1.1.4",
         "@xterm/addon-fit": "^0.10.0",
         "@xterm/addon-web-links": "^0.11.0",
         "@xterm/xterm": "^5.5.0",
-        "bun": "^1.1.38",
-        "chokidar": "^4.0.1",
+        "bun": "^1.3.3",
+        "chokidar": "^4.0.3",
         "codedent": "^0.1.2",
-        "codemirror": "^6.0.1",
-        "eslint": "^9.16.0",
-        "flatted": "^3.3.2",
-        "rollup": "^4.28.1",
+        "codemirror": "^6.0.2",
+        "eslint": "^9.39.1",
+        "flatted": "^3.3.3",
+        "rollup": "^4.53.3",
         "rollup-plugin-postcss": "^4.0.2",
         "rollup-plugin-string": "^3.0.0",
         "static-handler": "^0.5.3",
-        "string-width": "^7.2.0",
-        "typescript": "^5.7.2",
+        "string-width": "^8.1.0",
+        "typescript": "^5.9.3",
         "xterm-readline": "^1.1.2"
     },
     "repository": {

core/pyodide.sh

@@ -0,0 +1,48 @@
+#!/usr/bin/env bash
+
+# This script assumes the following folder structure:
+#   ./pyscript      - it must be a GitHub clone/fork
+#   ./polyscript    - it must be a GitHub clone/fork
+#
+# Running from ./pyscript/core via:
+#
+#   cd ./pyscript/core
+#   bash ./pyodide.sh
+#
+# will print a JSON compatible string like:
+#
+# {
+#   "2024.10.1": "0.26.2",
+#   ...
+#   "2025.11.1": "0.29.0",
+#   "": null
+# }
+#
+# Each key represents the PyScript release and each
+# value represents the Pyodide version used by that PyScript release.
+#
+# The last empty key with `null` value is used just to close the JSON object.
+# One could remove manually that entry as long as there are no dangling commas.
+#
+
+current_pyscript=$(git branch | grep \\* | cut -d ' ' -f2)
+
+echo "{"
+for release in $(git tag --list --sort=version:refname); do
+    git checkout ${release} > /dev/null 2>&1
+    if test -e "package.json"; then
+        polyscript=$(cat package.json | jq -r '.dependencies.polyscript')
+        tag="v${polyscript:1:${#polyscript}-1}"
+        cd ../../polyscript > /dev/null 2>&1
+        current_polyscript=$(git branch | grep \\* | cut -d ' ' -f2)
+        git checkout ${tag} > /dev/null 2>&1
+        if test -e "versions/pyodide"; then
+            echo "  \"${release}\": \"$(cat versions/pyodide)\","
+        fi
+        git checkout ${current_polyscript} > /dev/null 2>&1
+        cd - > /dev/null 2>&1
+    fi
+    git checkout ${current_pyscript} > /dev/null 2>&1
+done
+echo "  \"\": null"
+echo "}"

core/rollup/core.config.js

@@ -53,4 +53,15 @@ export default [
             sourcemap: true,
         },
     },
+    {
+        input: "./src/service-worker.js",
+        plugins: plugins.concat(
+            process.env.NO_MIN
+                ? [nodeResolve(), commonjs()]
+                : [nodeResolve(), commonjs(), terser()],
+        ),
+        output: {
+            file: "./dist/service-worker.js",
+        },
+    },
 ];

core/rollup/offline.cjs

@@ -0,0 +1,79 @@
+const { readFileSync, writeFileSync } = require("node:fs");
+const { join, resolve } = require("node:path");
+
+const versions = resolve(
+    __dirname,
+    "..",
+    "node_modules",
+    "polyscript",
+    "versions",
+);
+let pyodide = String(readFileSync(join(versions, "pyodide"), "utf8")).trim();
+let micropython = String(
+    readFileSync(join(versions, "micropython"), "utf8"),
+).trim();
+
+writeFileSync(
+    join(process.cwd(), "offline.html"),
+    `<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>PyScript Offline</title>
+        <script src="./mini-coi-fd.js"></script>
+        <script type="module" src="./pyscript/core.js" offline></script>
+        <link rel="stylesheet" href="./pyscript/core.css">
+    </head>
+    <body>
+        <script type="mpy">
+            from pyscript import document
+
+            document.body.append("MicroPython Offline", document.createElement("hr"))
+        </script>
+        <script type="py" worker>
+            from pyscript import document
+
+            document.body.append("Pyodide Offline")
+        </script>
+    </body>
+</html>
+`,
+    "utf8",
+);
+
+let bash = `#!/usr/bin/env bash
+rm -rf dist/offline
+
+mkdir -p dist/offline/node_modules
+echo '{"dependencies":{"pyodide":"${pyodide}","@micropython/micropython-webassembly-pyscript":"${micropython}"}}' > dist/offline/package.json
+cd dist/offline
+curl -sLO https://raw.githubusercontent.com/WebReflection/mini-coi/refs/heads/main/mini-coi-fd.js
+npm i
+cd -
+
+mkdir -p dist/offline/pyscript/pyodide
+cd dist/offline/pyscript/pyodide
+cp ../../node_modules/pyodide/pyodide* ./
+cp ../../node_modules/pyodide/python_stdlib.zip ./
+cd -
+
+mkdir -p dist/offline/pyscript/micropython
+cd dist/offline/pyscript/micropython
+cp ../../node_modules/@micropython/micropython-webassembly-pyscript/micropython.* ./
+cd -
+
+rm -rf dist/offline/node_modules
+rm -rf dist/offline/*.json
+
+mv offline.html dist/offline/index.html
+cp dist/*.* dist/offline/pyscript/
+rm -f dist/offline/pyscript/offline.zip
+
+cd dist
+zip -r offline.zip offline
+rm -rf offline
+cd -
+`;
+
+console.log(bash);

core/src/3rd-party-licenses/codemirror.license.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (C) 2018-2021 by Marijn Haverbeke <marijnh@gmail.com> and others
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

core/src/3rd-party-licenses/codemirror_commands.license.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (C) 2018-2021 by Marijn Haverbeke <marijn@haverbeke.berlin> and others
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

core/src/3rd-party-licenses/codemirror_lang-python.license.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (C) 2018-2021 by Marijn Haverbeke <marijn@haverbeke.berlin> and others
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

core/src/3rd-party-licenses/codemirror_language.license.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (C) 2018-2021 by Marijn Haverbeke <marijn@haverbeke.berlin> and others
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

core/src/3rd-party-licenses/codemirror_state.license.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (C) 2018-2021 by Marijn Haverbeke <marijn@haverbeke.berlin> and others
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

core/src/3rd-party-licenses/codemirror_view.license.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (C) 2018-2021 by Marijn Haverbeke <marijn@haverbeke.berlin> and others
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

core/src/3rd-party-licenses/toml.license.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 Jak Wings
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

core/src/3rd-party-licenses/xterm-readline.license.txt

@@ -0,0 +1,25 @@
+Copyright 2021 Erik Bremen
+
+Permission is hereby granted, free of charge, to any
+person obtaining a copy of this software and associated
+documentation files (the "Software"), to deal in the
+Software without restriction, including without
+limitation the rights to use, copy, modify, merge,
+publish, distribute, sublicense, and/or sell copies of
+the Software, and to permit persons to whom the Software
+is furnished to do so, subject to the following
+conditions:
+
+The above copyright notice and this permission notice
+shall be included in all copies or substantial portions
+of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF
+ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
+TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A
+PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT
+SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
+CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR
+IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
+DEALINGS IN THE SOFTWARE.

core/src/3rd-party-licenses/xterm.license.txt

@@ -0,0 +1,21 @@
+Copyright (c) 2017-2019, The xterm.js authors (https://github.com/xtermjs/xterm.js)
+Copyright (c) 2014-2016, SourceLair Private Company (https://www.sourcelair.com)
+Copyright (c) 2012-2013, Christopher Jeffrey (https://github.com/chjj/)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

core/src/3rd-party-licenses/xterm_addon-fit.license.txt

@@ -0,0 +1,19 @@
+Copyright (c) 2019, The xterm.js authors (https://github.com/xtermjs/xterm.js)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

core/src/3rd-party-licenses/xterm_addon-web-links.lixense.txt

@@ -0,0 +1,19 @@
+Copyright (c) 2017, The xterm.js authors (https://github.com/xtermjs/xterm.js)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

core/src/3rd-party/README.md

@@ -5,3 +5,7 @@ This folder contains artifacts created via [3rd-party.cjs](../../rollup/3rd-part
 As we would like to offer a way to run PyScript offline, and we already offer a `dist` folder with all the necessary scripts, we have created a foreign dependencies resolver that allow to lazy-load CDN dependencies out of the box.
 
 Please **note** these dependencies are **not interpreters**, because interpreters have their own mechanism, folders structure, WASM files, and whatnot, to work locally, but at least XTerm or the TOML parser, among other lazy dependencies, should be available within the dist folder.
+
+## Licenses
+
+All licenses provided by 3rd-party authors can be found in [3rd-party-licenses](../3rd-party-licenses/) folder.

core/src/3rd-party/xterm-readline.js

@@ -1,5 +1,5 @@
 /**
- * Bundled by jsDelivr using Rollup v2.79.1 and Terser v5.19.2.
+ * Bundled by jsDelivr using Rollup v2.79.2 and Terser v5.39.0.
  * Original file: /npm/xterm-readline@1.1.2/lib/readline.js
  *
  * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files

core/src/3rd-party/xterm.css

@@ -1,5 +1,5 @@
 /**
- * Minified by jsDelivr using clean-css v5.3.2.
+ * Minified by jsDelivr using clean-css v5.3.3.
  * Original file: /npm/@xterm/xterm@5.5.0/css/xterm.css
  *
  * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files

core/src/3rd-party/xterm_addon-fit.js

@@ -1,5 +1,5 @@
 /**
- * Bundled by jsDelivr using Rollup v2.79.1 and Terser v5.19.2.
+ * Bundled by jsDelivr using Rollup v2.79.2 and Terser v5.39.0.
  * Original file: /npm/@xterm/addon-fit@0.10.0/lib/addon-fit.js
  *
  * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files

core/src/3rd-party/xterm_addon-web-links.js

@@ -1,5 +1,5 @@
 /**
- * Bundled by jsDelivr using Rollup v2.79.1 and Terser v5.19.2.
+ * Bundled by jsDelivr using Rollup v2.79.2 and Terser v5.39.0.
  * Original file: /npm/@xterm/addon-web-links@0.11.0/lib/addon-web-links.js
  *
  * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files

core/src/all-done.js

@@ -1,3 +1,4 @@
+import withResolvers from "@webreflection/utils/with-resolvers";
 import TYPES from "./types.js";
 
 const waitForIt = [];
@@ -5,7 +6,7 @@ const waitForIt = [];
 for (const [TYPE] of TYPES) {
     const selectors = [`script[type="${TYPE}"]`, `${TYPE}-script`];
     for (const element of document.querySelectorAll(selectors.join(","))) {
-        const { promise, resolve } = Promise.withResolvers();
+        const { promise, resolve } = withResolvers();
         waitForIt.push(promise);
         element.addEventListener(`${TYPE}:done`, resolve, { once: true });
     }

core/src/config.js

@@ -25,7 +25,7 @@ const badURL = (url, expected = "") => {
  * @param {string?} type the optional type to enforce
  * @returns {{json: boolean, toml: boolean, text: string}}
  */
-const configDetails = async (config, type) => {
+export const configDetails = async (config, type) => {
     let text = config?.trim();
     // we only support an object as root config
     let url = "",
@@ -70,6 +70,7 @@ for (const [TYPE] of TYPES) {
 
     let config,
         type,
+        parser,
         pyElement,
         pyConfigs = $$(`${TYPE}-config`),
         attrConfigs = $$(
@@ -92,9 +93,11 @@ for (const [TYPE] of TYPES) {
             [pyElement] = pyConfigs;
             config = pyElement.getAttribute("src") || pyElement.textContent;
             type = pyElement.getAttribute("type");
+            parser = pyElement.getAttribute("config-parser");
         } else if (attrConfigs.length) {
             [pyElement, ...attrConfigs] = attrConfigs;
             config = pyElement.getAttribute("config");
+            parser = pyElement.getAttribute("config-parser");
             // throw an error if dirrent scripts use different configs
             if (
                 attrConfigs.some((el) => el.getAttribute("config") !== config)
@@ -120,9 +123,12 @@ for (const [TYPE] of TYPES) {
                 }
             } else if (toml || type === "toml") {
                 try {
-                    const { parse } = await import(
-                        /* webpackIgnore: true */ "./3rd-party/toml.js"
-                    );
+                    const module = parser
+                        ? await import(parser)
+                        : await import(
+                              /* webpackIgnore: true */ "./3rd-party/toml.js"
+                          );
+                    const parse = module.parse || module.default;
                     parsed = parse(text);
                 } catch (e) {
                     error = syntaxError("TOML", url, e);
@@ -154,6 +160,9 @@ for (const [TYPE] of TYPES) {
         return await Promise.all(toBeAwaited);
     };
 
+    if (Number.isSafeInteger(parsed?.experimental_ffi_timeout))
+        globalThis.reflected_ffi_timeout = parsed?.experimental_ffi_timeout;
+
     configs.set(TYPE, { config: parsed, configURL, plugins, error });
 }
 

core/src/core.css

@@ -28,53 +28,34 @@ mpy-config {
 .py-editor-run-button,
 .mpy-editor-run-button {
     position: absolute;
+    display: flex;
     right: 0.5rem;
     bottom: 0.5rem;
     opacity: 0;
     transition: opacity 0.25s;
     z-index: 1;
+    padding: 0;
 }
 .py-editor-box:hover .py-editor-run-button,
 .mpy-editor-box:hover .mpy-editor-run-button,
 .py-editor-run-button:focus,
-.py-editor-run-button:disabled,
+.py-editor-run-button.running,
 .mpy-editor-run-button:focus,
-.mpy-editor-run-button:disabled {
+.mpy-editor-run-button.running {
     opacity: 1;
 }
 
-@keyframes spinner {
-    to {
-        transform: rotate(360deg);
-    }
-}
-.py-editor-run-button:disabled > *,
-.mpy-editor-run-button:disabled > * {
-    display: none; /* hide all the child elements of the run button when it is disabled */
-}
-.py-editor-run-button:disabled,
-.mpy-editor-run-button:disabled {
-    border-width: 0;
-}
-.py-editor-run-button:disabled::before,
-.mpy-editor-run-button:disabled::before {
-    content: "";
-    box-sizing: border-box;
-    position: absolute;
-    top: 100%;
-    left: 100%;
-    width: 20px;
-    height: 20px;
-    margin-top: -23px; /* hardcoded value to center the spinner on the run button */
-    margin-left: -26px; /* hardcoded value to center the spinner on the run button */
-    border-radius: 50%;
-    border: 2px solid #aaa;
-    border-top-color: #000;
-    background-color: #fff;
-    animation: spinner 0.6s linear infinite;
-}
-
 py-terminal span,
 mpy-terminal span {
     letter-spacing: 0 !important;
 }
+
+dialog.pyscript-fs {
+    border-radius: 8px;
+    border-width: 1px;
+}
+
+dialog.pyscript-fs > div {
+    display: flex;
+    justify-content: space-between;
+}

core/src/core.js

@@ -1,7 +1,8 @@
 /*! (c) PyScript Development Team */
 
+import "./zero-redirect.js";
 import stickyModule from "sticky-module";
-import "@ungap/with-resolvers";
+import withResolvers from "@webreflection/utils/with-resolvers";
 
 import {
     INVALID_CONTENT,
@@ -33,6 +34,7 @@ import {
     createFunction,
     inputFailure,
 } from "./hooks.js";
+import * as fs from "./fs.js";
 
 import codemirror from "./plugins/codemirror.js";
 export { codemirror };
@@ -115,7 +117,7 @@ for (const [TYPE, interpreter] of TYPES) {
         else dispatch(element, TYPE, "done");
     };
 
-    const { config, configURL, plugins, error } = configs.get(TYPE);
+    let { config, configURL, plugins, error } = configs.get(TYPE);
 
     // create a unique identifier when/if needed
     let id = 0;
@@ -167,6 +169,8 @@ for (const [TYPE, interpreter] of TYPES) {
         // enrich the Python env with some JS utility for main
         interpreter.registerJsModule("_pyscript", {
             PyWorker,
+            fs,
+            interpreter,
             js_import: (...urls) => Promise.all(urls.map((url) => import(url))),
             get target() {
                 return isScript(currentElement)
@@ -307,13 +311,24 @@ for (const [TYPE, interpreter] of TYPES) {
 
             hooked.set(TYPE, hooks);
 
+            // allow offline interpreter detection via [offline] attribute
+            let version = offline_interpreter(config);
+            if (!version) {
+                const css = "script[type='module'][offline]";
+                const s = document.querySelector(css)?.src;
+                if (s && import.meta.url.startsWith(s.replace(/\.js$/, ""))) {
+                    version = `./pyscript/${interpreter}/${interpreter}.mjs`;
+                    version = offline_interpreter({ interpreter: version });
+                }
+            }
+
             define(TYPE, {
                 config,
                 configURL,
                 interpreter,
                 hooks,
+                version,
                 env: `${TYPE}-script`,
-                version: offline_interpreter(config),
                 onerror(error, element) {
                     errors.set(element, error);
                 },
@@ -324,7 +339,7 @@ for (const [TYPE, interpreter] of TYPES) {
                 class extends HTMLElement {
                     constructor() {
                         assign(super(), {
-                            _wrap: Promise.withResolvers(),
+                            _wrap: withResolvers(),
                             srcCode: "",
                             executed: false,
                         });

core/src/fs.js

@@ -0,0 +1,82 @@
+import IDBMap from "@webreflection/idb-map";
+import withResolvers from "@webreflection/utils/with-resolvers";
+import { assign } from "polyscript/exports";
+import { $$ } from "basic-devtools";
+
+const stop = (event) => {
+    event.preventDefault();
+    event.stopImmediatePropagation();
+};
+
+// ⚠️ these two constants MUST be passed as `fs`
+//     within the worker onBeforeRunAsync hook!
+export const NAMESPACE = "@pyscript.fs";
+export const ERROR = "storage permissions not granted";
+
+export const idb = new IDBMap(NAMESPACE);
+
+/**
+ * Ask a user action via dialog and returns the directory handler once granted.
+ * @param {{id?:string, mode?:"read"|"readwrite", hint?:"desktop"|"documents"|"downloads"|"music"|"pictures"|"videos"}} options
+ * @returns {Promise<FileSystemDirectoryHandle>}
+ */
+export const getFileSystemDirectoryHandle = async (options) => {
+    if (!("showDirectoryPicker" in globalThis)) {
+        return Promise.reject(
+            new Error("showDirectoryPicker is not supported"),
+        );
+    }
+
+    const { promise, resolve, reject } = withResolvers();
+
+    const how = { id: "pyscript", mode: "readwrite", ...options };
+    if (options.hint) how.startIn = options.hint;
+
+    const transient = async () => {
+        try {
+            /* eslint-disable */
+            const handler = await showDirectoryPicker(how);
+            /* eslint-enable */
+            if ((await handler.requestPermission(how)) === "granted") {
+                resolve(handler);
+                return true;
+            }
+        } catch ({ message }) {
+            console.warn(message);
+        }
+        return false;
+    };
+
+    // in case the user decided to attach the event itself
+    // as opposite of relying our dialog walkthrough
+    if (navigator.userActivation?.isActive) {
+        if (!(await transient())) reject(new Error(ERROR));
+    } else {
+        const dialog = assign(document.createElement("dialog"), {
+            className: "pyscript-fs",
+            innerHTML: [
+                "<strong>ℹ️ Persistent FileSystem</strong><hr>",
+                "<p><small>PyScript would like to access a local folder.</small></p>",
+                "<div><button title='ok'>✅ Authorize</button>",
+                "<button title='cancel'>❌</button></div>",
+            ].join(""),
+        });
+
+        const [ok, cancel] = $$("button", dialog);
+
+        ok.addEventListener("click", async (event) => {
+            stop(event);
+            if (await transient()) dialog.close();
+        });
+
+        cancel.addEventListener("click", async (event) => {
+            stop(event);
+            reject(new Error(ERROR));
+            dialog.close();
+        });
+
+        document.body.appendChild(dialog).showModal();
+    }
+
+    return promise;
+};

core/src/hooks.js

@@ -88,7 +88,19 @@ export const hooks = {
         /** @type {Set<function>} */
         onBeforeRun: new SetFunction(),
         /** @type {Set<function>} */
-        onBeforeRunAsync: new SetFunction(),
+        onBeforeRunAsync: new SetFunction([
+            ({ interpreter }) => {
+                interpreter.registerJsModule("_pyscript", {
+                    // cannot be imported from fs.js
+                    // because this code is stringified
+                    fs: {
+                        ERROR: "storage permissions not granted",
+                        NAMESPACE: "@pyscript.fs",
+                    },
+                    interpreter,
+                });
+            },
+        ]),
         /** @type {Set<function>} */
         onAfterRun: new SetFunction(),
         /** @type {Set<function>} */

core/src/plugins.js

@@ -25,6 +25,11 @@ export default {
             /* webpackIgnore: true */
             "./plugins/py-editor.js"
         ),
+    ["py-game"]: () =>
+        import(
+            /* webpackIgnore: true */
+            "./plugins/py-game.js"
+        ),
     ["py-terminal"]: () =>
         import(
             /* webpackIgnore: true */

core/src/plugins/donkey.js

@@ -5,7 +5,13 @@ const { stringify } = JSON;
 
 const invoke = (name, args) => `${name}(code, ${args.join(", ")})`;
 
-const donkey = ({ type = "py", persistent, terminal, config }) => {
+const donkey = ({
+    type = "py",
+    persistent,
+    terminal,
+    config,
+    serviceWorker,
+}) => {
     const globals = terminal ? '{"__terminal__":__terminal__}' : "{}";
     const args = persistent ? ["globals()", "__locals__"] : [globals, "{}"];
 
@@ -46,6 +52,7 @@ const donkey = ({ type = "py", persistent, terminal, config }) => {
             typeof config === "string" ? config : stringify(config),
         );
     }
+    if (serviceWorker) script.setAttribute("service-worker", serviceWorker);
 
     return addPromiseListener(
         document.body.appendChild(script),

core/src/plugins/py-editor.js

@@ -1,16 +1,19 @@
 // PyScript py-editor plugin
+import withResolvers from "@webreflection/utils/with-resolvers";
 import { Hook, XWorker, dedent, defineProperties } from "polyscript/exports";
 import { TYPES, offline_interpreter, relative_url, stdlib } from "../core.js";
 import { notify } from "./error.js";
 import codemirror from "./codemirror.js";
 
-const RUN_BUTTON = `<svg style="height:20px;width:20px;vertical-align:-.125em;transform-origin:center;overflow:visible;color:green" viewBox="0 0 384 512" aria-hidden="true" role="img" xmlns="http://www.w3.org/2000/svg"><g transform="translate(192 256)" transform-origin="96 0"><g transform="translate(0,0) scale(1,1)"><path d="M361 215C375.3 223.8 384 239.3 384 256C384 272.7 375.3 288.2 361 296.1L73.03 472.1C58.21 482 39.66 482.4 24.52 473.9C9.377 465.4 0 449.4 0 432V80C0 62.64 9.377 46.63 24.52 38.13C39.66 29.64 58.21 29.99 73.03 39.04L361 215z" fill="currentColor" transform="translate(-192 -256)"></path></g></g></svg>`;
+const RUN_BUTTON = `<svg style="height:24px;width:24px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,12a1,1,0,0,1-.55.89l-10,5A1,1,0,0,1,8,18a1,1,0,0,1-.53-.15A1,1,0,0,1,7,17V7a1,1,0,0,1,1.45-.89l10,5A1,1,0,0,1,19,12Z" fill="#464646"/></svg>`;
+const STOP_BUTTON = `<svg style="height:24px;width:24px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 7h10v10H7z" style="fill:#464646;stroke:#464646;stroke-width:1;stroke-linecap:butt;stroke-linejoin:round;stroke-dasharray:none;paint-order:normal"/></svg>`;
 
 let id = 0;
 const getID = (type) => `${type}-editor-${id++}`;
 
 const envs = new Map();
 const configs = new Map();
+const editors = new WeakMap();
 
 const hooks = {
     worker: {
@@ -30,12 +33,18 @@ const validate = (config, result) => {
     return result;
 };
 
-async function execute({ currentTarget }) {
+const getRelatedScript = (target, type) => {
+    const editor = target.closest(`.${type}-editor-box`);
+    return editor?.parentNode?.previousElementSibling;
+};
+
+async function execute({ currentTarget, script }) {
     const { env, pySrc, outDiv } = this;
     const hasRunButton = !!currentTarget;
 
     if (hasRunButton) {
-        currentTarget.disabled = true;
+        currentTarget.classList.add("running");
+        currentTarget.innerHTML = STOP_BUTTON;
         outDiv.innerHTML = "";
     }
 
@@ -82,17 +91,15 @@ async function execute({ currentTarget }) {
         // creation and destruction of editors on the fly
         if (hasRunButton) {
             for (const type of TYPES.keys()) {
-                const editor = currentTarget.closest(`.${type}-editor-box`);
-                const script = editor?.parentNode?.previousElementSibling;
-                if (script) {
-                    defineProperties(script, { xworker: { value: xworker } });
-                    break;
-                }
+                script = getRelatedScript(currentTarget, type);
+                if (script) break;
             }
         }
 
+        defineProperties(script, { xworker: { value: xworker } });
+
         const { sync } = xworker;
-        const { promise, resolve } = Promise.withResolvers();
+        const { promise, resolve } = withResolvers();
         envs.set(env, promise);
         sync.revoke = () => {
             URL.revokeObjectURL(srcLink);
@@ -116,7 +123,18 @@ async function execute({ currentTarget }) {
         };
 
         const enable = () => {
-            if (hasRunButton) currentTarget.disabled = false;
+            if (hasRunButton) {
+                currentTarget.classList.remove("running");
+                currentTarget.innerHTML = RUN_BUTTON;
+                const { previousElementSibling } =
+                    currentTarget.closest("[data-env]").parentElement;
+                previousElementSibling?.dispatchEvent(
+                    new Event("py-editor:done", {
+                        bubbles: true,
+                        cancelable: true,
+                    }),
+                );
+            }
         };
         const { sync } = xworker;
         sync.write = (str) => {
@@ -138,12 +156,54 @@ async function execute({ currentTarget }) {
     });
 }
 
+const replaceScript = (script, type) => {
+    script.xworker?.terminate();
+    const clone = script.cloneNode(true);
+    clone.type = `${type}-editor`;
+    const editor = editors.get(script);
+    if (editor) {
+        const content = editor.state.doc.toString();
+        clone.textContent = content;
+        editors.delete(script);
+        script.nextElementSibling.remove();
+    }
+    script.replaceWith(clone);
+};
+
 const makeRunButton = (handler, type) => {
     const runButton = document.createElement("button");
     runButton.className = `absolute ${type}-editor-run-button`;
     runButton.innerHTML = RUN_BUTTON;
     runButton.setAttribute("aria-label", "Python Script Run Button");
     runButton.addEventListener("click", async (event) => {
+        if (
+            runButton.classList.contains("running") &&
+            confirm("Stop evaluating this code?")
+        ) {
+            const script = getRelatedScript(runButton, type);
+            if (script) {
+                const env = script.getAttribute("env");
+                // remove the bootstrapped env which could be one or shared
+                if (env) {
+                    for (const [key, value] of TYPES) {
+                        if (key === type) {
+                            configs.delete(`${value}-${env}`);
+                            envs.delete(`${value}-${env}`);
+                            break;
+                        }
+                    }
+                }
+                // lonley script without setup node should be replaced
+                if (script.xworker) replaceScript(script, type);
+                // all scripts sharing the same env should be replaced
+                else {
+                    const sel = `script[type^="${type}-editor"][env="${env}"]`;
+                    for (const script of document.querySelectorAll(sel))
+                        replaceScript(script, type);
+                }
+            }
+            return;
+        }
         runButton.blur();
         await handler.handleEvent(event);
     });
@@ -328,7 +388,7 @@ const init = async (script, type, interpreter) => {
     };
 
     if (isSetup) {
-        await context.handleEvent({ currentTarget: null });
+        await context.handleEvent({ currentTarget: null, script });
         notifyEditor();
         return;
     }
@@ -366,16 +426,17 @@ const init = async (script, type, interpreter) => {
     // preserve user indentation, if any
     const indentation = /^([ \t]+)/m.test(doc) ? RegExp.$1 : "    ";
 
-    const listener = () => runButton.click();
+    const listener = () => !runButton.click();
     const editor = new EditorView({
         extensions: [
             indentUnit.of(indentation),
             new Compartment().of(python()),
             keymap.of([
-                ...defaultKeymap,
                 { key: "Ctrl-Enter", run: listener, preventDefault: true },
                 { key: "Cmd-Enter", run: listener, preventDefault: true },
                 { key: "Shift-Enter", run: listener, preventDefault: true },
+                // Consider removing defaultKeymap as likely redundant with basicSetup
+                ...defaultKeymap,
                 // @see https://codemirror.net/examples/tab/
                 indentWithTab,
             ]),
@@ -387,6 +448,7 @@ const init = async (script, type, interpreter) => {
         doc,
     });
 
+    editors.set(script, editor);
     editor.focus();
     notifyEditor();
 };

core/src/plugins/py-game.js

@@ -0,0 +1,112 @@
+import {
+    dedent,
+    define,
+    createProgress,
+    loadProgress,
+} from "polyscript/exports";
+
+import { stdlib } from "../core.js";
+import { configDetails } from "../config.js";
+import { getText } from "../fetch.js";
+
+const progress = createProgress("py-game");
+
+const inputPatch = `
+import builtins
+def input(prompt=""):
+    import js
+    return js.prompt(prompt)
+
+builtins.input = input
+del builtins
+del input
+`;
+
+let toBeWarned = true;
+
+const hooks = {
+    main: {
+        onReady: async (wrap, script) => {
+            if (toBeWarned) {
+                toBeWarned = false;
+                console.warn("⚠️ EXPERIMENTAL `py-game` FEATURE");
+            }
+
+            let config = {};
+            if (script.hasAttribute("config")) {
+                const value = script.getAttribute("config");
+                const { json, toml, text, url } = await configDetails(value);
+                if (json) config = JSON.parse(text);
+                else if (toml) {
+                    const { parse } = await import(
+                        /* webpackIgnore: true */ "../3rd-party/toml.js"
+                    );
+                    config = parse(text);
+                }
+                if (config.packages) {
+                    await wrap.interpreter.loadPackage("micropip");
+                    const micropip = wrap.interpreter.pyimport("micropip");
+                    await micropip.install(config.packages, {
+                        keep_going: true,
+                    });
+                    micropip.destroy();
+                }
+                await loadProgress(
+                    "py-game",
+                    progress,
+                    wrap.interpreter,
+                    config,
+                    url ? new URL(url, location.href).href : location.href,
+                );
+            }
+
+            wrap.interpreter.registerJsModule("_pyscript", {
+                PyWorker() {
+                    throw new Error(
+                        "Unable to use PyWorker in py-game scripts",
+                    );
+                },
+                js_import: (...urls) =>
+                    Promise.all(urls.map((url) => import(url))),
+                get target() {
+                    return script.id;
+                },
+            });
+
+            await wrap.interpreter.runPythonAsync(stdlib);
+            wrap.interpreter.runPython(inputPatch);
+
+            let code = dedent(script.textContent);
+            if (script.src) code = await fetch(script.src).then(getText);
+
+            const target = script.getAttribute("target") || "canvas";
+            const canvas = document.getElementById(target);
+            wrap.interpreter.canvas.setCanvas2D(canvas);
+
+            // allow 3rd party to hook themselves right before
+            // the code gets executed
+            const event = new CustomEvent("py-game", {
+                bubbles: true,
+                cancelable: true,
+                detail: {
+                    canvas,
+                    code,
+                    config,
+                    wrap,
+                },
+            });
+            script.dispatchEvent(event);
+            // run only if the default was not prevented
+            if (!event.defaultPrevented)
+                await wrap.interpreter.runPythonAsync(code);
+        },
+    },
+};
+
+define("py-game", {
+    config: { packages: ["pygame-ce"] },
+    configURL: new URL("./config.txt", location.href).href,
+    interpreter: "pyodide",
+    env: "py-game",
+    hooks,
+});

core/src/plugins/py-terminal/mpy.js

@@ -1,4 +1,5 @@
 // PyScript pyodide terminal plugin
+import withResolvers from "@webreflection/utils/with-resolvers";
 import { defineProperties } from "polyscript/exports";
 import { hooks, inputFailure } from "../../core.js";
 
@@ -146,7 +147,7 @@ export default async (element) => {
             // frees the worker on \r
             sync.pyterminal_read = (buffer) => {
                 terminal.write(buffer);
-                promisedChunks = Promise.withResolvers();
+                promisedChunks = withResolvers();
                 return promisedChunks.promise;
             };
 

core/src/service-worker.js

@@ -0,0 +1 @@
+import "polyscript/service-worker";

core/src/stdlib/pyscript/display.py

@@ -4,6 +4,7 @@ import io
 import re
 
 from pyscript.magic_js import current_target, document, window
+from pyscript.ffi import is_none
 
 _MIME_METHODS = {
     "savefig": "image/png",
@@ -73,14 +74,14 @@ def _eval_formatter(obj, print_method):
     """
     if print_method == "__repr__":
         return repr(obj)
-    elif hasattr(obj, print_method):
+    if hasattr(obj, print_method):
         if print_method == "savefig":
             buf = io.BytesIO()
             obj.savefig(buf, format="png")
             buf.seek(0)
             return base64.b64encode(buf.read()).decode("utf-8")
         return getattr(obj, print_method)()
-    elif print_method == "_repr_mimebundle_":
+    if print_method == "_repr_mimebundle_":
         return {}, {}
     return None
 
@@ -105,13 +106,13 @@ def _format_mime(obj):
         else:
             output = _eval_formatter(obj, method)
 
-        if output is None:
+        if is_none(output):
             continue
-        elif mime_type not in _MIME_RENDERERS:
+        if mime_type not in _MIME_RENDERERS:
             not_available.append(mime_type)
             continue
         break
-    if output is None:
+    if is_none(output):
         if not_available:
             window.console.warn(
                 f"Rendered object requested unavailable MIME renderers: {not_available}"
@@ -135,7 +136,7 @@ def _write(element, value, append=False):
         element.append(out_element)
     else:
         out_element = element.lastElementChild
-        if out_element is None:
+        if is_none(out_element):
             out_element = element
 
     if mime_type in ("application/javascript", "text/html"):
@@ -146,12 +147,14 @@ def _write(element, value, append=False):
 
 
 def display(*values, target=None, append=True):
-    if target is None:
+    if is_none(target):
         target = current_target()
     elif not isinstance(target, str):
-        raise TypeError(f"target must be str or None, not {target.__class__.__name__}")
+        msg = f"target must be str or None, not {target.__class__.__name__}"
+        raise TypeError(msg)
     elif target == "":
-        raise ValueError("Cannot have an empty target")
+        msg = "Cannot have an empty target"
+        raise ValueError(msg)
     elif target.startswith("#"):
         # note: here target is str and not None!
         # align with @when behavior
@@ -160,10 +163,9 @@ def display(*values, target=None, append=True):
     element = document.getElementById(target)
 
     # If target cannot be found on the page, a ValueError is raised
-    if element is None:
-        raise ValueError(
-            f"Invalid selector with id={target}. Cannot be found in the page."
-        )
+    if is_none(element):
+        msg = f"Invalid selector with id={target}. Cannot be found in the page."
+        raise ValueError(msg)
 
     # if element is a <script type="py">, it has a 'target' attribute which
     # points to the visual element holding the displayed values. In that case,

core/src/stdlib/pyscript/events.py

@@ -36,7 +36,8 @@ class Event:
             if listener not in self._listeners:
                 self._listeners.append(listener)
         else:
-            raise ValueError("Listener must be callable or awaitable.")
+            msg = "Listener must be callable or awaitable."
+            raise ValueError(msg)
 
     def remove_listener(self, *args):
         """
@@ -76,7 +77,8 @@ def when(target, *args, **kwargs):
         # Extract the selector from the arguments or keyword arguments.
         selector = args[0] if args else kwargs.pop("selector")
         if not selector:
-            raise ValueError("No selector provided.")
+            msg = "No selector provided."
+            raise ValueError(msg)
         # Grab the DOM elements to which the target event will be attached.
         from pyscript.web import Element, ElementCollection
 
@@ -90,60 +92,26 @@ def when(target, *args, **kwargs):
             elements = selector if isinstance(selector, list) else [selector]
 
     def decorator(func):
-        if config["type"] == "mpy":  # Is MicroPython?
+        sig = inspect.signature(func)
+        if sig.parameters:
+            if is_awaitable(func):
+
+                async def wrapper(event):
+                    return await func(event)
+
+            else:
+                wrapper = func
+        else:
+            # Function doesn't receive events.
             if is_awaitable(func):
 
                 async def wrapper(*args, **kwargs):
-                    """
-                    This is  a very ugly hack to get micropython working because
-                    `inspect.signature` doesn't exist. It may be actually better
-                    to not try any magic for now and raise the error.
-                    """
-                    try:
-                        return await func(*args, **kwargs)
-
-                    except TypeError as e:
-                        if "takes" in str(e) and "positional arguments" in str(e):
-                            return await func()
-                        raise
+                    return await func()
 
             else:
 
                 def wrapper(*args, **kwargs):
-                    """
-                    This is  a very ugly hack to get micropython working because
-                    `inspect.signature` doesn't exist. It may be actually better
-                    to not try any magic for now and raise the error.
-                    """
-                    try:
-                        return func(*args, **kwargs)
-
-                    except TypeError as e:
-                        if "takes" in str(e) and "positional arguments" in str(e):
-                            return func()
-                        raise
-
-        else:
-            sig = inspect.signature(func)
-            if sig.parameters:
-                if is_awaitable(func):
-
-                    async def wrapper(event):
-                        return await func(event)
-
-                else:
-                    wrapper = func
-            else:
-                # Function doesn't receive events.
-                if is_awaitable(func):
-
-                    async def wrapper(*args, **kwargs):
-                        return await func()
-
-                else:
-
-                    def wrapper(*args, **kwargs):
-                        return func()
+                    return func()
 
         wrapper = wraps(func)(wrapper)
         if isinstance(target, Event):

core/src/stdlib/pyscript/ffi.py

@@ -2,8 +2,10 @@ try:
     import js
     from pyodide.ffi import create_proxy as _cp
     from pyodide.ffi import to_js as _py_tjs
+    from pyodide.ffi import jsnull
 
     from_entries = js.Object.fromEntries
+    is_none = lambda value: value is None or value is jsnull
 
     def _tjs(value, **kw):
         if not hasattr(kw, "dict_converter"):
@@ -13,6 +15,34 @@ try:
 except:
     from jsffi import create_proxy as _cp
     from jsffi import to_js as _tjs
+    import js
+
+    jsnull = js.Object.getPrototypeOf(js.Object.prototype)
+    is_none = lambda value: value is None or value is jsnull
 
 create_proxy = _cp
 to_js = _tjs
+
+try:
+    from polyscript import ffi as _ffi
+
+    direct = _ffi.direct
+    gather = _ffi.gather
+    query = _ffi.query
+
+    def assign(source, *args):
+        for arg in args:
+            _ffi.assign(source, to_js(arg))
+        return source
+
+except:
+    import js
+
+    _assign = js.Object.assign
+
+    direct = lambda source: source
+
+    def assign(source, *args):
+        for arg in args:
+            _assign(source, to_js(arg))
+        return source

core/src/stdlib/pyscript/flatted.py

@@ -31,7 +31,7 @@ def _object_keys(value):
 
 
 def _is_array(value):
-    return isinstance(value, list) or isinstance(value, tuple)
+    return isinstance(value, (list, tuple))
 
 
 def _is_object(value):
@@ -60,10 +60,10 @@ def _loop(keys, input, known, output):
 
 
 def _ref(key, value, input, known, output):
-    if _is_array(value) and not value in known:
+    if _is_array(value) and value not in known:
         known.append(value)
         value = _loop(_array_keys(value), input, known, value)
-    elif _is_object(value) and not value in known:
+    elif _is_object(value) and value not in known:
         known.append(value)
         value = _loop(_object_keys(value), input, known, value)
 

core/src/stdlib/pyscript/fs.py

@@ -0,0 +1,102 @@
+mounted = {}
+
+
+async def get_handler(details):
+    handler = details.handler
+    options = details.options
+    permission = await handler.queryPermission(options)
+    return handler if permission == "granted" else None
+
+
+async def mount(path, mode="readwrite", root="", id="pyscript"):
+    import js
+    from _pyscript import fs, interpreter
+    from pyscript.ffi import to_js
+    from pyscript.magic_js import (
+        RUNNING_IN_WORKER,
+        sync,
+    )
+
+    js.console.warn("experimental pyscript.fs ⚠️")
+
+    details = None
+    handler = None
+
+    uid = f"{path}@{id}"
+
+    options = {"id": id, "mode": mode}
+    if root != "":
+        options["startIn"] = root
+
+    if RUNNING_IN_WORKER:
+        fsh = sync.storeFSHandler(uid, to_js(options))
+
+        # allow both async and/or SharedArrayBuffer use case
+        if isinstance(fsh, bool):
+            success = fsh
+        else:
+            success = await fsh
+
+        if success:
+            from polyscript import IDBMap
+            from pyscript import window
+
+            idbm = IDBMap.new(fs.NAMESPACE)
+            details = await idbm.get(uid)
+            handler = await get_handler(details)
+            if handler is None:
+                # force await in either async or sync scenario
+                await js.Promise.resolve(sync.getFSHandler(details.options))
+                handler = details.handler
+
+        else:
+            raise RuntimeError(fs.ERROR)
+
+    else:
+        success = await fs.idb.has(uid)
+
+        if success:
+            details = await fs.idb.get(uid)
+            handler = await get_handler(details)
+            if handler is None:
+                handler = await fs.getFileSystemDirectoryHandle(details.options)
+        else:
+            js_options = to_js(options)
+            handler = await fs.getFileSystemDirectoryHandle(js_options)
+            details = {"handler": handler, "options": js_options}
+            await fs.idb.set(uid, to_js(details))
+
+    mounted[path] = await interpreter.mountNativeFS(path, handler)
+
+
+async def revoke(path, id="pyscript"):
+    from _pyscript import fs, interpreter
+    from pyscript.magic_js import (
+        RUNNING_IN_WORKER,
+        sync,
+    )
+
+    uid = f"{path}@{id}"
+
+    if RUNNING_IN_WORKER:
+        had = sync.deleteFSHandler(uid)
+    else:
+        had = await fs.idb.has(uid)
+        if had:
+            had = await fs.idb.delete(uid)
+
+    if had:
+        interpreter._module.FS.unmount(path)
+
+    return had
+
+
+async def sync(path):
+    await mounted[path].syncfs()
+
+
+async def unmount(path):
+    from _pyscript import interpreter
+
+    await sync(path)
+    interpreter._module.FS.unmount(path)

core/src/stdlib/pyscript/magic_js.py

@@ -10,6 +10,9 @@ RUNNING_IN_WORKER = not hasattr(globalThis, "document")
 
 config = json.loads(globalThis.JSON.stringify(_config))
 
+if isinstance(config, str):
+    config = {}
+
 if "MicroPython" in sys.version:
     config["type"] = "mpy"
 else:
@@ -25,6 +28,7 @@ class JSModule:
         # avoid pyodide looking for non existent fields
         if not field.startswith("_"):
             return getattr(getattr(js_modules, self.name), field)
+        return None
 
 
 # generate N modules in the system that will proxy the real value
@@ -66,7 +70,11 @@ if RUNNING_IN_WORKER:
 
 else:
     import _pyscript
-    from _pyscript import PyWorker, js_import
+    from _pyscript import PyWorker as _PyWorker, js_import
+    from pyscript.ffi import to_js
+
+    def PyWorker(url, **kw):
+        return _PyWorker(url, to_js(kw))
 
     window = globalThis
     document = globalThis.document

core/src/stdlib/pyscript/media.py

@@ -31,26 +31,22 @@ class Device:
 
     @classmethod
     async def load(cls, audio=False, video=True):
-        """Load the device stream."""
-        options = window.Object.new()
-        options.audio = audio
+        """
+        Load the device stream.
+        """
+        options = {}
+        options["audio"] = audio
         if isinstance(video, bool):
-            options.video = video
+            options["video"] = video
         else:
-            # TODO: Think this can be simplified but need to check it on the pyodide side
-
-            # TODO: this is pyodide specific. shouldn't be!
-            options.video = window.Object.new()
+            options["video"] = {}
             for k in video:
-                setattr(options.video, k, to_js(video[k]))
-
-        stream = await window.navigator.mediaDevices.getUserMedia(options)
-        return stream
+                options["video"][k] = video[k]
+        return await window.navigator.mediaDevices.getUserMedia(to_js(options))
 
     async def get_stream(self):
         key = self.kind.replace("input", "").replace("output", "")
         options = {key: {"deviceId": {"exact": self.id}}}
-
         return await self.load(**options)
 
 

core/src/stdlib/pyscript/storage.py

@@ -1,19 +1,21 @@
 from polyscript import storage as _storage
 from pyscript.flatted import parse as _parse
 from pyscript.flatted import stringify as _stringify
+from pyscript.ffi import is_none
 
 
 # convert a Python value into an IndexedDB compatible entry
 def _to_idb(value):
-    if value is None:
+    if is_none(value):
         return _stringify(["null", 0])
     if isinstance(value, (bool, float, int, str, list, dict, tuple)):
         return _stringify(["generic", value])
     if isinstance(value, bytearray):
-        return _stringify(["bytearray", [v for v in value]])
+        return _stringify(["bytearray", list(value)])
     if isinstance(value, memoryview):
-        return _stringify(["memoryview", [v for v in value]])
-    raise TypeError(f"Unexpected value: {value}")
+        return _stringify(["memoryview", list(value)])
+    msg = f"Unexpected value: {value}"
+    raise TypeError(msg)
 
 
 # convert an IndexedDB compatible entry into a Python value
@@ -56,5 +58,6 @@ class Storage(dict):
 
 async def storage(name="", storage_class=Storage):
     if not name:
-        raise ValueError("The storage name must be defined")
+        msg = "The storage name must be defined"
+        raise ValueError(msg)
     return storage_class(await _storage(f"@pyscript/{name}"))

core/src/stdlib/pyscript/util.py

@@ -11,7 +11,7 @@ def as_bytearray(buffer):
     ui8a = js.Uint8Array.new(buffer)
     size = ui8a.length
     ba = bytearray(size)
-    for i in range(0, size):
+    for i in range(size):
         ba[i] = ui8a[i]
     return ba
 

core/src/stdlib/pyscript/web.py

@@ -2,8 +2,11 @@
 
 # `when` is not used in this module. It is imported here save the user an additional
 # import (i.e. they can get what they need from `pyscript.web`).
-from pyscript import document, when, Event  # NOQA
-from pyscript.ffi import create_proxy
+
+# from __future__ import annotations  # CAUTION: This is not supported in MicroPython.
+
+from pyscript import document, when, Event  # noqa: F401
+from pyscript.ffi import create_proxy, is_none
 
 
 def wrap_dom_element(dom_element):
@@ -65,8 +68,10 @@ class Element:
         If `dom_element` is None we are being called to *create* a new element.
         Otherwise, we are being called to *wrap* an existing DOM element.
         """
-        self._dom_element = dom_element or document.createElement(
-            type(self).get_tag_name()
+        self._dom_element = (
+            document.createElement(type(self).get_tag_name())
+            if is_none(dom_element)
+            else dom_element
         )
 
         # HTML on_events attached to the element become pyscript.Event instances.
@@ -100,7 +105,7 @@ class Element:
         If `key` is an integer or a slice we use it to index/slice the element's
         children. Otherwise, we use `key` as a query selector.
         """
-        if isinstance(key, int) or isinstance(key, slice):
+        if isinstance(key, (int, slice)):
             return self.children[key]
 
         return self.find(key)
@@ -120,7 +125,12 @@ class Element:
         # attribute `for` which is a Python keyword, so you can access it on the
         # Element instance via `for_`).
         if name.endswith("_"):
-            name = name[:-1]
+            name = name[:-1]  # noqa: FURB188 No str.removesuffix() in MicroPython.
+        if name == "for":
+            # The `for` attribute is a special case as it is a keyword in both
+            # Python and JavaScript.
+            # We need to get it from the underlying DOM element as `htmlFor`.
+            name = "htmlFor"
         return getattr(self._dom_element, name)
 
     def __setattr__(self, name, value):
@@ -138,7 +148,12 @@ class Element:
             # attribute `for` which is a Python keyword, so you can access it on the
             # Element instance via `for_`).
             if name.endswith("_"):
-                name = name[:-1]
+                name = name[:-1]  # noqa: FURB188 No str.removesuffix() in MicroPython.
+            if name == "for":
+                # The `for` attribute is a special case as it is a keyword in both
+                # Python and JavaScript.
+                # We need to set it on the underlying DOM element as `htmlFor`.
+                name = "htmlFor"
 
             if name.startswith("on_"):
                 # Ensure on-events are cached in the _on_events dict if the
@@ -152,10 +167,12 @@ class Element:
         Get an `Event` instance for the specified event name.
         """
         if not name.startswith("on_"):
-            raise ValueError("Event names must start with 'on_'.")
+            msg = "Event names must start with 'on_'."
+            raise ValueError(msg)
         event_name = name[3:]  # Remove the "on_" prefix.
         if not hasattr(self._dom_element, event_name):
-            raise ValueError(f"Element has no '{event_name}' event.")
+            msg = f"Element has no '{event_name}' event."
+            raise ValueError(msg)
         if name in self._on_events:
             return self._on_events[name]
         # Such an on-event exists in the DOM element, but we haven't yet
@@ -180,7 +197,7 @@ class Element:
     @property
     def parent(self):
         """Return the element's `parent `Element`."""
-        if self._dom_element.parentElement is None:
+        if is_none(self._dom_element.parentElement):
             return None
 
         return Element.wrap_dom_element(self._dom_element.parentElement)
@@ -203,7 +220,7 @@ class Element:
             # We check for list/tuple here and NOT for any iterable as it will match
             # a JS Nodelist which is handled explicitly below.
             # NodeList.
-            elif isinstance(item, list) or isinstance(item, tuple):
+            elif isinstance(item, (list, tuple)):
                 for child in item:
                     self.append(child)
 
@@ -227,10 +244,11 @@ class Element:
 
                     except AttributeError:
                         # Nope! This is not an element or a NodeList.
-                        raise TypeError(
+                        msg = (
                             f'Element "{item}" is a proxy object, "'
                             f"but not a valid element or a NodeList."
                         )
+                        raise TypeError(msg)
 
     def clone(self, clone_id=None):
         """Make a clone of the element (clones the underlying DOM object too)."""
@@ -401,9 +419,8 @@ class Options:
 
         new_option = option(**kwargs)
 
-        if before:
-            if isinstance(before, Element):
-                before = before._dom_element
+        if before and isinstance(before, Element):
+            before = before._dom_element
 
         self._element._dom_element.add(new_option._dom_element, before)
 
@@ -463,7 +480,7 @@ class ContainerElement(Element):
         )
 
         for child in list(args) + (children or []):
-            if isinstance(child, Element) or isinstance(child, ElementCollection):
+            if isinstance(child, (Element, ElementCollection)):
                 self.append(child)
 
             else:
@@ -493,14 +510,13 @@ class ClassesCollection:
         )
 
     def __iter__(self):
-        for class_name in self._all_class_names():
-            yield class_name
+        yield from self._all_class_names()
 
     def __len__(self):
         return len(self._all_class_names())
 
     def __repr__(self):
-        return f"ClassesCollection({repr(self._collection)})"
+        return f"ClassesCollection({self._collection!r})"
 
     def __str__(self):
         return " ".join(self._all_class_names())
@@ -553,7 +569,7 @@ class StyleCollection:
             element.style[key] = value
 
     def __repr__(self):
-        return f"StyleCollection({repr(self._collection)})"
+        return f"StyleCollection({self._collection!r})"
 
     def remove(self, key):
         """Remove a CSS property from the elements in the collection."""
@@ -588,7 +604,7 @@ class ElementCollection:
         if isinstance(key, int):
             return self._elements[key]
 
-        elif isinstance(key, slice):
+        if isinstance(key, slice):
             return ElementCollection(self._elements[key])
 
         return self.find(key)
@@ -1120,12 +1136,13 @@ class video(ContainerElement):
         width = width if width is not None else self.videoWidth
         height = height if height is not None else self.videoHeight
 
-        if to is None:
+        if is_none(to):
             to = canvas(width=width, height=height)
 
         elif isinstance(to, Element):
             if to.tag != "canvas":
-                raise TypeError("Element to snap to must be a canvas.")
+                msg = "Element to snap to must be a canvas."
+                raise TypeError(msg)
 
         elif getattr(to, "tagName", "") == "CANVAS":
             to = canvas(dom_element=to)
@@ -1134,10 +1151,12 @@ class video(ContainerElement):
         elif isinstance(to, str):
             nodelist = document.querySelectorAll(to)  # NOQA
             if nodelist.length == 0:
-                raise TypeError("No element with selector {to} to snap to.")
+                msg = "No element with selector {to} to snap to."
+                raise TypeError(msg)
 
             if nodelist[0].tagName != "CANVAS":
-                raise TypeError("Element to snap to must be a canvas.")
+                msg = "Element to snap to must be a canvas."
+                raise TypeError(msg)
 
             to = canvas(dom_element=nodelist[0])
 

core/src/stdlib/pyscript/websocket.py

@@ -1,6 +1,6 @@
 import js
 from pyscript.ffi import create_proxy
-from pyscript.util import as_bytearray
+from pyscript.util import as_bytearray, is_awaitable
 
 code = "code"
 protocols = "protocols"
@@ -8,6 +8,23 @@ reason = "reason"
 methods = ["onclose", "onerror", "onmessage", "onopen"]
 
 
+def add_listener(socket, onevent, listener):
+    p = create_proxy(listener)
+
+    if is_awaitable(listener):
+
+        async def wrapper(e):
+            await p(EventMessage(e))
+
+        m = wrapper
+
+    else:
+        m = lambda e: p(EventMessage(e))
+
+    # Pyodide fails at setting socket[onevent] directly
+    setattr(socket, onevent, m)
+
+
 class EventMessage:
     def __init__(self, event):
         self._event = event
@@ -24,7 +41,7 @@ class EventMessage:
         return value
 
 
-class WebSocket(object):
+class WebSocket:
     CONNECTING = 0
     OPEN = 1
     CLOSING = 2
@@ -36,20 +53,20 @@ class WebSocket(object):
             socket = js.WebSocket.new(url, kw[protocols])
         else:
             socket = js.WebSocket.new(url)
+
+        socket.binaryType = "arraybuffer"
         object.__setattr__(self, "_ws", socket)
 
         for t in methods:
             if t in kw:
-                # Pyodide fails at setting socket[t] directly
-                setattr(socket, t, create_proxy(kw[t]))
+                add_listener(socket, t, kw[t])
 
     def __getattr__(self, attr):
         return getattr(self._ws, attr)
 
     def __setattr__(self, attr, value):
         if attr in methods:
-            m = lambda e: value(EventMessage(e))
-            setattr(self._ws, attr, create_proxy(m))
+            add_listener(self._ws, attr, value)
         else:
             setattr(self._ws, attr, value)
 

core/src/stdlib/pyscript/workers.py

@@ -25,10 +25,12 @@ async def create_named_worker(src="", name="", config=None, type="py"):
     from json import dumps
 
     if not src:
-        raise ValueError("Named workers require src")
+        msg = "Named workers require src"
+        raise ValueError(msg)
 
     if not name:
-        raise ValueError("Named workers require a name")
+        msg = "Named workers require a name"
+        raise ValueError(msg)
 
     s = _js.document.createElement("script")
     s.type = type
@@ -37,7 +39,7 @@ async def create_named_worker(src="", name="", config=None, type="py"):
     _set(s, "name", name)
 
     if config:
-        _set(s, "config", isinstance(config, str) and config or dumps(config))
+        _set(s, "config", (isinstance(config, str) and config) or dumps(config))
 
     _js.document.body.append(s)
     return await workers[name]

core/src/storage.js

@@ -1,14 +1,14 @@
-import { ArrayBuffer, TypedArray } from "sabayon/shared";
 import IDBMapSync from "@webreflection/idb-map/sync";
 import { parse, stringify } from "flatted";
 
+const { isView } = ArrayBuffer;
+
 const to_idb = (value) => {
     if (value == null) return stringify(["null", 0]);
     /* eslint-disable no-fallthrough */
     switch (typeof value) {
         case "object": {
-            if (value instanceof TypedArray)
-                return stringify(["memoryview", [...value]]);
+            if (isView(value)) return stringify(["memoryview", [...value]]);
             if (value instanceof ArrayBuffer)
                 return stringify(["bytearray", [...new Uint8Array(value)]]);
         }

core/src/sync.js

@@ -1,3 +1,5 @@
+import { idb, getFileSystemDirectoryHandle } from "./fs.js";
+
 export default {
     // allow pyterminal checks to bootstrap
     is_pyterminal: () => false,
@@ -9,4 +11,34 @@ export default {
     sleep(seconds) {
         return new Promise(($) => setTimeout($, seconds * 1000));
     },
+
+    getFSHandler: (options) => getFileSystemDirectoryHandle(options),
+
+    /**
+     * Ask a user action via dialog and returns the directory handler once granted.
+     * @param {string} uid
+     * @param {{id?:string, mode?:"read"|"readwrite", hint?:"desktop"|"documents"|"downloads"|"music"|"pictures"|"videos"}} options
+     * @returns {Promise<boolean>}
+     */
+    async storeFSHandler(uid, options = {}) {
+        if (await idb.has(uid)) return true;
+        return getFileSystemDirectoryHandle(options).then(
+            async (handler) => {
+                await idb.set(uid, { handler, options });
+                return true;
+            },
+            () => false,
+        );
+    },
+
+    /**
+     * Explicitly remove the unique identifier for the FS handler.
+     * @param {string} uid
+     * @returns {Promise<boolean>}
+     */
+    async deleteFSHandler(uid) {
+        const had = await idb.has(uid);
+        if (had) await idb.delete(uid);
+        return had;
+    },
 };

core/src/zero-redirect.js

@@ -0,0 +1,7 @@
+/* eslint no-unused-vars: 0 */
+try {
+    crypto.randomUUID();
+} catch (_) {
+    if (location.href.startsWith("http://0.0.0.0"))
+        location.href = location.href.replace("0.0.0.0", "localhost");
+}

core/tests/javascript/config-parser/file.py

@@ -0,0 +1 @@
+print("OK")

core/tests/javascript/config-parser/index.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">
+  <link rel="stylesheet" href="../../../dist/core.css">
+  <script type="module" src="../../../dist/core.js"></script>
+</head>
+<body>
+  <py-config config-parser="https://esm.run/basic-toml">
+    [files]
+    'file.py' = ""
+  </py-config>
+  <script type="py">
+    import file
+    from pyscript import document
+    document.documentElement.classList.add("done")
+    document.body.append("OK")
+  </script>
+</body>
+</html>

core/tests/javascript/media.html

@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Pyodide Media Module Test</title>
+  <link rel="stylesheet" href="../../dist/core.css">
+  <script type="module" src="../../dist/core.js"></script>
+</head>
+<body>
+<h1>Pyodide Media Module Test</h1>
+<div id="test-results">Running tests...</div>
+
+<script type="py" terminal>
+  from pyscript import window, document
+  from pyscript import media
+
+  async def run_tests():
+      # Test basic module structure
+      assert hasattr(media, "Device"), "media module should have Device class"
+      assert hasattr(media, "list_devices"), "media module should have list_devices function"
+
+      # Test device enumeration
+      devices = await media.list_devices()
+      assert isinstance(devices, list), "list_devices should return a list"
+
+      # If we have devices, test properties of one
+      if devices:
+          device = devices[0]
+          assert hasattr(device, "id"), "Device should have id property"
+          assert hasattr(device, "group"), "Device should have group property"
+          assert hasattr(device, "kind"), "Device should have kind property"
+          assert hasattr(device, "label"), "Device should have label property"
+
+      document.getElementById('test-results').innerText = "Success!"
+      document.documentElement.classList.add('media-ok')
+
+  await run_tests()
+</script>
+</body>
+</html>

core/tests/javascript/pyodide-cache/index.py

@@ -1,6 +1,6 @@
-import numpy
-import matplotlib
+import numpy as np
+import matplotlib as mpl
 
 # just do something with the packages
-print(len(dir(numpy)))
-print(len(dir(matplotlib)))
+print(len(dir(np)))
+print(len(dir(mpl)))

core/tests/javascript/terminal.py

@@ -2,7 +2,7 @@ from pyscript import document
 
 classList = document.documentElement.classList
 
-if not __terminal__:
+if not __terminal__:  # noqa: F821  __terminal__ is defined in core/src/plugins/donkey.js
     classList.add("error")
 else:
     classList.add("ok")

core/tests/javascript/worker-config/config.json

@@ -0,0 +1,3 @@
+{
+  "packages": ["numpy"]
+}

core/tests/javascript/worker-config/index.html

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="../../../dist/core.css">
+  <script type="module" src="../../../dist/core.js"></script>
+</head>
+<body>
+  <script type="mpy">
+    from pyscript import PyWorker
+    worker = PyWorker("./worker.py", type="pyodide", config="./config.json")
+    await worker.ready
+  </script>
+</body>
+</html>

core/tests/javascript/worker-config/worker.py

@@ -0,0 +1,5 @@
+import numpy
+from pyscript import document
+
+document.body.append(numpy.__version__)
+document.documentElement.classList.add("done")

core/tests/javascript/worker-symbols.html

@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>PyScript VS Symbols</title>
+  <script>
+    globalThis.hasSymbol = (symbol, ref) => symbol in ref;
+    globalThis.getSymbol = (symbol, ref) => ref[symbol];
+
+    // some 3rd party JS library might use symbols to brand-check
+    // so it's not about symbols traveling from MicroPython
+    // it's about MicroPython proxies traps not understanding symbols
+    globalThis.hasIterator = ref => Symbol.iterator in ref;
+  </script>
+  <link rel="stylesheet" href="../../dist/core.css">
+  <script type="module" src="../../dist/core.js"></script>
+  <script type="mpy">
+    import js
+
+    symbol = js.Symbol.iterator
+
+    if js.getSymbol(symbol, []) and js.hasSymbol(symbol, []) and js.hasIterator([]):
+      js.document.documentElement.classList.add("main")
+  </script>
+  <script type="mpy" worker>
+    from pyscript import window
+    import js
+
+    symbol = js.Symbol.iterator
+
+    if window.getSymbol(symbol, []) and window.hasSymbol(symbol, []) and window.hasIterator([]):
+      window.document.documentElement.classList.add("worker")
+  </script>
+</head>
+</html>

core/tests/javascript/workers/worker.py

@@ -4,4 +4,4 @@ def runtime_version():
     return sys.version
 
 
-__export__ = ['runtime_version']
+__export__ = ["runtime_version"]

core/tests/javascript/ws/index.html

@@ -14,7 +14,7 @@
         print(event.type)
         ws.send("hello")
 
-    def onmessage(event):
+    async def onmessage(event):
         print(event.type, event.data)
         ws.close()
 

core/tests/js_tests.spec.js

@@ -2,6 +2,18 @@ import { test, expect } from '@playwright/test';
 
 test.setTimeout(120 * 1000);
 
+test('Worker config as relative URL', async ({ page }) => {
+  await page.goto('http://localhost:8080/tests/javascript/worker-config/index.html');
+  await page.waitForSelector('html.done');
+});
+
+test('config-parser custom TOML', async ({ page }) => {
+  await page.goto('http://localhost:8080/tests/javascript/config-parser/index.html');
+  await page.waitForSelector('html.done');
+  const body = await page.evaluate(() => document.body.innerText);
+  await expect(body.trim()).toBe('OK');
+});
+
 test('MicroPython display', async ({ page }) => {
   await page.goto('http://localhost:8080/tests/javascript/mpy.html');
   await page.waitForSelector('html.done.worker');
@@ -59,6 +71,11 @@ test('MicroPython + configURL', async ({ page }) => {
   await page.waitForSelector('html.main.worker');
 });
 
+test('MicroPython + Symbols', async ({ page }) => {
+  await page.goto('http://localhost:8080/tests/javascript/worker-symbols.html');
+  await page.waitForSelector('html.main.worker');
+});
+
 test('Pyodide + terminal on Main', async ({ page }) => {
   await page.goto('http://localhost:8080/tests/javascript/py-terminal-main.html');
   await page.waitForSelector('html.ok');
@@ -171,3 +188,24 @@ test('MicroPython buffered NO error', async ({ page }) => {
   const body = await page.evaluate(() => document.body.textContent.trim());
   await expect(body).toBe('');
 });
+
+test('Pyodide media module', async ({ page }) => {
+  await page.context().grantPermissions(['camera', 'microphone']);
+  await page.context().addInitScript(() => {
+    const originalEnumerateDevices = navigator.mediaDevices.enumerateDevices;
+    navigator.mediaDevices.enumerateDevices = async function() {
+      const realDevices = await originalEnumerateDevices.call(this);
+      if (!realDevices || realDevices.length === 0) {
+        return [
+          { deviceId: 'camera1', groupId: 'group1', kind: 'videoinput', label: 'Simulated Camera' },
+          { deviceId: 'mic1', groupId: 'group2', kind: 'audioinput', label: 'Simulated Microphone' }
+        ];
+      }
+      return realDevices;
+    };
+  });
+  await page.goto('http://localhost:8080/tests/javascript/media.html');
+  await page.waitForSelector('html.media-ok', { timeout: 10000 });
+  const isSuccess = await page.evaluate(() => document.documentElement.classList.contains('media-ok'));
+  expect(isSuccess).toBe(true);
+});

core/tests/manual/ffi_timeout/index.html

@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+  <head>
+      <meta charset="utf-8">
+      <meta name="viewport" content="width=device-width,initial-scale=1">
+      <link rel="stylesheet" href="../../../dist/core.css">
+      <script>
+        window.Worker = class extends Worker {
+          constructor(url, ...rest) {
+            console.log(rest[0]);
+            return super(url, ...rest);
+          }
+        };
+        window.start = Date.now();
+      </script>
+      <script type="module" src="../../../dist/core.js"></script>
+  </head>
+  <body>
+    <script type="py" config="./index.toml" src="index.py" worker></script>
+  </body>
+</html>

core/tests/manual/ffi_timeout/index.py

@@ -0,0 +1,3 @@
+from pyscript import document, window
+
+document.body.append(window.Date.now() - window.start)

core/tests/manual/ffi_timeout/index.toml

@@ -0,0 +1,2 @@
+experimental_ffi_timeout = 0
+package_cache = "passthrough"

core/tests/manual/fs/index.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+      <meta charset="utf-8">
+      <meta name="viewport" content="width=device-width,initial-scale=1">
+      <link rel="stylesheet" href="../../../dist/core.css">
+      <script type="module" src="../../../dist/core.js"></script>
+  </head>
+  <body>
+    <script type="mpy" src="index.py"></script>
+  </body>
+</html>

core/tests/manual/fs/index.py

@@ -0,0 +1,48 @@
+import os
+from pyscript import RUNNING_IN_WORKER, fs
+
+
+TEST = "implicit"
+
+if TEST == "implicit":
+    await fs.mount("/persistent")
+
+    print(
+        (RUNNING_IN_WORKER and "Worker") or "Main",
+        os.listdir("/persistent"),
+    )
+
+    from random import random
+
+    with open("/persistent/random.txt", "w") as f:
+        f.write(str(random()))
+
+    await fs.sync("/persistent")
+
+    # await fs.revoke("/persistent")
+
+elif not RUNNING_IN_WORKER:
+    from pyscript import document
+
+    button = document.createElement("button")
+    button.textContent = "mount"
+    document.body.append(button)
+
+    async def mount(event):
+        try:
+            await fs.mount("/persistent")
+            print(os.listdir("/persistent"))
+            button.textContent = "unmount"
+            button.onclick = unmount
+
+        except:
+            import js
+
+            js.alert("unable to grant access")
+
+    async def unmount(event):
+        await fs.revoke("/persistent")
+        button.textContent = "mount"
+        button.onclick = mount
+
+    button.onclick = mount

core/tests/manual/game/aliens.css

@@ -0,0 +1,30 @@
+/* (c) https://github.com/ryanking13/pyodide-pygame-demo/blob/main/examples/aliens.html */
+body {
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    margin: 0;
+    padding: 20px;
+    background-color: #f4f4f4;
+    color: #333;
+}
+.demo {
+    background-color: #fff;
+    margin: 20px auto;
+    max-width: 1000px;
+    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+    border-radius: 8px;
+    overflow: hidden;
+}
+.demo-header {
+    background-color: #007bff;
+    color: #fff;
+    padding: 15px 20px;
+    font-size: 20px;
+}
+.demo-content {
+    padding: 20px;
+}
+
+#canvas {
+    margin: 0 auto;
+    display: block;
+}

core/tests/manual/game/aliens.py

@@ -0,0 +1,395 @@
+"""(c) https://github.com/ryanking13/pyodide-pygame-demo/blob/main/examples/aliens.html
+pygame.examples.aliens
+
+Shows a mini game where you have to defend against aliens.
+
+What does it show you about pygame?
+
+* pygame.sprite, the difference between Sprite and Group.
+* dirty rectangle optimization for processing for speed.
+* music with pygame.mixer.music, including fadeout
+* sound effects with pygame.Sound
+* event processing, keyboard handling, QUIT handling.
+* a main loop frame limited with a game clock from the pygame.time module
+* fullscreen switching.
+
+
+Controls
+--------
+
+* Left and right arrows to move.
+* Space bar to shoot.
+* f key to toggle between fullscreen.
+
+"""
+
+import asyncio
+import random
+import os
+import pathlib
+
+import pyscript
+
+# import basic pygame modules
+import pygame
+
+# see if we can load more than standard BMP
+if not pygame.image.get_extended():
+    msg = "Sorry, extended image module required"
+    raise SystemExit(msg)
+
+
+# game constants
+MAX_SHOTS = 2  # most player bullets onscreen
+ALIEN_ODDS = 22  # chances a new alien appears
+BOMB_ODDS = 60  # chances a new bomb will drop
+ALIEN_RELOAD = 12  # frames between new aliens
+SCREENRECT = pygame.Rect(0, 0, 640, 480)
+SCORE = 0
+
+
+main_dir = str(pathlib.Path(pygame.__file__).parent / "examples")
+
+
+def load_image(file):
+    """loads an image, prepares it for play"""
+    file = os.path.join(main_dir, "data", file)
+    try:
+        surface = pygame.image.load(file)
+    except pygame.error:
+        msg = f'Could not load image "{file}" {pygame.get_error()}'
+        raise SystemExit(msg)
+    return surface.convert()
+
+
+def load_sound(file):
+    """because pygame can be be compiled without mixer."""
+    if not pygame.mixer:
+        return None
+    file = os.path.join(main_dir, "data", file)
+    try:
+        return pygame.mixer.Sound(file)
+    except pygame.error:
+        print(f"Warning, unable to load, {file}")
+    return None
+
+
+# Each type of game object gets an init and an update function.
+# The update function is called once per frame, and it is when each object should
+# change its current position and state.
+#
+# The Player object actually gets a "move" function instead of update,
+# since it is passed extra information about the keyboard.
+
+
+class Player(pygame.sprite.Sprite):
+    """Representing the player as a moon buggy type car."""
+
+    speed = 10
+    bounce = 24
+    gun_offset = -11
+    images = []
+
+    def __init__(self):
+        pygame.sprite.Sprite.__init__(self, self.containers)
+        self.image = self.images[0]
+        self.rect = self.image.get_rect(midbottom=SCREENRECT.midbottom)
+        self.reloading = False
+        self.origtop = self.rect.top
+        self.facing = -1
+
+    def move(self, direction):
+        if direction:
+            self.facing = direction
+        self.rect.move_ip(direction * self.speed, 0)
+        self.rect = self.rect.clamp(SCREENRECT)
+        if direction < 0:
+            self.image = self.images[0]
+        elif direction > 0:
+            self.image = self.images[1]
+        self.rect.top = self.origtop - (self.rect.left // self.bounce % 2)
+
+    def gunpos(self):
+        pos = self.facing * self.gun_offset + self.rect.centerx
+        return pos, self.rect.top
+
+
+class Alien(pygame.sprite.Sprite):
+    """An alien space ship. That slowly moves down the screen."""
+
+    speed = 13
+    animcycle = 12
+    images = []
+
+    def __init__(self):
+        pygame.sprite.Sprite.__init__(self, self.containers)
+        self.image = self.images[0]
+        self.rect = self.image.get_rect()
+        self.facing = random.choice((-1, 1)) * Alien.speed
+        self.frame = 0
+        if self.facing < 0:
+            self.rect.right = SCREENRECT.right
+
+    def update(self):
+        self.rect.move_ip(self.facing, 0)
+        if not SCREENRECT.contains(self.rect):
+            self.facing = -self.facing
+            self.rect.top = self.rect.bottom + 1
+            self.rect = self.rect.clamp(SCREENRECT)
+        self.frame = self.frame + 1
+        self.image = self.images[self.frame // self.animcycle % 3]
+
+
+class Explosion(pygame.sprite.Sprite):
+    """An explosion. Hopefully the Alien and not the player!"""
+
+    defaultlife = 12
+    animcycle = 3
+    images = []
+
+    def __init__(self, actor):
+        pygame.sprite.Sprite.__init__(self, self.containers)
+        self.image = self.images[0]
+        self.rect = self.image.get_rect(center=actor.rect.center)
+        self.life = self.defaultlife
+
+    def update(self):
+        """called every time around the game loop.
+
+        Show the explosion surface for 'defaultlife'.
+        Every game tick(update), we decrease the 'life'.
+
+        Also we animate the explosion.
+        """
+        self.life = self.life - 1
+        self.image = self.images[self.life // self.animcycle % 2]
+        if self.life <= 0:
+            self.kill()
+
+
+class Shot(pygame.sprite.Sprite):
+    """a bullet the Player sprite fires."""
+
+    speed = -11
+    images = []
+
+    def __init__(self, pos):
+        pygame.sprite.Sprite.__init__(self, self.containers)
+        self.image = self.images[0]
+        self.rect = self.image.get_rect(midbottom=pos)
+
+    def update(self):
+        """called every time around the game loop.
+
+        Every tick we move the shot upwards.
+        """
+        self.rect.move_ip(0, self.speed)
+        if self.rect.top <= 0:
+            self.kill()
+
+
+class Bomb(pygame.sprite.Sprite):
+    """A bomb the aliens drop."""
+
+    speed = 9
+    images = []
+
+    def __init__(self, alien):
+        pygame.sprite.Sprite.__init__(self, self.containers)
+        self.image = self.images[0]
+        self.rect = self.image.get_rect(midbottom=alien.rect.move(0, 5).midbottom)
+
+    def update(self):
+        """called every time around the game loop.
+
+        Every frame we move the sprite 'rect' down.
+        When it reaches the bottom we:
+
+        - make an explosion.
+        - remove the Bomb.
+        """
+        self.rect.move_ip(0, self.speed)
+        if self.rect.bottom >= 470:
+            Explosion(self)
+            self.kill()
+
+
+class Score(pygame.sprite.Sprite):
+    """to keep track of the score."""
+
+    def __init__(self):
+        pygame.sprite.Sprite.__init__(self)
+        self.font = pygame.Font(None, 20)
+        self.font.set_italic(1)
+        self.color = "white"
+        self.lastscore = -1
+        self.update()
+        self.rect = self.image.get_rect().move(10, 450)
+
+    def update(self):
+        """We only update the score in update() when it has changed."""
+        if self.lastscore != SCORE:
+            self.lastscore = SCORE
+            msg = "Score: %d" % SCORE
+            self.image = self.font.render(msg, 0, self.color)
+
+
+async def main(winstyle=0):
+    # Initialize pygame
+    pygame.mixer.pre_init(44100, 32, 2, 1024)
+    pygame.init()
+    if pygame.mixer and not pygame.mixer.get_init():
+        print("Warning, no sound")
+        pygame.mixer = None
+
+    fullscreen = False
+    # Set the display mode
+    winstyle = 0  # |FULLSCREEN
+    screen = pygame.display.set_mode(SCREENRECT.size, winstyle)
+
+    # Load images, assign to sprite classes
+    # (do this before the classes are used, after screen setup)
+    img = load_image("player1.gif")
+    Player.images = [img, pygame.transform.flip(img, 1, 0)]
+    img = load_image("explosion1.gif")
+    Explosion.images = [img, pygame.transform.flip(img, 1, 1)]
+    Alien.images = [load_image(im) for im in ("alien1.gif", "alien2.gif", "alien3.gif")]
+    Bomb.images = [load_image("bomb.gif")]
+    Shot.images = [load_image("shot.gif")]
+
+    # decorate the game window
+    icon = pygame.transform.scale(Alien.images[0], (32, 32))
+    pygame.display.set_icon(icon)
+    pygame.display.set_caption("Pygame Aliens")
+    pygame.mouse.set_visible(0)
+
+    # create the background, tile the bgd image
+    bgdtile = load_image("background.gif")
+    background = pygame.Surface(SCREENRECT.size)
+    for x in range(0, SCREENRECT.width, bgdtile.get_width()):
+        background.blit(bgdtile, (x, 0))
+    screen.blit(background, (0, 0))
+    pygame.display.flip()
+
+    # load the sound effects
+    boom_sound = load_sound("boom.wav")
+    shoot_sound = load_sound("car_door.wav")
+    if pygame.mixer:
+        music = os.path.join(main_dir, "data", "house_lo.wav")
+        pygame.mixer.music.load(music)
+        pygame.mixer.music.play(-1)
+
+    # Initialize Game Groups
+    aliens = pygame.sprite.Group()
+    shots = pygame.sprite.Group()
+    bombs = pygame.sprite.Group()
+    all = pygame.sprite.RenderUpdates()
+    lastalien = pygame.sprite.GroupSingle()
+
+    # assign default groups to each sprite class
+    Player.containers = all
+    Alien.containers = aliens, all, lastalien
+    Shot.containers = shots, all
+    Bomb.containers = bombs, all
+    Explosion.containers = all
+    Score.containers = all
+
+    # Create Some Starting Values
+    global score
+    alienreload = ALIEN_RELOAD
+    _clock = pygame.Clock()
+
+    # initialize our starting sprites
+    global SCORE
+    player = Player()
+    Alien()  # note, this 'lives' because it goes into a sprite group
+    if pygame.font:
+        all.add(Score())
+
+    # Run our main loop whilst the player is alive.
+    while player.alive():
+        # get input
+        for event in pygame.event.get():
+            if event.type == pygame.QUIT:
+                return
+            if event.type == pygame.KEYDOWN and event.key == pygame.K_ESCAPE:
+                return
+            if event.type == pygame.KEYDOWN and event.key == pygame.K_f:
+                if not fullscreen:
+                    print("Changing to FULLSCREEN")
+                    screen_backup = screen.copy()
+                    screen = pygame.display.set_mode(SCREENRECT.size, winstyle | pygame.FULLSCREEN)
+                    screen.blit(screen_backup, (0, 0))
+                else:
+                    print("Changing to windowed mode")
+                    screen_backup = screen.copy()
+                    screen = pygame.display.set_mode(SCREENRECT.size, winstyle)
+                    screen.blit(screen_backup, (0, 0))
+                pygame.display.flip()
+                fullscreen = not fullscreen
+
+        keystate = pygame.key.get_pressed()
+
+        # clear/erase the last drawn sprites
+        all.clear(screen, background)
+
+        # update all the sprites
+        all.update()
+
+        # handle player input
+        direction = keystate[pygame.K_RIGHT] - keystate[pygame.K_LEFT]
+        player.move(direction)
+        firing = keystate[pygame.K_SPACE]
+        if not player.reloading and firing and len(shots) < MAX_SHOTS:
+            Shot(player.gunpos())
+            if pygame.mixer:
+                shoot_sound.play()
+        player.reloading = firing
+
+        # Create new alien
+        if alienreload:
+            alienreload = alienreload - 1
+        elif not int(random.random() * ALIEN_ODDS):
+            Alien()
+            alienreload = ALIEN_RELOAD
+
+        # Drop bombs
+        if lastalien and not int(random.random() * BOMB_ODDS):
+            Bomb(lastalien.sprite)
+
+        # Detect collisions between aliens and players.
+        for alien in pygame.sprite.spritecollide(player, aliens, 1):
+            if pygame.mixer:
+                boom_sound.play()
+            Explosion(alien)
+            Explosion(player)
+            SCORE = SCORE + 1
+            player.kill()
+
+        # See if shots hit the aliens.
+        for alien in pygame.sprite.groupcollide(aliens, shots, 1, 1):
+            if pygame.mixer:
+                boom_sound.play()
+            Explosion(alien)
+            SCORE = SCORE + 1
+
+        # See if alien bombs hit the player.
+        for bomb in pygame.sprite.spritecollide(player, bombs, 1):
+            if pygame.mixer:
+                boom_sound.play()
+            Explosion(player)
+            Explosion(bomb)
+            player.kill()
+
+        # draw the scene
+        dirty = all.draw(screen)
+        pygame.display.update(dirty)
+
+        # cap the framerate at 40fps. Also called 40HZ or 40 times per second.
+        await asyncio.sleep(0.025)
+
+    if pygame.mixer:
+        pygame.mixer.music.fadeout(1000)
+
+
+main()

core/tests/manual/game/index.html

@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+  <head>
+      <meta charset="utf-8">
+      <meta name="viewport" content="width=device-width,initial-scale=1">
+      <link rel="stylesheet" href="aliens.css" />
+      <link rel="stylesheet" href="../../../dist/core.css" />
+      <script type="module" src="../../../dist/core.js"></script>
+  </head>
+  <body>
+      <script type="py-game" src="aliens.py" config="./config.toml"></script>
+      <div class="demo">
+          <div class="demo-header">pygame.examples.aliens</div>
+          <div class="demo-content">
+              <canvas id="canvas"></canvas>
+          </div>
+      </div>
+  </body>
+</html>

core/tests/manual/issue-2302/glue/multipyjs.py

@@ -0,0 +1,20 @@
+from pyscript import config
+
+MICROPYTHON = config["type"] == "mpy"
+
+if MICROPYTHON:
+    def new(obj, *args, **kwargs):
+        return obj.new(*args, kwargs) if kwargs else obj.new(*args)
+    def call(obj, *args, **kwargs):
+        return obj(*args, kwargs) if kwargs else obj(*args)
+else:
+    def new(obj, *args, **kwargs):
+        return obj.new(*args, **kwargs)
+    def call(obj, *args, **kwargs):
+        return obj(*args, **kwargs)
+
+if not MICROPYTHON:
+    import pyodide_js
+    pyodide_js.setDebug(True)
+
+from pyscript.ffi import to_js, create_proxy

core/tests/manual/issue-2302/index.html

@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <title>Genuary</title>
+
+    <!-- Recommended meta tags -->
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
+
+    <!-- PyScript CSS -->
+    <link rel="stylesheet" href="../../../dist/core.css">
+
+    <style>
+        body {
+            margin: 0;
+            overflow: hidden;
+            background-color: #4a315e;
+            color: white;
+            font-family: Inconsolata, Consolas, Monaco, Courier New;
+        }
+
+        .gutter {
+            background-color: #eee;
+            background-repeat: no-repeat;
+            background-position: 50%;
+        }
+
+        .gutter.gutter-vertical {
+            background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFAQMAAABo7865AAAABlBMVEVHcEzMzMzyAv2sAAAAAXRSTlMAQObYZgAAABBJREFUeF5jOAMEEAIEEFwAn3kMwcB6I2AAAAAASUVORK5CYII=');
+            cursor: row-resize;
+        }
+
+        py-terminal {
+            max-height: 7em;
+            max-width: calc(100vw - 90px);
+        }
+
+        #pyterm {
+            background-color: #191a1a;
+        }
+
+        #pyterm,
+        #threejs {
+            position: relative;
+            overflow: hidden;
+        }
+    </style>
+
+    <!-- This script tag bootstraps PyScript -->
+    <script type="importmap">
+    {
+        "imports": {
+            "three": "https://cdn.jsdelivr.net/npm/three@v0.173.0/build/three.module.js"
+        }
+    }
+    </script>
+    <script type="module" src="../../../dist/core.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/split.js/1.6.5/split.min.js"></script>
+</head>
+<body>
+    <div id="stats"></div>
+    <div id="stats-off"></div>
+    <div class="split">
+        <div id="pyterm"></div>
+        <div id="threejs"></div>
+    </div>
+    <script type="py" src="./main.py" config="./pyscript.toml" async terminal></script>
+</body>
+</html>

core/tests/manual/issue-2302/libfft.py

@@ -0,0 +1,83 @@
+from dataclasses import dataclass, field
+import sys
+
+@dataclass
+class BeatSync:
+    fft_res: int = field()
+
+    on_beat: bool = False
+    beat: int = -1
+    since_last_beat: float = sys.maxsize
+
+    _prev: int = 0
+    _count: int = 0
+    _bins: list[int] = field(default_factory=list)
+    _last_detection: float = -1.0
+    _threshold: int = 50
+    _diff: int = 40
+    _cooldown: float = 0.2
+
+    _highest: int = 0
+
+    def __post_init__(self):
+        self._bins = [int(13/16*self.fft_res/2)+17, int(13/16*self.fft_res/2)+18]
+
+    def reset(self):
+        self.beat = -1
+        self._prev = 0
+        self._count = 0
+        self._last_detection = -1.0
+        self.since_last_beat = sys.maxsize
+        # print('bs reset')
+
+    def update(self, data, running_time):
+        self._count += 1
+        self.since_last_beat = running_time - self._last_detection
+        d = sum(data[bin] for bin in self._bins)
+        if d < self._threshold:
+            self.on_beat = False
+        elif d - self._prev < self._diff:
+            self.on_beat = False
+        elif self.since_last_beat < self._cooldown:
+            self.on_beat = False
+        else:
+            self._last_detection = running_time
+            self.since_last_beat = 0
+            self.on_beat = True
+            self.beat += 1
+        self._prev = d
+
+@dataclass
+class FreqIntensity:
+    freq: float = field()
+    fft_res: int = field()
+
+    intensity: float = 0.0
+    intensity_slew: float = 0.0
+    scale_min: float = 0.0
+    scale_max: float = 350
+    max: float = 0.0
+    _sample_rate: int = 48000
+    _bin_indexes: list[int] = field(default_factory=list)
+    _harmonics: int = 8
+    _slew_factor: float = 0.8
+
+    def __post_init__(self):
+        self._bin_indexes = [
+            round((harmonic+1) * self.freq / self._sample_rate * self.fft_res / 2)
+            for harmonic in range(self._harmonics)
+        ]
+        print(self._bin_indexes)
+
+    def update(self, data):
+        intensity = 0.0
+        for bin in range(self._harmonics):
+            intensity += data[self._bin_indexes[bin]]/(bin+1)
+        self.intensity = intensity
+        self.intensity_slew = self._slew_factor * self.intensity_slew + (1 - self._slew_factor) * intensity
+        self.max = max(intensity, self.max)
+
+    @property
+    def intensity_scaled(self):
+        raw = max(0, min(1.0, (self.intensity_slew - self.scale_min)/(self.scale_max - self.scale_min)))
+        return raw * raw

core/tests/manual/issue-2302/libthree.py

@@ -0,0 +1,189 @@
+import asyncio
+from dataclasses import dataclass, field
+from typing import Callable
+
+from pyscript import document, window
+
+from pyscript.js_modules import three as THREE
+from pyscript.js_modules.stats_gl import default as StatsGL
+from pyscript.js_modules import lsgeo, line2, linemat
+
+from multipyjs import MICROPYTHON, new, call, to_js, create_proxy
+
+@dataclass
+class SoundPlayer:
+    sound: THREE.Audio = field()
+    on_start: Callable[[], None] = field()
+    on_stop: Callable[[], None] = field(default=lambda: None)
+
+    _start_time: float = -1.0
+
+    def play(self):
+        self.sound.stop()
+        self.on_start()
+        self._start_time = self.sound.context.currentTime
+        self.sound.play()
+
+    def stop(self):
+        self.sound.stop()
+        self.on_stop()
+        self._start_time = -1.0
+
+    def toggle(self):
+        if self.sound.isPlaying:
+            self.stop()
+        else:
+            self.play()
+
+    @property
+    def running_time(self):
+        if self.sound.isPlaying:
+            return self.sound.context.currentTime - self._start_time
+        elif self._start_time != -1.0:
+            self.stop()
+        return 0.0
+
+def get_renderer():
+    renderer = new(THREE.WebGLRenderer, antialias=True)
+    renderer.setSize(window.innerWidth, window.innerHeight)
+    renderer.setPixelRatio(window.devicePixelRatio)
+    renderer.setClearColor(0xF5F0DC)
+    pyterms = list(document.getElementsByTagName("py-terminal"))
+    if pyterms:
+        pyterm = pyterms[0]
+        pyterm.parentNode.removeChild(pyterm)
+        document.getElementById("pyterm").appendChild(pyterm)
+
+    document.getElementById("threejs").appendChild(renderer.domElement)
+
+    initial = {0: "115px", 1: "calc(100vh - 120px)"}
+    @create_proxy
+    def split_element_style(dimension, size, gutter_size, index):
+        if index in initial:
+            result = {dimension: initial.pop(index)}
+        else:
+            result = {dimension: f"calc({int(size)}vh - {gutter_size}px)"}
+        return to_js(result)
+
+    call(
+        window.Split,
+        ["#pyterm", "#threejs"],
+        direction="vertical",
+        elementStyle=split_element_style,
+        minSize=0,
+        maxSize=to_js([120, 10000]),
+    )
+    return renderer
+
+def get_ortho_camera(view_size):
+    aspect_ratio = window.innerWidth / window.innerHeight
+    camera = new(
+        THREE.OrthographicCamera,
+        -view_size * aspect_ratio,  # Left
+        view_size * aspect_ratio,   # Right
+        view_size,                  # Top
+        -view_size,                 # Bottom
+        -view_size,                 # Near plane
+        view_size,                  # Far plane
+    )
+    camera.updateProjectionMatrix()
+    camera.position.set(0, 0, 0)
+    return camera
+
+def get_loading_manager():
+    loading_mgr = new(THREE.LoadingManager)
+    ev = asyncio.Event()
+
+    @create_proxy
+    def on_start(url, itemsLoaded, itemsTotal):
+        print(f'[{itemsLoaded}/{itemsTotal}] Started loading file: {url}')
+    loading_mgr.onStart = on_start
+
+    @create_proxy
+    def on_progress(url, itemsLoaded, itemsTotal):
+        print(f'[{itemsLoaded}/{itemsTotal}] Loading file: {url}')
+    loading_mgr.onProgress = on_progress
+
+    @create_proxy
+    def on_error(url):
+        print(f'There was a problem loading {url}')
+    loading_mgr.onError = on_error
+
+    @create_proxy
+    def on_load():
+        print('Loading assets complete!')
+        ev.set()
+    loading_mgr.onLoad = on_load
+
+    return loading_mgr, ev
+
+
+def get_perspective_camera():
+    aspect_ratio = window.innerWidth / window.innerHeight
+    camera = new(
+        THREE.PerspectiveCamera,
+        45,             # fov
+        aspect_ratio,
+        0.25,           # near plane
+        300,            # far plane
+    )
+    camera.position.set(0, 0, 30)
+    return camera
+
+def get_stats_gl(renderer):
+    stats = new(StatsGL, trackGPU=True, horizontal=False)
+    stats.init(renderer)
+    stats.dom.style.removeProperty("left")
+    stats.dom.style.right = "90px"
+    document.getElementById("stats").appendChild(stats.dom)
+    return stats
+
+def bg_from_v(*vertices):
+    geometry = new(THREE.BufferGeometry)
+    vertices_f32a = new(Float32Array, vertices)  # noqa: F821 Float32Array is defined in js
+    attr = new(THREE.Float32BufferAttribute, vertices_f32a, 3)
+    return geometry.setAttribute('position', attr)
+
+def bg_from_p(*points):
+    buf = new(THREE.BufferGeometry)
+    buf.setFromPoints(
+        [new(THREE.Vector3, p[0], p[1], p[2]) for p in points]
+    )
+    return buf
+
+def clear():
+    # toggle stats and terminal?
+    stats_style = document.getElementById("stats-off").style
+    if stats_style.display == "none":
+        # turn stuff back on
+        stats_style.removeProperty("display")
+        document.getElementById("pyterm").style.height = "115px"
+        document.getElementById("threejs").style.height = "calc(100vh - 120px)"
+        for e in document.getElementsByClassName("gutter"):
+            e.style.removeProperty("display")
+        for e in document.getElementsByClassName("xterm-helper-textarea"):
+            e.focus()
+            break
+        return
+
+    # no longer focus on xterm
+    document.activeElement.blur()
+    # hide stats
+    document.getElementById("stats-off").style.display = "none"
+    # hide pyterm and split gutter
+    document.getElementById("pyterm").style.height = "0vh"
+    document.getElementById("threejs").style.height = "100vh"
+    for e in document.getElementsByClassName("gutter"):
+        e.style.display = "none"
+    # hide ltk ad
+    for e in document.getElementsByClassName("ltk-built-with"):
+        e.style.display = "none"
+    # hide pyscript ad
+    for e in document.getElementsByTagName("div"):
+        style = e.getAttribute("style")
+        if style and style.startswith("z-index:999"):
+            e.style.display = "none"
+    for e in document.getElementsByTagName("svg"):
+        style = e.getAttribute("style")
+        if style and style.startswith("z-index:999"):
+            e.style.display = "none"

core/tests/manual/issue-2302/main.py

@@ -0,0 +1,285 @@
+print("Starting up...")
+
+from array import array
+import asyncio
+import math
+import time
+
+from pyscript import document, window, PyWorker
+
+from libthree import THREE, clear, SoundPlayer
+from libthree import get_renderer, get_ortho_camera
+from libthree import get_loading_manager, get_stats_gl
+from libthree import line2, linemat, lsgeo
+from libfft import BeatSync
+
+from multipyjs import MICROPYTHON, new, call, to_js, create_proxy
+
+from js import Float32Array
+
+scene = new(THREE.Scene)
+
+view_size = 1
+renderer = get_renderer()
+camera = get_ortho_camera(view_size)
+loading_mgr, loaded_event = get_loading_manager()
+
+t_loader = new(THREE.TextureLoader, loading_mgr)
+t_loader.setPath('assets/')
+
+light = new(THREE.AmbientLight, 0xffffff, 1.0)
+scene.add(light)
+
+fft_res = 2048
+audio_listener = new(THREE.AudioListener)
+camera.add(audio_listener)
+sound = new(THREE.Audio, audio_listener)
+audio_loader = new(THREE.AudioLoader, loading_mgr)
+analyser = new(THREE.AudioAnalyser, sound, fft_res)
+
+@create_proxy
+def on_audio_load(buffer):
+    sound.setBuffer(buffer)
+    sound.setVolume(0.9)
+    sound.setLoop(False)
+
+audio_loader.load("assets/genuary25-18.m4a", on_audio_load)
+
+spheres = new(THREE.Group)
+scene.add(spheres)
+
+line_basic_mat = new(
+    THREE.LineBasicMaterial,
+    color=0xffffff,
+)
+
+zero_mat = new(
+    linemat.LineMaterial,
+    color=0x662503,
+    linewidth=3,
+)
+
+other_mat = new(
+    linemat.LineMaterial,
+    color=0x662503,
+    linewidth=1.5,
+)
+
+grid_mat = new(
+    linemat.LineMaterial,
+    color=0x662503,
+    linewidth=1,
+    dashed=True,
+    dashScale=1,
+    dashSize=0.5,
+    gapSize=1,
+    dashOffset=0,
+)
+
+lines = [new(THREE.Group), new(THREE.Group)]
+scene.add(lines[0])
+scene.add(lines[1])
+
+def draw_lines(line_coords, mat_name, spy=False):
+    if spy:
+        line_coords_f32a = new(Float32Array, line_coords.length)
+        _it = line_coords.items
+        for i in range(line_coords.length):
+            line_coords_f32a[i] = _it[i]
+    else:
+        line_coords_f32a = new(Float32Array, line_coords)
+    if mat_name == 'zero':
+        mat = zero_mat
+    elif mat_name == 'grid':
+        mat = grid_mat
+    else:
+        mat = other_mat
+
+    geo = new(THREE.BufferGeometry)
+    geo.setAttribute('position', new(THREE.BufferAttribute, line_coords_f32a, 3))
+    seg = new(THREE.LineSegments, geo, line_basic_mat)
+
+    lsg = new(lsgeo.LineSegmentsGeometry)
+    lsg.fromLineSegments(seg)
+    l1 = new(line2.Line2, lsg, mat)
+    l1.computeLineDistances()
+    l2 = new(line2.Line2, lsg, mat)
+    l2.computeLineDistances()
+    lines[0].add(l1)
+    lines[1].add(l2)
+
+    seg.geometry.dispose()
+    del geo
+    del seg
+
+def drawing_done():
+    maybe_with_spy = "with SPy" if USE_SPY else "with pure Python"
+    print(f"Time elapsed computing {maybe_with_spy}:", time.time() - start_ts)
+    drawing_event.set()
+
+grid_width = 0
+grid_height = 0
+scroll_offset = 0
+def scale_lines(grid_ws=None, grid_hs=None, offset=None):
+    global grid_width, grid_height, scroll_offset
+
+    if grid_ws:
+        grid_width = grid_ws
+    else:
+        grid_ws = grid_width
+
+    if grid_hs:
+        grid_height = grid_hs
+    else:
+        grid_hs = grid_height
+
+    if offset:
+        scroll_offset = offset
+    else:
+        offset = scroll_offset
+
+    scale = 2.04/grid_hs
+    lines[0].scale.set(scale, scale, scale)
+    lines[1].scale.set(scale, scale, scale)
+    lines[0].position.set((offset - grid_ws/2) * scale, -grid_hs/2 * scale, 0)
+    lines[1].position.set((offset + grid_ws/2) * scale, -grid_hs/2 * scale, 0)
+
+def append_p(lines, p1, p2):
+    lines.append(p1[0])
+    lines.append(p1[1])
+    lines.append(0)
+    lines.append(p2[0])
+    lines.append(p2[1])
+    lines.append(0)
+
+def initial_calc():
+    grid_w = int(1920 * 4)
+    grid_h = 1080 * 2
+    grid_scale = 10
+    noise_factor = 500
+    grid_hs = int(grid_h/grid_scale)
+    grid_ws = int(grid_w/grid_scale)
+    crossfade_range = int(grid_ws/12.5)
+
+    def grid_lines():
+        lines = array("d")
+        grid_goal = 24
+        grid_size_i = int(round((grid_ws - crossfade_range) / grid_goal))
+        grid_actual = (grid_ws - crossfade_range) / grid_size_i
+        for i in range(0, grid_size_i):
+            x = i * grid_actual
+            append_p(lines, (x, 0), (x, grid_hs))
+        for y in range(0, grid_hs, grid_goal):
+            append_p(lines, (0, y), (grid_ws-crossfade_range, y))
+        return lines
+
+    import perlin
+    spy_perlin = perlin.lib
+    spy_perlin.init()
+    spy_perlin.seed(44)
+    scale_lines(grid_ws - crossfade_range, grid_hs)
+    print("Computing the height map")
+    spy_perlin.make_height_map(grid_ws, grid_hs)
+    spy_perlin.update_height_map(grid_ws, grid_hs, grid_scale / noise_factor, 0)
+    print("Cross-fading the height map")
+    spy_perlin.crossfade_height_map(grid_ws, grid_hs, crossfade_range)
+    print("Drawing grid")
+    draw_lines(grid_lines(), 'grid')
+    print("Marching squares")
+    draw_lines(spy_perlin.marching_squares(grid_ws, grid_hs, 0), 'zero', spy=True)
+    draw_lines(spy_perlin.marching_squares(grid_ws, grid_hs, 0.3), 'positive', spy=True)
+    draw_lines(spy_perlin.marching_squares(grid_ws, grid_hs, -0.3), 'negative', spy=True)
+    draw_lines(spy_perlin.marching_squares(grid_ws, grid_hs, 0.45), 'positive', spy=True)
+    draw_lines(spy_perlin.marching_squares(grid_ws, grid_hs, -0.45), 'negative', spy=True)
+    draw_lines(spy_perlin.marching_squares(grid_ws, grid_hs, 0.6), 'positive', spy=True)
+    draw_lines(spy_perlin.marching_squares(grid_ws, grid_hs, -0.6), 'negative', spy=True)
+    draw_lines(spy_perlin.marching_squares(grid_ws, grid_hs, -0.8), 'negative', spy=True)
+    draw_lines(spy_perlin.marching_squares(grid_ws, grid_hs, 0.8), 'positive', spy=True)
+    drawing_done()
+
+drawing_event = asyncio.Event()
+start_ts = time.time()
+
+USE_SPY = True
+if USE_SPY:
+    initial_calc()
+else:
+    worker = PyWorker("./worker.py", type="pyodide", configURL="./pyscript.toml")
+    worker.sync.draw_lines = draw_lines
+    worker.sync.drawing_done = drawing_done
+    worker.sync.scale_lines = scale_lines
+    worker.sync.print = print
+
+@create_proxy
+def on_tap(event):
+    clear()
+    player.toggle()
+document.addEventListener("click", on_tap)
+
+@create_proxy
+def on_key_down(event):
+    element = document.activeElement
+    _class = element.getAttribute("class")
+    in_xterm = element.tagName != "BODY" and _class and "xterm" in _class
+
+    if event.code == "Backquote":
+        # Screenshot mode.
+        clear()
+    elif not in_xterm:
+        # Don't react to those bindings when typing code.
+        if event.code == "Space":
+            player.toggle()
+document.addEventListener("keydown", on_key_down)
+
+@create_proxy
+def on_window_resize(event):
+    aspect_ratio = window.innerWidth / window.innerHeight
+    if camera.type == "OrthographicCamera":
+        camera.left = -view_size * aspect_ratio
+        camera.right = view_size * aspect_ratio
+        camera.top = view_size
+        camera.bottom = -view_size
+        camera.updateProjectionMatrix()
+    elif camera.type == "PerspectiveCamera":
+        camera.aspect = window.innerWidth / window.innerHeight
+        camera.updateProjectionMatrix()
+    else:
+        raise ValueError("Unknown camera type")
+    renderer.setSize(window.innerWidth, window.innerHeight)
+    scale_lines()
+
+window.addEventListener("resize", on_window_resize)
+
+@create_proxy
+def animate(now=0.0):
+    data = analyser.getFrequencyData()#.to_py() in Pyodide
+    audio_now = player.running_time
+    bs.update(data, audio_now)
+
+    if grid_width:
+        offset = -((20 * audio_now) % grid_width)
+        scale_lines(offset=offset)
+
+    renderer.render(scene, camera)
+    stats_gl.update()
+
+def reset():
+    global scroll_offset
+    bs.reset()
+    scale_lines()
+
+def on_stop():
+    global scroll_offset
+    bs.reset()
+    scale_lines()
+
+await loaded_event.wait()
+
+stats_gl = get_stats_gl(renderer)
+player = SoundPlayer(sound=sound, on_start=reset, on_stop=on_stop)
+bs = BeatSync(fft_res=fft_res)
+renderer.setAnimationLoop(animate)
+print("Waiting for the contours...")
+
+await drawing_event.wait()
+print("Tap the map to start...")

core/tests/manual/issue-2302/perlin_py.py

@@ -0,0 +1,110 @@
+# Translated from https://github.com/josephg/noisejs.
+from libthree import THREE
+from multipyjs import new
+
+class V3:
+    def __init__(self, x, y, z):
+        self.x = x
+        self.y = y
+        self.z = z
+
+    def __repr__(self):
+        return f"V3({self.x}, {self.y}, {self.z})"
+
+    def dot2(self, x, y):
+        return self.x * x + self.y * y
+
+    def dot3(self, x, y, z):
+        return self.x * x + self.y * y + self.z * z
+
+    def to_js(self, scale=1.0):
+        return new(THREE.Vector3, self.x * scale, self.y * scale, self.z * scale)
+
+PERM = [0] * 512
+V3_P = [0] * 512  # assigned V3s in seed()
+P = [151, 160, 137, 91, 90, 15,
+     131, 13, 201, 95, 96, 53, 194, 233, 7, 225, 140, 36, 103, 30, 69, 142, 8, 99, 37, 240, 21, 10, 23,
+     190, 6, 148, 247, 120, 234, 75, 0, 26, 197, 62, 94, 252, 219, 203, 117, 35, 11, 32, 57, 177, 33,
+     88, 237, 149, 56, 87, 174, 20, 125, 136, 171, 168, 68, 175, 74, 165, 71, 134, 139, 48, 27, 166,
+     77, 146, 158, 231, 83, 111, 229, 122, 60, 211, 133, 230, 220, 105, 92, 41, 55, 46, 245, 40, 244,
+     102, 143, 54, 65, 25, 63, 161, 1, 216, 80, 73, 209, 76, 132, 187, 208, 89, 18, 169, 200, 196,
+     135, 130, 116, 188, 159, 86, 164, 100, 109, 198, 173, 186, 3, 64, 52, 217, 226, 250, 124, 123,
+     5, 202, 38, 147, 118, 126, 255, 82, 85, 212, 207, 206, 59, 227, 47, 16, 58, 17, 182, 189, 28, 42,
+     223, 183, 170, 213, 119, 248, 152, 2, 44, 154, 163, 70, 221, 153, 101, 155, 167, 43, 172, 9,
+     129, 22, 39, 253, 19, 98, 108, 110, 79, 113, 224, 232, 178, 185, 112, 104, 218, 246, 97, 228,
+     251, 34, 242, 193, 238, 210, 144, 12, 191, 179, 162, 241, 81, 51, 145, 235, 249, 14, 239, 107,
+     49, 192, 214, 31, 181, 199, 106, 157, 184, 84, 204, 176, 115, 121, 50, 45, 127, 4, 150, 254,
+     138, 236, 205, 93, 222, 114, 67, 29, 24, 72, 243, 141, 128, 195, 78, 66, 215, 61, 156, 180]
+V3_I = [V3(1, 1, 0), V3(-1, 1, 0), V3(1, -1, 0), V3(-1, -1, 0),
+        V3(1, 0, 1), V3(-1, 0, 1), V3(1, 0, -1), V3(-1, 0, -1),
+        V3(0, 1, 1), V3(0, -1, 1), V3(0, 1, -1), V3(0, -1, -1)]
+
+def seed(s):
+    if isinstance(s, float) and 0.0 < s < 1.0:
+        s *= 65536
+
+    s = int(s)
+    if s < 256:
+        s |= s << 8
+
+    for i in range(256):
+        if i & 1:
+            v = P[i] ^ (s & 255)
+        else:
+            v = P[i] ^ ((s >> 8) & 255)
+
+        PERM[i] = PERM[i + 256] = v
+        V3_P[i] = V3_P[i + 256] = V3_I[v % 12]
+
+seed(0)
+
+def fade(t):
+    return t * t * t * (t * (t * 6 - 15) + 10)
+
+def lerp(a, b, t):
+    return (1 - t) * a + t * b
+
+def perlin3(x, y, z):
+    # grid cells
+    x_c = int(x)
+    y_c = int(y)
+    z_c = int(z)
+    # relative coords within the cell
+    x -= x_c
+    y -= y_c
+    z -= z_c
+    # wrap cells
+    x_c &= 255
+    y_c &= 255
+    z_c &= 255
+    # noise contributions to corners
+    n000 = V3_P[x_c + PERM[y_c + PERM[z_c]]].dot3(x, y, z)
+    n001 = V3_P[x_c + PERM[y_c + PERM[z_c + 1]]].dot3(x, y, z - 1)
+    n010 = V3_P[x_c + PERM[y_c + 1 + PERM[z_c]]].dot3(x, y - 1, z)
+    n011 = V3_P[x_c + PERM[y_c + 1 + PERM[z_c + 1]]].dot3(x, y - 1, z - 1)
+    n100 = V3_P[x_c + 1 + PERM[y_c + PERM[z_c]]].dot3(x - 1, y, z)
+    n101 = V3_P[x_c + 1 + PERM[y_c + PERM[z_c + 1]]].dot3(x - 1, y, z - 1)
+    n110 = V3_P[x_c + 1 + PERM[y_c + 1 + PERM[z_c]]].dot3(x - 1, y - 1, z)
+    n111 = V3_P[x_c + 1 + PERM[y_c + 1 + PERM[z_c + 1]]].dot3(x - 1, y - 1, z - 1)
+    # fade curve
+    u = fade(x)
+    v = fade(y)
+    w = fade(z)
+    # interpolation
+    return lerp(
+        lerp(lerp(n000, n100, u), lerp(n001, n101, u), w),
+        lerp(lerp(n010, n110, u), lerp(n011, n111, u), w),
+        v,
+    )
+
+def curl2(x, y, z):
+    # https://www.bit-101.com/2017/2021/07/curl-noise/
+    delta = 0.01
+    n1 = perlin3(x + delta, y, z)
+    n2 = perlin3(x - delta, y, z)
+    cy = -(n1 - n2) / (delta * 2)
+    n1 = perlin3(x, y + delta, z)
+    n2 = perlin3(x, y - delta, z)
+    cx = -(n1 - n2) / (delta * 2)
+    print(n1, n2)
+    return V3(cx, cy, 0)

core/tests/manual/issue-2302/pyscript.toml

@@ -0,0 +1,16 @@
+name = "Marching Squares with SPy Copy Copy"
+packages = [ "cffi", "./glue/perlin-0.0.0-cp312-cp312-pyodide_2024_0_wasm32.whl",]
+
+[files]
+"./libthree.py" = ""
+"./libfft.py" = ""
+"./perlin_py.py" = ""
+"./worker.py" = ""
+"./glue/multipyjs.py" = "./multipyjs.py"
+
+[js_modules.main]
+"https://cdn.jsdelivr.net/npm/three@v0.173.0/build/three.module.js" = "three"
+"https://cdn.jsdelivr.net/npm/three@v0.173.0/examples/jsm/lines/LineMaterial.js" = "linemat"
+"https://cdn.jsdelivr.net/npm/three@v0.173.0/examples/jsm/lines/Line2.js" = "line2"
+"https://cdn.jsdelivr.net/npm/three@v0.173.0/examples/jsm/lines/LineSegmentsGeometry.js" = "lsgeo"
+"https://cdn.jsdelivr.net/npm/stats-gl@3.6.0/dist/main.js" = "stats_gl"

core/tests/manual/issue-2302/worker.py

@@ -0,0 +1,141 @@
+from array import array
+
+from pyscript import sync, window
+from perlin_py import perlin3, seed
+
+grid_w = int(1920 * 4)
+grid_h = 1080 * 2
+grid_scale = 10
+noise_factor = 500
+grid_hs = int(grid_h/grid_scale)
+grid_ws = int(grid_w/grid_scale)
+crossfade_range = int(grid_ws/12.5)
+height_map = array("d", [0.0] * (grid_hs * grid_ws))
+edge_table = [
+    (), # 0
+    ((3, 2),), # 1
+    ((2, 1),), # 2
+    ((3, 1),), # 3
+    ((0, 1),), # 4
+    ((0, 3), (1, 2)), # 5 (ambiguous)
+    ((0, 2),), # 6
+    ((0, 3),), # 7
+    ((0, 3),), # 8
+    ((0, 2),), # 9
+    ((0, 1), (2, 3)), # 10 (ambiguous)
+    ((0, 1),), # 11
+    ((3, 1),), # 12
+    ((2, 1),), # 13
+    ((3, 2),), # 14
+    (),        # 15
+]
+
+def update_height_map(z):
+    i = 0
+    for y in range(0, grid_h, grid_scale):
+        for x in range(0, grid_w, grid_scale):
+            # 3 octaves of noise
+            n = perlin3(x/noise_factor, y/noise_factor, z)
+            n += 0.50 * perlin3(2*x/noise_factor, 2*y/noise_factor, z)
+            n += 0.25 * perlin3(4*x/noise_factor, 4*y/noise_factor, z)
+            height_map[i] = n
+            i += 1
+
+def crossfade_height_map():
+    for y in range(grid_hs):
+        for x in range(crossfade_range):
+            pos_i = y*grid_ws + x
+            neg_i = y*grid_ws + grid_ws - crossfade_range + x
+            weight = x/crossfade_range
+            old_pos = height_map[pos_i]
+            old_neg = height_map[neg_i]
+            height_map[neg_i] = height_map[pos_i] = weight * old_pos + (1.0 - weight) * old_neg
+
+
+def _crossfade_height_map():
+    for y in range(grid_hs):
+        for x in range(crossfade_range):
+            pos_i = y*grid_ws + x
+            neg_i = y*grid_ws + grid_ws - x - 1
+            old_pos = height_map[pos_i]
+            old_neg = height_map[neg_i]
+            weight = 0.5 - x/crossfade_range/2
+            height_map[pos_i] = (1.0 - weight) * old_pos + weight * old_neg
+            height_map[neg_i] = (1.0 - weight) * old_neg + weight * old_pos
+
+def interpolate(sq_threshold, v1, v2):
+    if v1 == v2:
+        return v1
+    return (sq_threshold - v1) / (v2 - v1)
+
+stats = {'maxx': 0, 'maxy': 0, 'minx': 0, 'miny': 0}
+def append_p(lines, p1, p2):
+    lines.append(p1[0])
+    lines.append(p1[1])
+    lines.append(0)
+    lines.append(p2[0])
+    lines.append(p2[1])
+    lines.append(0)
+    stats['maxy'] = max(p1[1], p2[1], stats['maxy'])
+    stats['miny'] = min(p1[1], p2[1], stats['miny'])
+    stats['maxx'] = max(p1[0], p2[0], stats['maxx'])
+    stats['minx'] = min(p1[0], p2[0], stats['minx'])
+
+def marching_squares(height_map, sq_threshold):
+    lines = array("d")
+
+    for y in range(grid_hs-1):
+        for x in range(grid_ws-1): #cf
+            tl = height_map[y*grid_ws + x]
+            tr = height_map[y*grid_ws + x+1]
+            bl = height_map[(y+1)*grid_ws + x]
+            br = height_map[(y+1)*grid_ws + x+1]
+
+            sq_idx = 0
+            if tl > sq_threshold:
+                sq_idx |= 8
+            if tr > sq_threshold:
+                sq_idx |= 4
+            if br > sq_threshold:
+                sq_idx |= 2
+            if bl > sq_threshold:
+                sq_idx |= 1
+
+            edge_points = [
+                (x + interpolate(sq_threshold, tl, tr), y),
+                (x + 1, y + interpolate(sq_threshold, tr, br)),
+                (x + interpolate(sq_threshold, bl, br), y + 1),
+                (x, y + interpolate(sq_threshold, tl, bl)),
+            ]
+
+            for a, b in edge_table[sq_idx]:
+                append_p(lines, edge_points[a], edge_points[b])
+
+    return lines
+
+def grid_lines():
+    lines = array("d")
+    for x in range(0, grid_ws - crossfade_range, 26):
+        append_p(lines, (x, 0), (x, grid_hs))
+    for y in range(0, grid_hs, 24):
+        append_p(lines, (0, y), (grid_ws-crossfade_range, y))
+    return lines
+
+seed(44)
+sync.scale_lines(grid_ws - crossfade_range, grid_hs)
+sync.print("Computing the height map")
+update_height_map(0)
+sync.print("Cross-fading the height map")
+crossfade_height_map()
+sync.draw_lines(grid_lines(), 'grid')
+sync.draw_lines(marching_squares(height_map, 0), 'zero')
+sync.draw_lines(marching_squares(height_map, 0.3), 'positive')
+sync.draw_lines(marching_squares(height_map, -0.3), 'negative')
+sync.draw_lines(marching_squares(height_map, 0.45), 'positive')
+sync.draw_lines(marching_squares(height_map, -0.45), 'negative')
+sync.draw_lines(marching_squares(height_map, 0.6), 'positive')
+sync.draw_lines(marching_squares(height_map, -0.6), 'negative')
+sync.draw_lines(marching_squares(height_map, -0.8), 'negative')
+sync.draw_lines(marching_squares(height_map, 0.8), 'positive')
+print(stats)
+sync.drawing_done()