An even better Pyodide experimental patch

WebReflection · WebReflection · commit 4fe92999d8e3 · 2025-05-22T23:32:39.000+02:00
diff --git a/docs/index.js b/docs/index.js
diff --git a/docs/index.js.map b/docs/index.js.map
diff --git a/esm/interpreter/pyodide-patch.js b/esm/interpreter/pyodide-patch.js
@@ -0,0 +1,89 @@
+export default () => {
+  const { prototype } = Function;
+  const { apply, construct, defineProperty } = Reflect;
+
+  const notRegistered = value => value?.shared?.gcRegistered === false;
+
+  const patch = args => {
+    if (known) {
+      for (let i = 0; i < args.length; i++)
+        args[i] = toJS(args[i]);
+    }
+  };
+
+  const toJS = current => {
+    if (known) {
+      switch (typeof current) {
+        case 'object':
+          if (current === null) break;
+          // falls through
+        case 'function':
+          if (notRegistered(current[pyproxy])) {
+            return current.toJs(options);
+          }
+      }
+    }
+    return current;
+  };
+
+  const options = { dict_converter: Object.fromEntries };
+
+  const descriptor = {
+    configurable: true,
+    set(value) {
+      delete this[pyproxy];
+      this[pyproxy] = value;
+      if (notRegistered(value)) {
+        const copy = this.copy();
+        queueMicrotask(() => {
+          this[pyproxy] = copy[pyproxy];
+        });
+      }
+    },
+  };
+
+  let pyproxy, known = false;
+
+  defineProperty(prototype, 'apply', {
+    value(context, args) {
+      patch(args);
+      return apply(this, toJS(context), args);
+    }
+  });
+
+  defineProperty(prototype, 'call', {
+    value(context, ...args) {
+      patch(args);
+      return apply(this, toJS(context), args);
+    }
+  });
+
+  // minimalistic Symbol override that
+  // won't affect performance or break expectations
+  defineProperty(globalThis, 'Symbol', {
+    value: new Proxy(Symbol, {
+      apply(target, self, args) {
+        const symbol = apply(target, self, args);
+        if (!known && symbol.description === 'pyproxy.attrs') {
+          known = true;
+          pyproxy = symbol;
+        }
+        return symbol;
+      },
+    })
+  });
+
+  // minimalistic Proxy override that
+  // won't affect performance or break expectations
+  defineProperty(globalThis, 'Proxy', {
+    value: new Proxy(Proxy, {
+      construct(target, args, New) {
+        const proxy = construct(target, args, New);
+        if (known && typeof args[0] === 'function') {
+          defineProperty(args[0], pyproxy, descriptor);
+        }
+        return proxy;
+      },
+    })
+  });
+};
diff --git a/esm/interpreter/pyodide.js b/esm/interpreter/pyodide.js
@@ -7,63 +7,14 @@ const type = 'pyodide';
 const toJsOptions = { dict_converter: Object.fromEntries };
 
 const { stringify } = JSON;
-
 const { apply } = Reflect;
-const FunctionPrototype = Function.prototype;
 
 // REQUIRES INTEGRATION TEST
 /* c8 ignore start */
 const overrideMethod = method => function (...args) {
     return apply(method, this, args);
 };
 
-let pyproxy, to_js;
-const override = intercept => {
-
-    const proxies = new WeakMap;
-
-    const patch = args => {
-        for (let arg, i = 0; i < args.length; i++) {
-            switch (typeof(arg = args[i])) {
-                case 'object':
-                    if (arg === null) break;
-                    // falls through
-                case 'function': {
-                    if (pyproxy in arg && !arg[pyproxy].shared?.gcRegistered) {
-                        intercept = false;
-                        let proxy = proxies.get(arg)?.deref();
-                        if (!proxy) {
-                            proxy = to_js(arg);
-                            const wr = new WeakRef(proxy);
-                            proxies.set(arg, wr);
-                            proxies.set(proxy, wr);
-                        }
-                        args[i] = proxy;
-                        intercept = true;
-                    }
-                    break;
-                }
-            }
-        }
-    };
-
-    // the patch
-    Object.defineProperties(FunctionPrototype, {
-        apply: {
-            value(context, args) {
-                if (intercept) patch(args);
-                return apply(this, context, args);
-            }
-        },
-        call: {
-            value(context, ...args) {
-                if (intercept) patch(args);
-                return apply(this, context, args);
-            }
-        }
-    });
-};
-
 const progress = createProgress('py');
 const indexURLs = new WeakMap();
 
@@ -72,6 +23,9 @@ export default {
     module: (version = '0.27.6') =>
         `https://cdn.jsdelivr.net/pyodide/v${version}/full/pyodide.mjs`,
     async engine({ loadPyodide }, config, url, baseURL) {
+        if (config.experimental_create_proxy === 'auto') {
+            this.transform = (_, value) => value;
+        }
         progress('Loading Pyodide');
         let { packages, index_urls } = config;
         if (packages) packages = packages.map(fixedRelative, baseURL);
@@ -119,23 +73,6 @@ export default {
         await storage.close();
         if (options.lockFileURL) URL.revokeObjectURL(options.lockFileURL);
         progress('Loaded Pyodide');
-        if (config.experimental_create_proxy === 'auto') {
-            interpreter.runPython([
-                'import js',
-                'from pyodide.ffi import to_js',
-                'o=js.Object.fromEntries',
-                'js.experimental_create_proxy=lambda r:to_js(r,dict_converter=o)'
-            ].join(';'), { globals: interpreter.toPy({}) });
-            to_js = globalThis.experimental_create_proxy;
-            delete globalThis.experimental_create_proxy;
-            [pyproxy] = Reflect.ownKeys(to_js).filter(
-                k => (
-                    typeof k === 'symbol' &&
-                    String(k) === 'Symbol(pyproxy.attrs)'
-                )
-            );
-            override(true);
-        }
         return interpreter;
     },
     registerJSModule,
diff --git a/esm/interpreters.js b/esm/interpreters.js
@@ -2,6 +2,8 @@
 //    The :RUNTIMES comment is a delimiter and no code should be written/changed after
 //    See rollup/build_interpreters.cjs to know more
 
+import patch from './interpreter/pyodide-patch.js';
+
 /** @type {Map<string, object>} */
 export const registry = new Map();
 
@@ -25,16 +27,20 @@ export const interpreter = new Proxy(new Map(), {
                 : interpreter.module(...rest);
             map.set(id, {
                 url,
-                module: import(/* webpackIgnore: true */url),
+                module: () => import(/* webpackIgnore: true */url),
                 engine: interpreter.engine.bind(interpreter),
             });
         }
         const { url, module, engine } = map.get(id);
-        return (config, baseURL) =>
-            module.then((module) => {
+        return async (config, baseURL) => {
+            if (config.experimental_create_proxy === 'auto') {
+                patch();
+            }
+            return module().then((module) => {
                 configs.set(id, config);
                 return engine(module, config, url, baseURL);
             });
+        };
     },
 });
 /* c8 ignore stop */
@@ -50,9 +56,10 @@ const register = (interpreter) => {
 //:RUNTIMES
 import dummy from './interpreter/dummy.js';
 import micropython from './interpreter/micropython.js';
+import pyodide_patch from './interpreter/pyodide-patch.js';
 import pyodide from './interpreter/pyodide.js';
 import ruby_wasm_wasi from './interpreter/ruby-wasm-wasi.js';
 import wasmoon from './interpreter/wasmoon.js';
 import webr from './interpreter/webr.js';
-for (const interpreter of [dummy, micropython, pyodide, ruby_wasm_wasi, wasmoon, webr])
+for (const interpreter of [dummy, micropython, pyodide_patch, pyodide, ruby_wasm_wasi, wasmoon, webr])
     register(interpreter);
diff --git a/package.json b/package.json
@@ -96,6 +96,6 @@
         "to-json-callback": "^0.1.1"
     },
     "worker": {
-        "blob": "sha256-2/bb462uv7euExej8laG8WSNLNVDCWz5ZQmCyayyAGs="
+        "blob": "sha256-+sGDLtv2hVsnU+g72b4LNukOBKJ6rACYVNp4kkAAKfQ="
     }
 }
diff --git a/test/raw/converter.js b/test/raw/converter.js
@@ -1,4 +1,5 @@
-import { symbol } from 'https://esm.run/@ungap/serialization-registry';
+import { symbol } from 'https://esm.run/@ungap/serialization-registry@0.2.1';
+
 
 const { construct } = Reflect;
 const { defineProperty, fromEntries } = Object;
diff --git a/test/raw/micropython/index.html b/test/raw/micropython/index.html
@@ -4,22 +4,21 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <script type="module">
-      import { serialize } from 'https://esm.run/@ungap/serialization-registry';
+      import { serialize } from 'https://esm.run/@ungap/serialization-registry@0.2.1';
       import '../converter.js';
 
       globalThis.test = arg => {
-        console.log(...serialize(arg));
+        document.body.textContent = 'test';
+        document.body.addEventListener('click', serialize(arg));
+        console.log(serialize(arg) === arg);
       };
 
       const base = 'https://cdn.jsdelivr.net/npm/@micropython/micropython-webassembly-pyscript@latest';
       const { loadMicroPython } = await import(`${base}/micropython.mjs`);
       const interpreter = await loadMicroPython({ url: `${base}/micropython.wasm` });
-      const { textContent } = document.querySelector('script[type=micropython]');
-      interpreter.runPythonAsync(textContent);
-    </script>
-    <script type="micropython" async>
-      import js
-      js.test([{'a': 123}, {'a': 456}])
+      const { src } = document.querySelector('script[type=micropython]');
+      interpreter.runPythonAsync(await fetch(src).then(r => r.text()));
     </script>
+    <script type="micropython" src="../test.py"></script>
   </head>
 </html>
diff --git a/test/raw/pyodide/index.html b/test/raw/pyodide/index.html
@@ -4,22 +4,21 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <script type="module">
-      import { serialize } from 'https://esm.run/@ungap/serialization-registry';
+      import { serialize } from 'https://esm.run/@ungap/serialization-registry@0.2.1';
       import '../converter.js';
 
       globalThis.test = arg => {
-        console.log(...serialize(arg));
+        document.body.textContent = 'test';
+        document.body.addEventListener('click', serialize(arg));
+        console.log(serialize(arg) === arg);
       };
 
       const base = 'https://cdn.jsdelivr.net/npm/pyodide@latest';
       const { loadPyodide } = await import(`${base}/pyodide.mjs`);
       const interpreter = await loadPyodide();
-      const { textContent } = document.querySelector('script[type=pyodide]');
-      interpreter.runPythonAsync(textContent);
-    </script>
-    <script type="pyodide" async>
-      import js
-      js.test([{'a': 123}, {'a': 456}])
+      const { src } = document.querySelector('script[type=pyodide]');
+      interpreter.runPythonAsync(await fetch(src).then(r => r.text()));
     </script>
+    <script type="pyodide" src="../test.py"></script>
   </head>
 </html>
diff --git a/test/raw/test.py b/test/raw/test.py
@@ -0,0 +1,6 @@
+import js
+
+def cb(e):
+  print(e.type)
+
+js.test(cb)

Original file line number	Diff line number	Diff line change
`@@ -96,6 +96,6 @@`
`96`	`96`	`"to-json-callback": "^0.1.1"`
`97`	`97`	`},`
`98`	`98`	`"worker": {`
`99`		`- "blob": "sha256-2/bb462uv7euExej8laG8WSNLNVDCWz5ZQmCyayyAGs="`
	`99`	`+ "blob": "sha256-+sGDLtv2hVsnU+g72b4LNukOBKJ6rACYVNp4kkAAKfQ="`
`100`	`100`	`}`
`101`	`101`	`}`
-Original file line number
+Diff line change
@@ @@ -1,4 +1,5 @@ @@
 -import { symbol } from 'https://esm.run/@ungap/serialization-registry';
 +import { symbol } from 'https://esm.run/@ungap/[email protected]';
++
 const { construct } = Reflect;
 const { defineProperty, fromEntries } = Object;