PyDom compatibility with MicroPython (#1954)

* fix pydom example

* fix the pydom test example to use a python syntax that works with MicroPython by replacing datetime

* add note about capturing errors importing when

* patch event_handler to handle compat with micropython

* turn pyweb into a package and remove hack to make pydom a sort of module with an ugly hack

* add pydom example using micropython

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

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

* fix select element test

* change pydom test page to let pytest tests load it properly

* add missing folders to test dev server so it can run examples in the manual tests folder

* add pydom tests to the test suite as integration tests

* lint

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

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

* improve fixes in event_handling

* change when decorator to actually dynamically fail in micropython and support handlers with or without arguments

* simplify when decorator code

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

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

* add type declaration back for the MP use case

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

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

* removed code to access pydom get index as I can't think of any proper use case

* remove old commented hack to replace pydom module with class

* fix examples title

* precommit checks

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

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

---------

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
This commit is contained in:
Fabio Pliger
2024-01-30 14:30:16 -05:00
committed by GitHub
parent 3ff0f84391
commit bcaab0eb93
12 changed files with 149 additions and 36 deletions

View File

@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PyScript Next Plugin</title>
<title>PyDom Example</title>
<link rel="stylesheet" href="../dist/core.css">
<script type="module" src="../dist/core.js"></script>
</head>

View File

@@ -1,26 +1,32 @@
import random
import time
from datetime import datetime as dt
from pyscript import display
from pyscript import display, when
from pyweb import pydom
from pyweb.base import when
@when("click", "#just-a-button")
def on_click(event):
print(f"Hello from Python! {dt.now()}")
display(f"Hello from Python! {dt.now()}", append=False, target="result")
def on_click():
try:
timenow = dt.now()
except NotImplementedError:
# In this case we assume it's not implemented because we are using MycroPython
tnow = time.localtime()
tstr = "{:02d}/{:02d}/{:04d} {:02d}:{:02d}:{:02d}"
timenow = tstr.format(tnow[2], tnow[1], tnow[0], *tnow[2:])
display(f"Hello from PyScript, time is: {timenow}", append=False, target="result")
@when("click", "#color-button")
def on_color_click(event):
print("1")
btn = pydom["#result"]
print("2")
btn.style["background-color"] = f"#{random.randrange(0x1000000):06x}"
def reset_color():
@when("click", "#color-reset-button")
def reset_color(*args, **kwargs):
pydom["#result"].style["background-color"] = "white"

View File

@@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PyDom Example (MicroPython)</title>
<link rel="stylesheet" href="../dist/core.css">
<script type="module" src="../dist/core.js"></script>
</head>
<body>
<script type="mpy" src="pydom.py"></script>
<button id="just-a-button">Click For Time</button>
<button id="color-button">Click For Color</button>
<button id="color-reset-button">Reset Color</button>
<div id="result"></div>
</body>
</html>

View File

@@ -1,6 +1,6 @@
<html lang="en">
<head>
<title>PyperCard PyTest Suite</title>
<title>PyDom Test Suite</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="../../dist/core.css">
@@ -32,7 +32,7 @@
</style>
</head>
<body>
<script type="py" src="run_tests.py" config="tests.toml"></script>
<script type="py" src="./run_tests.py" config="./tests.toml"></script>
<h1>pyscript.dom Tests</h1>
<p>You can pass test parameters to this test suite by passing them as query params on the url.

View File

@@ -336,7 +336,7 @@ class TestSelect:
assert select.options[0].html == "Option 1"
# WHEN we add another option (blank this time)
select.options.add()
select.options.add("")
# EXPECT the select element to have 2 options
assert len(select.options) == 2