pyscript: [BUG] pys-onClick attribute does not work, when element has no id

Describe the bug When you whant to use the pys-onClick attribute to define a python function as the click listener, and the html element has no id, it does not work.

Error:

pyodide.asm.js:14 Uncaught (in promise) PythonError: Traceback (most recent call last):
  File "/lib/python3.10/asyncio/futures.py", line 201, in result
    raise self._exception
  File "/lib/python3.10/asyncio/tasks.py", line 232, in __step
    result = coro.send(None)
  File "/lib/python3.10/site-packages/_pyodide/_base.py", line 500, in eval_code_async
    await CodeRunner(
  File "/lib/python3.10/site-packages/_pyodide/_base.py", line 351, in run_async
    coroutine = eval(self.code, globals, locals)
  File "<exec>", line 1, in <module>
  File "<exec>", line 141, in element
JsException: SyntaxError: Failed to execute 'querySelector' on 'Document': '#' is not a valid selector.

To Reproduce Using:

  • Chrome Version 101.0.4951.67
  • Firefox Version 100.0 (64-bit)

Use this html and click on the button:

<!DOCTYPE html>
<html lang="en">
<head>
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>

<body>
	<py-script>
from js import console
def clicked(*args, **kwargs):
	console.log("clicked")
	</py-script>
	
	<button pys-onClick="clicked">Click me!</button>
	
</body>
</html>

Expected behavior The message “clicked” should be logged to the console. With an id it works:

<!DOCTYPE html>
<html lang="en">
<head>
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>

<body>
	<py-script>
from js import console
def clicked(*args, **kwargs):
	console.log("clicked")
	</py-script>
	
	<button id="click-button" pys-onClick="clicked">Click me!</button>
	
</body>
</html>

EDIT: Added chrome, firefox version number

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Reactions: 1
  • Comments: 35 (28 by maintainers)

Most upvoted comments

@fpliger I created a PR

I’m actually getting this with hello_world.html from a checkout. The checkout worked a few days ago. I can’t spot any changes in the commits that might have caused it. Still pointing to 0.20 of Pyodide.

Great question. I think it definitely makes sense for the components that can execute a script and are likely to be mounted. (PyConfig and PyEnv are a bit special and I don’t think it’s necessary). With that mind, that list above should probably look like this:

Component Has checkId()
PyBox [ ]
PyButton [x ]
PyConfig [ ]
PyEnv [ ]
PyInputBox [x]
PyLoader [ ]
PyRepl [x]
PyScript [x]
PyTitle [ ]

Yeah I would pick it up @fpliger

@fpliger @yannickfunk Fixed it for me.

Ok, let me test it locally.