Skip to content

Commit acead5e

Browse files
WebReflectionWebReflection
committed
Fix #66 - Use new hooks for all smoke tests and docs
1 parent 35e0ea6 commit acead5e

File tree

7 files changed

+84
-60
lines changed

7 files changed

+84
-60
lines changed

‎docs/README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -424,7 +424,7 @@ The *core* module itself exposes two methods to do so:
424424

425425
| name | example | behavior |
426426
| :------------ | :------------------------ | :--------|
427-
| define | `define('mpy', options)` | Register once a `<script type="mpy">`, if it's a string, and a counter `<mpy-script>` selector that will bootstrap and handle all nodes in the page that match such selectors. If the `type` is either `null` or `undefined`, no type will exist but the interpreter will be bootstrapped anyway, hence available once `options.onInterpreterReady(wrap)` is invoked (without any `element` reference). The available `options` are described after this table. |
427+
| define | `define('mpy', options)` | Register once a `<script type="mpy">`, if it's a string, and a counter `<mpy-script>` selector that will bootstrap and handle all nodes in the page that match such selectors. If the `type` is either `null` or `undefined`, no type will exist but the interpreter will be bootstrapped anyway, hence available once `options.hooks.main.onReady(wrap)` is invoked (without any `element` reference). The available `options` are described after this table. |
428428
| whenDefined | `whenDefined('mpy')` | Return a promise that will be resolved once the custom `mpy` script will be available, returning an *interpreter* wrapper once it will be fully ready. |
429429

430430
```js
@@ -606,7 +606,7 @@ Whenever a *non-custom* script is going to run some code, or whenever *any worke
606606

607607
### Custom Types on Main
608608

609-
The reason this event is not automatically dispatched on custom type elements or scripts is that these will have their own `onInterpreterReady` hook to eventually do more before desiring, or needing, to notify the "*readiness*" of such custom element and, in case of wanting the event to happen, this is the tiny boilerplate needed to simulate otherwise non-custom type events:
609+
The reason this event is not automatically dispatched on custom type elements or scripts is that these will have their own `options.hooks.main.onReady` hook to eventually do more before desiring, or needing, to notify the "*readiness*" of such custom element and, in case of wanting the event to happen, this is the tiny boilerplate needed to simulate otherwise non-custom type events:
610610

611611
```js
612612
// note: type === 'py' or the defined type

‎test/custom.html‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,16 +17,20 @@
1717
define('mpy', {
1818
config,
1919
interpreter: 'micropython',
20-
onInterpreterReady(wrap, element) {
21-
console.assert(
22-
JSON.stringify(wrap.config) === JSON.stringify(config),
23-
'not the same config'
24-
);
25-
wrap.run(element.textContent);
26-
const button = document.createElement('button');
27-
button.setAttribute('mpy-click', 'all_good');
28-
button.textContent = 'runtime';
29-
document.body.append(button);
20+
hooks: {
21+
main: {
22+
onReady(wrap, element) {
23+
console.assert(
24+
JSON.stringify(wrap.config) === JSON.stringify(config),
25+
'not the same config'
26+
);
27+
wrap.run(element.textContent);
28+
const button = document.createElement('button');
29+
button.setAttribute('mpy-click', 'all_good');
30+
button.textContent = 'runtime';
31+
document.body.append(button);
32+
}
33+
}
3034
}
3135
});
3236
</script>

‎test/events.html‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -19,14 +19,18 @@
1919
import { define } from "/core.js";
2020
define("mpy", {
2121
interpreter: 'micropython',
22-
onInterpreterReady({ run, type }, element) {
23-
element.dispatchEvent(
24-
new CustomEvent(`${type}:ready`, {
25-
bubbles: true,
26-
detail: { worker: false },
27-
})
28-
);
29-
run(element.textContent);
22+
hooks: {
23+
main: {
24+
onReady({ run, type }, element) {
25+
element.dispatchEvent(
26+
new CustomEvent(`${type}:ready`, {
27+
bubbles: true,
28+
detail: { worker: false },
29+
})
30+
);
31+
run(element.textContent);
32+
}
33+
}
3034
}
3135
});
3236
</script>

‎test/interpreter.html‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,15 @@
1313
interpreter: 'micropython',
1414
// version: '1.20.0-295',
1515
// version: 'https://cdn.jsdelivr.net/npm/@micropython/micropython-webassembly-pyscript@1.20.0-295/micropython.mjs',
16-
onInterpreterReady({ run }, element) {
17-
run(`
18-
import sys
19-
print(sys.version)
20-
`);
16+
hooks: {
17+
main: {
18+
onReady({ run }, element) {
19+
run(`
20+
import sys
21+
print(sys.version)
22+
`);
23+
}
24+
}
2125
}
2226
});
2327
</script>

‎test/plugins/index.html‎

Lines changed: 25 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -18,30 +18,34 @@
1818
define("mpy", {
1919
interpreter: "micropython",
2020
config: "../fetch.toml",
21-
async onInterpreterReady(micropython, element) {
22-
console.log(micropython);
23-
// Somehow this doesn't work in MicroPython
24-
micropython.io.stdout = (message) => {
25-
console.log("🐍", micropython.type, message);
26-
};
27-
micropython.io.stderr = (message) => {
28-
console.error("⚠️🐍", message);
29-
};
21+
hooks: {
22+
main: {
23+
async onReady(micropython, element) {
24+
console.log(micropython);
25+
// Somehow this doesn't work in MicroPython
26+
micropython.io.stdout = (message) => {
27+
console.log("🐍", micropython.type, message);
28+
};
29+
micropython.io.stderr = (message) => {
30+
console.error("⚠️🐍", message);
31+
};
3032

31-
micropython.run(element.textContent);
32-
element.replaceChildren("See console ->");
33-
element.style.display = "block";
33+
micropython.run(element.textContent);
34+
element.replaceChildren("See console ->");
35+
element.style.display = "block";
3436

35-
const button = document.createElement("button");
36-
button.textContent = "click";
37-
button.setAttribute("mpy-click", "test_click");
38-
document.body.append(button);
37+
const button = document.createElement("button");
38+
button.textContent = "click";
39+
button.setAttribute("mpy-click", "test_click");
40+
document.body.append(button);
3941

40-
const error = document.createElement("button");
41-
error.textContent = "error";
42-
error.setAttribute("mpy-click", "test_error");
43-
document.body.append(error);
44-
},
42+
const error = document.createElement("button");
43+
error.textContent = "error";
44+
error.setAttribute("mpy-click", "test_error");
45+
document.body.append(error);
46+
}
47+
}
48+
}
4549
});
4650
</script>
4751
</head>

‎test/plugins/lua.html‎

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -16,15 +16,19 @@
1616
import { define } from "polyscript";
1717
define("lua", {
1818
interpreter: "wasmoon",
19-
async onInterpreterReady(wasmoon, element) {
20-
// Somehow this doesn't work in Wasmoon
21-
wasmoon.io.stdout = (message) => {
22-
console.log("🌑", wasmoon.type, message);
23-
};
24-
wasmoon.run(element.textContent);
25-
element.replaceChildren("See console ->");
26-
element.style.display = "block";
27-
},
19+
hooks: {
20+
main: {
21+
async onReady(wasmoon, element) {
22+
// Somehow this doesn't work in Wasmoon
23+
wasmoon.io.stdout = (message) => {
24+
console.log("🌑", wasmoon.type, message);
25+
};
26+
wasmoon.run(element.textContent);
27+
element.replaceChildren("See console ->");
28+
element.style.display = "block";
29+
},
30+
}
31+
}
2832
});
2933
</script>
3034
</head>

‎test/queue/index.html‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,15 @@
88
import { define } from "../../core.js";
99
define("mpy", {
1010
interpreter: "micropython",
11-
async onInterpreterReady({ run }, element) {
12-
let code = element.textContent;
13-
if (element.src)
14-
code = await fetch(element.src).then(b => b.text());
15-
run(code);
11+
hooks: {
12+
main: {
13+
async onReady({ run }, element) {
14+
let code = element.textContent;
15+
if (element.src)
16+
code = await fetch(element.src).then(b => b.text());
17+
run(code);
18+
}
19+
}
1620
}
1721
});
1822
</script>

0 commit comments

Comments
 (0)