Merge pull request #105 from pyscript/storage

Added a storage utility

Author: WebReflection

.eslintrc.json

@@ -5,7 +5,7 @@
     },
     "extends": "eslint:recommended",
     "parserOptions": {
-        "ecmaVersion": 12,
+        "ecmaVersion": "latest",
         "sourceType": "module"
     },
     "ignorePatterns": ["__template.js", "xworker.js", "esm/python/*.js", "esm/3rd-party/*"],

docs/README.md

@@ -379,6 +379,7 @@ The module is registered within the interpreter as *JS* module and it offers var
 | currentScript   | `from polyscript import currentScript`   | it's an explicit, always correct, reference to the current node running the generic script code. |
 | js_modules      | `from polyscript import js_modules`      | described in the [Extra config Features](#extra-config-features) part. |
 | lazy_py_modules | `from polyscript import lazy_py_modules` | allows, only in *Python* related interpreters, and without needing static config entries, to import lazily any available module.
+| storage | `from polyscript import storage` | a utility to instantiate a named [idb-map](https://github.com/WebReflection/idb-map/#readme) that can be consumed synchronously.
 
 
 #### lazy_py_modules
@@ -393,6 +394,26 @@ The module is registered within the interpreter as *JS* module and it offers var
 </script>
 ```
 
+#### storage
+
+```html
+<script type="micropython" async>
+  from polyscript import storage
+
+  # await its loading
+  map = await storage("my-user-persistent-storage")
+
+  # just use it synchronously
+  map.set("key", "value")
+  print(map.get("key"))
+
+  # after set, delete, or clear
+  # it is possible to sync operations
+  await map.sync()
+</script>
+```
+
+
 
 ### Worker exports
 

docs/index.js

@@ -1,5 +1,6 @@
 import { dedent } from '../utils.js';
 import { io } from './_io.js';
+import Storage from '../storage.js';
 
 export const loader = new WeakMap();
 
@@ -11,6 +12,11 @@ export const registerJSModule = (interpreter, name, value) => {
             await loader.get(interpreter)(packages);
             return packages.map(name => interpreter.pyimport(name));
         };
+        value.storage = async (name) => {
+            const storage = new Storage(name);
+            await storage.sync();
+            return storage;
+        };
     }
     interpreter.registerJsModule(name, value);
 };

docs/index.js.map

@@ -23,7 +23,7 @@ const mkdir = (FS, path) => {
 
 export default {
     type,
-    module: (version = '1.23.0') =>
+    module: (version = '1.24.0-preview-44') =>
         `https://cdn.jsdelivr.net/npm/@micropython/micropython-webassembly-pyscript@${version}/micropython.mjs`,
     async engine({ loadMicroPython }, config, url, baseURL) {
         const { stderr, stdout, get } = stdio({

esm/interpreter/_python.js

@@ -0,0 +1,29 @@
+import IDBMap from '@webreflection/idb-map';
+
+export default class Storage extends Map {
+  #map;
+  #queue;
+  constructor(name) {
+    super();
+    this.#map = new IDBMap(name);
+    this.#queue = this.#map.entries().then(entries => {
+      for (const [key, value] of entries)
+        this.set(key, value);
+    });
+  }
+  async sync() {
+    await this.#queue;
+  }
+  clear() {
+    this.#queue = this.#queue.then(() => this.#map.clear());
+    return super.clear();
+  }
+  delete(key) {
+    this.#queue = this.#queue.then(() => this.#map.delete(key));
+    return super.delete(key);
+  }
+  set(key, value) {
+    this.#queue = this.#queue.then(() => this.#map.set(key, value));
+    return super.set(key, value);
+  }
+}

esm/interpreter/micropython.js

@@ -2,7 +2,7 @@
     "imports": {
         "http://pyodide": "./test/mocked/pyodide.mjs",
         "https://cdn.jsdelivr.net/pyodide/v0.26.1/full/pyodide.mjs": "./test/mocked/pyodide.mjs",
-        "https://cdn.jsdelivr.net/npm/@micropython/micropython-webassembly-pyscript@1.23.0/micropython.mjs": "./test/mocked/micropython.mjs",
+        "https://cdn.jsdelivr.net/npm/@micropython/micropython-webassembly-pyscript@1.24.0-preview-44/micropython.mjs": "./test/mocked/micropython.mjs",
         "./3rd-party/toml.js": "./test/mocked/toml.mjs"
     }
 }

esm/storage.js

@@ -1,6 +1,6 @@
 {
     "name": "polyscript",
-    "version": "0.12.15",
+    "version": "0.13.1",
     "description": "PyScript single core to rule them all",
     "main": "./cjs/index.js",
     "types": "./types/polyscript/esm/index.d.ts",
@@ -80,6 +80,7 @@
         "@ungap/structured-clone": "^1.2.0",
         "@ungap/with-resolvers": "^0.1.0",
         "@webreflection/fetch": "^0.1.5",
+        "@webreflection/idb-map": "^0.2.0",
         "basic-devtools": "^0.1.6",
         "codedent": "^0.1.2",
         "coincident": "^1.2.3",
@@ -90,6 +91,6 @@
         "to-json-callback": "^0.1.1"
     },
     "worker": {
-        "blob": "sha256-pWERQSHp3qDvCx7LVz9I3QMz9+k3IwDLVMixPMRxxI4="
+        "blob": "sha256-QYGr9ma1eAghLgOKOxC9Tz8PvKkbO4gurbzJ1bac/xM="
     }
 }

node.importmap

@@ -29,6 +29,7 @@ const patchFetch = (callback) => {
 const { parseHTML } = require("linkedom");
 const { document, window, CustomEvent } = parseHTML("...");
 
+globalThis.indexedDB = { open: () => ({}) };
 globalThis.document = document;
 globalThis.Element = window.Element;
 globalThis.CustomEvent = CustomEvent;

package-lock.json

@@ -5,5 +5,5 @@
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <title>polyscript integration tests</title>
     </head>
-    <body><ul><li><strong>micropython</strong><ul><li><a href="/test/integration/interpreter/micropython/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/micropython/config-json.html">config-json</a></li><li><a href="/test/integration/interpreter/micropython/config-object.html">config-object</a></li><li><a href="/test/integration/interpreter/micropython/current-script.html">current-script</a></li><li><a href="/test/integration/interpreter/micropython/custom-hooks.html">custom-hooks</a></li><li><a href="/test/integration/interpreter/micropython/fetch.html">fetch</a></li><li><a href="/test/integration/interpreter/micropython/interpreter-local.html">interpreter-local</a></li><li><a href="/test/integration/interpreter/micropython/mip.html">mip</a></li><li><a href="/test/integration/interpreter/micropython/no-type.html">no-type</a></li><li><a href="/test/integration/interpreter/micropython/ready-done.html">ready-done</a></li><li><a href="/test/integration/interpreter/micropython/worker-attribute.html">worker-attribute</a></li><li><a href="/test/integration/interpreter/micropython/worker-bad.html">worker-bad</a></li><li><a href="/test/integration/interpreter/micropython/worker-empty-attribute.html">worker-empty-attribute</a></li><li><a href="/test/integration/interpreter/micropython/worker-error.html">worker-error</a></li><li><a href="/test/integration/interpreter/micropython/worker-lua.html">worker-lua</a></li><li><a href="/test/integration/interpreter/micropython/worker-tag.html">worker-tag</a></li><li><a href="/test/integration/interpreter/micropython/worker-window.html">worker-window</a></li><li><a href="/test/integration/interpreter/micropython/worker.html">worker</a></li></ul><li><strong>pyodide</strong><ul><li><a href="/test/integration/interpreter/pyodide/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/pyodide/button.html">button</a></li><li><a href="/test/integration/interpreter/pyodide/config-json.html">config-json</a></li><li><a href="/test/integration/interpreter/pyodide/fetch.html">fetch</a></li><li><a href="/test/integration/interpreter/pyodide/sync.html">sync</a></li><li><a href="/test/integration/interpreter/pyodide/worker-error.html">worker-error</a></li><li><a href="/test/integration/interpreter/pyodide/worker-transform.html">worker-transform</a></li><li><a href="/test/integration/interpreter/pyodide/worker.html">worker</a></li></ul><li><strong>ruby-wasm-wasi</strong><ul><li><a href="/test/integration/interpreter/ruby-wasm-wasi/bootstrap.html">bootstrap</a></li></ul><li><strong>wasmoon</strong><ul><li><a href="/test/integration/interpreter/wasmoon/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/wasmoon/worker.html">worker</a></li></ul><li><strong>webr</strong><ul><li><a href="/test/integration/interpreter/webr/just-click.html">just-click</a></li></ul></ul></body>
+    <body><ul><li><strong>micropython</strong><ul><li><a href="/test/integration/interpreter/micropython/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/micropython/config-json.html">config-json</a></li><li><a href="/test/integration/interpreter/micropython/config-object.html">config-object</a></li><li><a href="/test/integration/interpreter/micropython/current-script.html">current-script</a></li><li><a href="/test/integration/interpreter/micropython/custom-hooks.html">custom-hooks</a></li><li><a href="/test/integration/interpreter/micropython/fetch.html">fetch</a></li><li><a href="/test/integration/interpreter/micropython/interpreter-local.html">interpreter-local</a></li><li><a href="/test/integration/interpreter/micropython/mip.html">mip</a></li><li><a href="/test/integration/interpreter/micropython/no-type.html">no-type</a></li><li><a href="/test/integration/interpreter/micropython/ready-done.html">ready-done</a></li><li><a href="/test/integration/interpreter/micropython/storage.html">storage</a></li><li><a href="/test/integration/interpreter/micropython/worker-attribute.html">worker-attribute</a></li><li><a href="/test/integration/interpreter/micropython/worker-bad.html">worker-bad</a></li><li><a href="/test/integration/interpreter/micropython/worker-empty-attribute.html">worker-empty-attribute</a></li><li><a href="/test/integration/interpreter/micropython/worker-error.html">worker-error</a></li><li><a href="/test/integration/interpreter/micropython/worker-lua.html">worker-lua</a></li><li><a href="/test/integration/interpreter/micropython/worker-tag.html">worker-tag</a></li><li><a href="/test/integration/interpreter/micropython/worker-window.html">worker-window</a></li><li><a href="/test/integration/interpreter/micropython/worker.html">worker</a></li></ul><li><strong>pyodide</strong><ul><li><a href="/test/integration/interpreter/pyodide/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/pyodide/button.html">button</a></li><li><a href="/test/integration/interpreter/pyodide/config-json.html">config-json</a></li><li><a href="/test/integration/interpreter/pyodide/fetch.html">fetch</a></li><li><a href="/test/integration/interpreter/pyodide/sync.html">sync</a></li><li><a href="/test/integration/interpreter/pyodide/worker-error.html">worker-error</a></li><li><a href="/test/integration/interpreter/pyodide/worker-transform.html">worker-transform</a></li><li><a href="/test/integration/interpreter/pyodide/worker.html">worker</a></li></ul><li><strong>ruby-wasm-wasi</strong><ul><li><a href="/test/integration/interpreter/ruby-wasm-wasi/bootstrap.html">bootstrap</a></li></ul><li><strong>wasmoon</strong><ul><li><a href="/test/integration/interpreter/wasmoon/bootstrap.html">bootstrap</a></li><li><a href="/test/integration/interpreter/wasmoon/worker.html">worker</a></li></ul><li><strong>webr</strong><ul><li><a href="/test/integration/interpreter/webr/just-click.html">just-click</a></li></ul></ul></body>
 </html>

package.json

@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script type="module">
+        import { init } from '../utils.js';
+        init('micropython');
+    </script>
+</head>
+<body>
+  <script type="micropython" async>
+    from polyscript import storage
+
+    store = await storage("@polyscript/storage")
+
+    # just a devtools console check
+    # it is true on refresh
+    print(store.get("main") == True, store.size)
+
+    store.set("main", True)
+
+    import js
+    js.document.documentElement.classList.add(f"main")
+  </script>
+  <script type="micropython" worker async>
+    from polyscript import xworker, storage
+
+    store = await storage("@polyscript/storage")
+
+    # just a devtools console check
+    # it is true on refresh
+    print(store.get("worker") == True, store.size)
+
+    store.set("worker", True)
+
+    xworker.window.document.documentElement.classList.add(f"worker")
+  </script>
+</body>
+</html>

test/index.js

@@ -52,4 +52,9 @@ module.exports = (playwright, baseURL) => {
     test('MicroPython local intepreter', python.localInterpreter(playwright, baseURL));
 
     test('MicroPython mip', python.waitForDone(playwright, `${baseURL}/mip.html`));
+
+    test('MicroPython Storage', async ({ page }) => {
+        await page.goto(`${baseURL}/storage.html`);
+        await page.waitForSelector(`html.ready.main.worker`);
+    });
 };

test/integration.html

@@ -1 +1 @@
-1.23.0
+1.24.0-preview-44