py-on* event handler code is being executed at load time

[JeffersGlass]

Checklist

• I added a descriptive title
• I searched for other issues and couldn't find a solution or duplication
• I already searched in Google and didn't find any good information or help

What happened?

Py-event handler code being executed at page-load, which differs from Javascript in which the code is only executed when the event is received. i.e, in JS one would write <button onClick="foo()">, but in PysScript one would currently write <button py-onClick="foo"> This makes it the syntax for passing arguments to event functions different from Javascript in an unintuitive way.

Consider the following examples, first Javascipt (JSFiddle), then in PyScript (JSFiddle), which I think the user would expect to do the same thing. (You made need to re-save them to get the JS to run):

// Javascript
<button class="submit" id="hello" type="submit" onClick="sayHello('Jeff')">Say Hi</button>
<div id= "greeting"></div>
<script>
    function sayHello(name) {
        document.getElementById('greeting').innerHTML = "Hello, " + name
    }
</script>

//PyScript
<button class="submit" id="hello" type="submit" py-onClick="sayHello('Jeff')">Say Hi</button>
<div id="greeting"></div>
<py-script>
    def sayHello(name):
        Element("greeting").write(f"Hello, {name}")
</py-script>

The problem is, these two do not do the same thing. The py-onClick code is executed immediately on page-load, as the value of the py-on* attribute is evaluated directly.

After the page loads and the PyScript runtime initializes:

Proposed Solution

I suggest changing the behavior of py-on* events to match the Javascript syntax.

What browsers are you seeing the problem on? (if applicable)

No response

Console info

No response

Additional Context

This was spotted by user mark.d.lattimore on the Anaconda forums.

[marimeireles]

Hey @fpliger, bringing your attention to this because it's a breaking change.
If I understand it correctly this behavior is wrong and we should change it to match JS. Thanks to @JeffersGlass there's a #686 opened for that.
If you agree with this I can rebase and merge it.
Thanks!

[fpliger]

Yup, agree PyScript should not surprise [JS] users. +1

That said, the only issue with the fix is that it'll break previous code... We could use a deprecation cycle here. Iirc, the py-on* events were not included in the latest release. If not, we could add this correct behaviour only to these attributes and deprecate pys-on on the next release and add a deprecation warning when users use pys-on in favor to py-on.

[JeffersGlass]

Makes sense to me - and yeah it looks like the py-on* events were added in f2955d, a couple days after the 2022.06.1 release.

I'll adjust the PR to change the behavior for the py-on events, but leave it unchanged (but deprecated) for pys-on events and use the warning to point them to the py-on style.