You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Describe the bug
The call order of events for the first event handler on an element with respect to window is incorrect and does not follow the bubbling rules for events.
The bubbling order is (for example a button and the pointerdown event): button -> parent -> window
But the current version calls the event handlers in the order window -> button -> parent for the first event handler appearing in the call tree.
All following event handlers are called in the correct order.
Leptos Dependencies
leptos = { version = "0.6.6", features = ["nightly", "csr"] }
console_log = "0.2"log = "0.4"console_error_panic_hook = "0.1.7"leptos-use = "0.10.4"
For example:
Given the following code (also found here)
When clicking any button labeled CLICK, the text line next to the button should get appended by button parent window (which is the expected call order explained above)
The other text lines just get appended by window because the event handler on window is the only one called for this component.
To Reproduce
Steps to reproduce the behavior:
Click the topmost button and observe the last 3 appended words which are window button parent (wrong order)
Click any other button and observe the last 3 appended words which are button parent window (right order)
Expected behavior
Expected the first button press to behave just like the other ones: produce the text sequence button parent window
The text was updated successfully, but these errors were encountered:
I'm not sure about the distinction between "first in the tree" and the rest. I can say that events are delegated to the window by default, and that you can opt out by adding :undelegated, so for example on:pointerdown:undelegated=move |_| etc.
:undelegated does indeed fix the behavior for the first event listener. It also fixes not being able to stop_propagation() on the event (without :undelegated the event handler on window is called regardless if stop_propagation() is called or not).
Is there some documentation on :undelegated? I could not find any.
So i guess this is intended (or more undefined) behavior when mixing DOM event handlers and leptos event handlers without :undelegated?
Documenting :undelegated more clearly is definitely in the backlog of docs to be written. It is just the syntax in the view macro for adding undelegated to an event listener, but the docs that need to be added are more in the category of "when would you want to do this?"
Describe the bug
The call order of events for the first event handler on an element with respect to
window
is incorrect and does not follow the bubbling rules for events.The bubbling order is (for example a button and the
pointerdown
event):button -> parent -> window
But the current version calls the event handlers in the order
window -> button -> parent
for the first event handler appearing in the call tree.All following event handlers are called in the correct order.
Leptos Dependencies
For example:
Given the following code (also found here)
When clicking any button labeled
CLICK
, the text line next to the button should get appended bybutton parent window
(which is the expected call order explained above)The other text lines just get appended by
window
because the event handler onwindow
is the only one called for this component.To Reproduce
Steps to reproduce the behavior:
window button parent
(wrong order)button parent window
(right order)Expected behavior
Expected the first button press to behave just like the other ones: produce the text sequence
button parent window
The text was updated successfully, but these errors were encountered: