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
This bug is a longwinded way to argue that something like this:
<script>
let element $: {element.scrollTop=0 }
</script>
<divbind:this={element}></div>
...should probably not result in element being invalidated on the "write" to scrollTop. (Or alternatively, there should be a way to opt-out of the reactivity.)
I recently ran into an infinite loop that I accidentally triggered using some code like the following:
So the infinite loop happens because it's "reading" element in the if (element) block, then "writing" to the element in the element.scrollTop = 0 part. So it calls rAF over and over again.
I found this surprising, because it didn't occur to me that elements bound with bind:this= would be reactive on "write" like this.
That said, it probably does need to be reactive on "read," since the element may or may not exist, and I imagine people are using if (element) to check for that.
Click the "increment" button, and then notice that you can't scroll the scrollable <div> anymore. You can also use the Performance profiler in DevTools to see that it's constantly running an infinite requestAnimationFrame loop.
Logs
No response
System Info
N/A, occurs in all browsers
Severity
annoyance
The text was updated successfully, but these errors were encountered:
Describe the bug
This bug is a longwinded way to argue that something like this:
...should probably not result in
element
being invalidated on the "write" toscrollTop
. (Or alternatively, there should be a way to opt-out of the reactivity.)I recently ran into an infinite loop that I accidentally triggered using some code like the following:
The problem is that this turns into:
So the infinite loop happens because it's "reading"
element
in theif (element)
block, then "writing" to the element in theelement.scrollTop = 0
part. So it callsrAF
over and over again.I found this surprising, because it didn't occur to me that elements bound with
bind:this=
would be reactive on "write" like this.That said, it probably does need to be reactive on "read," since the element may or may not exist, and I imagine people are using
if (element)
to check for that.Reproduction
Repro in the REPL
Click the "increment" button, and then notice that you can't scroll the scrollable
<div>
anymore. You can also use the Performance profiler in DevTools to see that it's constantly running an infiniterequestAnimationFrame
loop.Logs
No response
System Info
N/A, occurs in all browsers
Severity
annoyance
The text was updated successfully, but these errors were encountered: