Fix #2302 - Updated Polyscript to its latest (#2303)

* Fix #2302 - Updated Polyscript to its latest

.pre-commit-config.yaml

@@ -25,22 +25,29 @@ repos:
           - id: trailing-whitespace
 
     - repo: https://github.com/psf/black
-      rev: 24.10.0
+      rev: 25.1.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.9.6
+      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"]

README.md

@@ -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/)!

core/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@pyscript/core",
-    "version": "0.6.22",
+    "version": "0.6.35",
     "type": "module",
     "description": "PyScript",
     "module": "./index.js",
@@ -25,6 +25,10 @@
             "types": "./types/core.d.ts",
             "import": "./src/core.js"
         },
+        "./js": {
+            "types": "./types/core.d.ts",
+            "import": "./dist/core.js"
+        },
         "./css": {
             "import": "./dist/core.css"
         },
@@ -43,7 +47,7 @@
         "build:3rd-party": "node rollup/3rd-party.cjs",
         "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",
@@ -62,38 +66,38 @@
         "@webreflection/idb-map": "^0.3.2",
         "add-promise-listener": "^0.1.3",
         "basic-devtools": "^0.1.6",
-        "polyscript": "^0.16.10",
+        "polyscript": "^0.16.17",
-        "sabayon": "^0.6.1",
+        "sabayon": "^0.6.6",
         "sticky-module": "^0.1.1",
         "to-json-callback": "^0.1.1",
         "type-checked-collections": "^0.1.7"
     },
     "devDependencies": {
-        "@codemirror/commands": "^6.7.1",
+        "@codemirror/commands": "^6.8.0",
-        "@codemirror/lang-python": "^6.1.6",
+        "@codemirror/lang-python": "^6.1.7",
-        "@codemirror/language": "^6.10.6",
+        "@codemirror/language": "^6.10.8",
-        "@codemirror/state": "^6.4.1",
+        "@codemirror/state": "^6.5.2",
-        "@codemirror/view": "^6.35.0",
+        "@codemirror/view": "^6.36.3",
         "@playwright/test": "1.45.3",
-        "@rollup/plugin-commonjs": "^28.0.1",
+        "@rollup/plugin-commonjs": "^28.0.2",
-        "@rollup/plugin-node-resolve": "^15.3.0",
+        "@rollup/plugin-node-resolve": "^16.0.0",
         "@rollup/plugin-terser": "^0.4.4",
         "@webreflection/toml-j0.4": "^1.1.3",
         "@xterm/addon-fit": "^0.10.0",
         "@xterm/addon-web-links": "^0.11.0",
         "@xterm/xterm": "^5.5.0",
-        "bun": "^1.1.38",
+        "bun": "^1.2.4",
-        "chokidar": "^4.0.1",
+        "chokidar": "^4.0.3",
         "codedent": "^0.1.2",
         "codemirror": "^6.0.1",
-        "eslint": "^9.16.0",
+        "eslint": "^9.21.0",
-        "flatted": "^3.3.2",
+        "flatted": "^3.3.3",
-        "rollup": "^4.28.1",
+        "rollup": "^4.34.8",
         "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",
+        "typescript": "^5.7.3",
         "xterm-readline": "^1.1.2"
     },
     "repository": {

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 = "",

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

@@ -33,6 +33,7 @@ import {
     createFunction,
     inputFailure,
 } from "./hooks.js";
+import * as fs from "./fs.js";
 
 import codemirror from "./plugins/codemirror.js";
 export { codemirror };
@@ -167,6 +168,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)

core/src/fs.js

@@ -0,0 +1,81 @@
+import IDBMap from "@webreflection/idb-map";
+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 } = Promise.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

@@ -4,13 +4,15 @@ 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 +32,18 @@ const validate = (config, result) => {
     return result;
 };
 
+const getRelatedScript = (target, type) => {
+    const editor = target.closest(`.${type}-editor-box`);
+    return editor?.parentNode?.previousElementSibling;
+};
+
 async function execute({ currentTarget }) {
     const { env, pySrc, outDiv } = this;
     const hasRunButton = !!currentTarget;
 
     if (hasRunButton) {
-        currentTarget.disabled = true;
+        currentTarget.classList.add("running");
+        currentTarget.innerHTML = STOP_BUTTON;
         outDiv.innerHTML = "";
     }
 
@@ -82,8 +90,7 @@ 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 = getRelatedScript(currentTarget, type);
-                const script = editor?.parentNode?.previousElementSibling;
                 if (script) {
                     defineProperties(script, { xworker: { value: xworker } });
                     break;
@@ -116,7 +123,10 @@ async function execute({ currentTarget }) {
         };
 
         const enable = () => {
-            if (hasRunButton) currentTarget.disabled = false;
+            if (hasRunButton) {
+                currentTarget.classList.remove("running");
+                currentTarget.innerHTML = RUN_BUTTON;
+            }
         };
         const { sync } = xworker;
         sync.write = (str) => {
@@ -144,6 +154,24 @@ const makeRunButton = (handler, type) => {
     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 editor = editors.get(script);
+                const content = editor.state.doc.toString();
+                const clone = script.cloneNode(true);
+                clone.type = `${type}-editor`;
+                clone.textContent = content;
+                script.xworker.terminate();
+                script.nextElementSibling.remove();
+                script.replaceWith(clone);
+                editors.delete(script);
+            }
+            return;
+        }
         runButton.blur();
         await handler.handleEvent(event);
     });
@@ -387,6 +415,7 @@ const init = async (script, type, interpreter) => {
         doc,
     });
 
+    editors.set(script, editor);
     editor.focus();
     notifyEditor();
 };

core/src/plugins/py-game.js

@@ -0,0 +1,68 @@
+import { dedent, define } from "polyscript/exports";
+
+import { stdlib } from "../core.js";
+import { configDetails } from "../config.js";
+import { getText } from "../fetch.js";
+
+let toBeWarned = true;
+
+const hooks = {
+    main: {
+        onReady: async (wrap, script) => {
+            if (toBeWarned) {
+                toBeWarned = false;
+                console.warn("⚠️ EXPERIMENTAL `py-game` FEATURE");
+            }
+            if (script.hasAttribute("config")) {
+                const value = script.getAttribute("config");
+                const { json, toml, text } = configDetails(value);
+                let config = {};
+                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) {
+                    const micropip = wrap.interpreter.pyimport("micropip");
+                    await micropip.install(config.packages, {
+                        keep_going: true,
+                    });
+                    micropip.destroy();
+                }
+            }
+
+            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);
+
+            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);
+            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/stdlib/pyscript/display.py

@@ -73,14 +73,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
 
@@ -107,7 +107,7 @@ def _format_mime(obj):
 
         if output is None:
             continue
-        elif mime_type not in _MIME_RENDERERS:
+        if mime_type not in _MIME_RENDERERS:
             not_available.append(mime_type)
             continue
         break
@@ -149,9 +149,11 @@ def display(*values, target=None, append=True):
     if target is None:
         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
@@ -161,9 +163,8 @@ def display(*values, target=None, append=True):
 
     # If target cannot be found on the page, a ValueError is raised
     if element is None:
-        raise ValueError(
+        msg = f"Invalid selector with id={target}. Cannot be found in the page."
-            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
 

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,60 @@
+mounted = {}
+
+
+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 ⚠️")
+
+    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
+
+            idb = IDBMap.new(fs.NAMESPACE)
+            handler = await idb.get(uid)
+        else:
+            raise RuntimeError(fs.ERROR)
+
+    else:
+        success = await fs.idb.has(uid)
+
+        if success:
+            handler = await fs.idb.get(uid)
+        else:
+            handler = await fs.getFileSystemDirectoryHandle(to_js(options))
+            await fs.idb.set(uid, handler)
+
+    mounted[path] = await interpreter.mountNativeFS(path, handler)
+
+
+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

@@ -25,6 +25,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

core/src/stdlib/pyscript/media.py

@@ -44,8 +44,7 @@ class Device:
             for k in video:
                 setattr(options.video, k, to_js(video[k]))
 
-        stream = await window.navigator.mediaDevices.getUserMedia(options)
+        return await window.navigator.mediaDevices.getUserMedia(options)
-        return stream
 
     async def get_stream(self):
         key = self.kind.replace("input", "").replace("output", "")

core/src/stdlib/pyscript/storage.py

@@ -10,10 +10,11 @@ def _to_idb(value):
     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]])
+        return _stringify(["memoryview", list(value)])
-    raise TypeError(f"Unexpected value: {value}")
+    msg = f"Unexpected value: {value}"
+    raise TypeError(msg)
 
 
 # convert an IndexedDB compatible entry into a Python value
@@ -56,5 +57,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,7 +2,10 @@
 
 # `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 __future__ import annotations  # CAUTION: This is not supported in MicroPython.
+
+from pyscript import document, when, Event  # noqa: F401
 from pyscript.ffi import create_proxy
 
 
@@ -100,7 +103,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 +123,7 @@ 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.
         return getattr(self._dom_element, name)
 
     def __setattr__(self, name, value):
@@ -138,7 +141,7 @@ 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.startswith("on_"):
                 # Ensure on-events are cached in the _on_events dict if the
@@ -152,10 +155,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
@@ -203,7 +208,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 +232,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,8 +407,7 @@ class Options:
 
         new_option = option(**kwargs)
 
-        if before:
+        if before and isinstance(before, Element):
-            if isinstance(before, Element):
             before = before._dom_element
 
         self._element._dom_element.add(new_option._dom_element, before)
@@ -463,7 +468,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 +498,13 @@ class ClassesCollection:
         )
 
     def __iter__(self):
-        for class_name in self._all_class_names():
+        yield from self._all_class_names()
-            yield class_name
 
     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 +557,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 +592,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)
@@ -1125,7 +1129,8 @@ class video(ContainerElement):
 
         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 +1139,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

@@ -24,7 +24,7 @@ class EventMessage:
         return value
 
 
-class WebSocket(object):
+class WebSocket:
     CONNECTING = 0
     OPEN = 1
     CLOSING = 2

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/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,21 @@ export default {
     sleep(seconds) {
         return new Promise(($) => setTimeout($, seconds * 1000));
     },
+
+    /**
+     * 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 {boolean}
+     */
+    async storeFSHandler(uid, options = {}) {
+        if (await idb.has(uid)) return true;
+        return getFileSystemDirectoryHandle(options).then(
+            async (handler) => {
+                await idb.set(uid, handler);
+                return true;
+            },
+            () => false,
+        );
+    },
 };

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

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

core/tests/javascript/workers/worker.py

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

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,46 @@
+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")
+
+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.unmount("/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,399 @@
+"""(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, bestdepth
+                    )
+                    screen.blit(screen_backup, (0, 0))
+                else:
+                    print("Changing to windowed mode")
+                    screen_backup = screen.copy()
+                    screen = pygame.display.set_mode(
+                        SCREENRECT.size, winstyle, bestdepth
+                    )
+                    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"></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)
+    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 lsgeo, 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()

core/tests/py_tests.main.spec.js

@@ -0,0 +1,19 @@
+import { test, expect } from '@playwright/test';
+
+test.setTimeout(30 * 1000);
+
+test('Python unit tests - MicroPython on MAIN thread', async ({ page }) => {
+  await page.goto('http://localhost:8080/tests/python/index.html');
+  const result = page.locator("#result");  // Payload for results will be here.
+  await result.waitFor();  // wait for the result.
+  const data = JSON.parse(await result.textContent());  // get the result data.
+  await expect(data.fails).toMatchObject([]);  // ensure no test failed.
+});
+
+test('Python unit tests - Pyodide on MAIN thread', async ({ page }) => {
+  await page.goto('http://localhost:8080/tests/python/index.html?type=py');
+  const result = page.locator("#result");  // Payload for results will be here.
+  await result.waitFor();  // wait for the result.
+  const data = JSON.parse(await result.textContent());  // get the result data.
+  await expect(data.fails).toMatchObject([]);  // ensure no test failed.
+});

core/tests/py_tests.worker.spec.js

@@ -2,22 +2,6 @@ import { test, expect } from '@playwright/test';
 
 test.setTimeout(120 * 1000);
 
-test('Python unit tests - MicroPython on MAIN thread', async ({ page }) => {
-  await page.goto('http://localhost:8080/tests/python/index.html');
-  const result = page.locator("#result");  // Payload for results will be here.
-  await result.waitFor();  // wait for the result.
-  const data = JSON.parse(await result.textContent());  // get the result data.
-  await expect(data.fails).toMatchObject([]);  // ensure no test failed.
-});
-
-test('Python unit tests - Pyodide on MAIN thread', async ({ page }) => {
-  await page.goto('http://localhost:8080/tests/python/index.html?type=py');
-  const result = page.locator("#result");  // Payload for results will be here.
-  await result.waitFor();  // wait for the result.
-  const data = JSON.parse(await result.textContent());  // get the result data.
-  await expect(data.fails).toMatchObject([]);  // ensure no test failed.
-});
-
 test('Python unit tests - MicroPython on WORKER', async ({ page }) => {
   await page.goto('http://localhost:8080/tests/python/index.html?worker');
   const result = page.locator("#result");  // Payload for results will be here.

core/tests/python/tests/test_current_target.py

@@ -13,10 +13,7 @@ def test_current_target():
     """
     expected = "py-0"
     if is_micropython:
-        if RUNNING_IN_WORKER:
+        expected = "mpy-w0-target" if RUNNING_IN_WORKER else "mpy-0"
-            expected = "mpy-w0-target"
-        else:
-            expected = "mpy-0"
     elif RUNNING_IN_WORKER:
         expected = "py-w0-target"
     assert current_target() == expected, f"Expected {expected} got {current_target()}"

core/tests/python/tests/test_display.py

@@ -256,7 +256,7 @@ async def test_image_display():
     """
     Check an image is displayed correctly.
     """
-    mpl = await py_import("matplotlib")
+    _mpl = await py_import("matplotlib")
     import matplotlib.pyplot as plt
 
     xpoints = [3, 6, 9]

core/tests/python/tests/test_storage.py

@@ -65,7 +65,6 @@ async def test_storage_types():
     assert test_store["string"] == "hello"
     assert isinstance(test_store["string"], str)
     assert test_store["none"] is None
-    assert isinstance(test_store["none"], type(None))
     assert test_store["list"] == [1, 2, 3]
     assert isinstance(test_store["list"], list)
     assert test_store["dict"] == {"a": 1, "b": 2}

core/tests/python/tests/test_web.py

@@ -248,7 +248,7 @@ class TestCollection:
 
     def test_iter_eq_children(self):
         elements = web.page.find(".multi-elems")
-        assert [el for el in elements] == [el for el in elements.elements]
+        assert list(elements) == list(elements.elements)
         assert len(elements) == 3
 
     def test_slices(self):
@@ -427,18 +427,18 @@ class TestInput:
 class TestSelect:
 
     def test_select_options_iter(self):
-        select = web.page.find(f"#test_select_element_w_options")[0]
+        select = web.page.find("#test_select_element_w_options")[0]
 
         for i, option in enumerate(select.options, 1):
             assert option.value == f"{i}"
             assert option.innerHTML == f"Option {i}"
 
     def test_select_options_len(self):
-        select = web.page.find(f"#test_select_element_w_options")[0]
+        select = web.page.find("#test_select_element_w_options")[0]
         assert len(select.options) == 2
 
     def test_select_options_clear(self):
-        select = web.page.find(f"#test_select_element_to_clear")[0]
+        select = web.page.find("#test_select_element_to_clear")[0]
         assert len(select.options) == 3
 
         select.options.clear()
@@ -447,7 +447,7 @@ class TestSelect:
 
     def test_select_element_add(self):
         # GIVEN the existing select element with no options
-        select = web.page.find(f"#test_select_element")[0]
+        select = web.page.find("#test_select_element")[0]
 
         # EXPECT the select element to have no options
         assert len(select.options) == 0
@@ -498,20 +498,14 @@ class TestSelect:
         # EXPECT the middle option to have the value and html we passed in
         assert select.options[0].value == "1"
         assert select.options[0].innerHTML == "Option 1"
-        assert (
+        assert select.options[0].selected == select.options[0]._dom_element.selected
-            select.options[0].selected
+        assert select.options[0].selected is False
-            == select.options[0]._dom_element.selected
-            == False
-        )
         assert select.options[1].value == "2"
         assert select.options[1].innerHTML == "Option 2"
         assert select.options[2].value == "3"
         assert select.options[2].innerHTML == "Option 3"
-        assert (
+        assert select.options[2].selected == select.options[2]._dom_element.selected
-            select.options[2].selected
+        assert select.options[2].selected is True
-            == select.options[2]._dom_element.selected
-            == True
-        )
         assert select.options[3].value == ""
         assert select.options[3].innerHTML == ""
 
@@ -538,7 +532,7 @@ class TestSelect:
 
     def test_select_options_remove(self):
         # GIVEN the existing select element with 3 options
-        select = web.page.find(f"#test_select_element_to_remove")[0]
+        select = web.page.find("#test_select_element_to_remove")[0]
 
         # EXPECT the select element to have 3 options
         assert len(select.options) == 4
@@ -560,7 +554,7 @@ class TestSelect:
 
     def test_select_get_selected_option(self):
         # GIVEN the existing select element with one selected option
-        select = web.page.find(f"#test_select_element_w_options")[0]
+        select = web.page.find("#test_select_element_w_options")[0]
 
         # WHEN we get the selected option
         selected_option = select.options.selected
@@ -568,7 +562,8 @@ class TestSelect:
         # EXPECT the selected option to be correct
         assert selected_option.value == "2"
         assert selected_option.innerHTML == "Option 2"
-        assert selected_option.selected == selected_option._dom_element.selected == True
+        assert selected_option.selected == selected_option._dom_element.selected
+        assert selected_option.selected is True
 
 
 class TestElements:
@@ -625,7 +620,8 @@ class TestElements:
             el = klass(*args, **kwargs)
             container.append(el)
         except Exception as e:
-            assert False, f"Failed to create element {el_type}: {e}"
+            msg = f"Failed to create element {el_type}: {e}"
+            raise AssertionError(msg)
 
         # Let's keep the tag in 2 variables, one for the selector and another to
         # check the return tag from the selector

core/types/config.d.ts

@@ -1,2 +1,7 @@
+export function configDetails(config: string, type: string | null): {
+    json: boolean;
+    toml: boolean;
+    text: string;
+};
 export const configs: Map<any, any>;
 export function relative_url(url: any, base?: string): string;

core/types/fs.d.ts

@@ -0,0 +1,8 @@
+export const NAMESPACE: "@pyscript.fs";
+export const ERROR: "storage permissions not granted";
+export const idb: any;
+export function getFileSystemDirectoryHandle(options: {
+    id?: string;
+    mode?: "read" | "readwrite";
+    hint?: "desktop" | "documents" | "downloads" | "music" | "pictures" | "videos";
+}): Promise<FileSystemDirectoryHandle>;

core/types/plugins.d.ts

@@ -4,6 +4,7 @@ declare const _default: {
     donkey: () => Promise<typeof import("./plugins/donkey.js")>;
     error: () => Promise<typeof import("./plugins/error.js")>;
     "py-editor": () => Promise<typeof import("./plugins/py-editor.js")>;
+    "py-game": () => Promise<typeof import("./plugins/py-game.js")>;
     "py-terminal": () => Promise<typeof import("./plugins/py-terminal.js")>;
 };
 export default _default;

core/types/plugins/py-game.d.ts

@@ -0,0 +1 @@
+export {};

core/types/stdlib/pyscript.d.ts

@@ -6,6 +6,7 @@ declare namespace _default {
         "fetch.py": string;
         "ffi.py": string;
         "flatted.py": string;
+        "fs.py": string;
         "magic_js.py": string;
         "media.py": string;
         "storage.py": string;

core/types/sync.d.ts

@@ -5,5 +5,16 @@ declare namespace _default {
      * @param {number} seconds The number of seconds to sleep.
      */
     function sleep(seconds: number): Promise<any>;
+    /**
+     * 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 {boolean}
+     */
+    function storeFSHandler(uid: string, options?: {
+        id?: string;
+        mode?: "read" | "readwrite";
+        hint?: "desktop" | "documents" | "downloads" | "music" | "pictures" | "videos";
+    }): boolean;
 }
 export default _default;

pyproject.toml

@@ -1,3 +1,9 @@
 [tool.codespell]
 ignore-words-list = "afterall"
 skip = "*.js,*.json"
+
+[tool.ruff]
+line-length = 114
+lint.select = ["C4", "C90", "E", "EM", "F", "PIE", "PYI", "PLC", "Q", "RET", "W"]
+lint.ignore = ["E402", "E722", "E731", "E741", "F401", "F704", "F811", "F821"]
+lint.mccabe.max-complexity = 27