(0 , reaction.fn) is not a function in update_reaction

[gyzerok]

Describe the bug

After we've updated to the latest 5.34.3 from 5.33.19 we are getting lots of the following errors.

Unfortunately we haven't been able to understand what is leading to this and the error stacks in our error collecting system are limited to the ones on the screenshot.

I know that reproduction would be much better than a screenshot, but hopefully knowing what changed between versions and having context about svelte internals could still help you guess what it could be connected to.

Reproduction

Have no idea even where to begin searching, our system is somewhat big. But will return back if some more useful info is found.

Logs

System Info

svelte: 5.34.3

Severity

annoyance

[mcullifer]

I'm experiencing this as well

[sukeshpabolu]

please provide minimal reproduction

[dummdidumm]

If you can't provide a minimum reproduction, can you check in which version this bug was introduced?

[gyzerok]

@dummdidumm I've downgraded us to 5.34.2 in production and the errors are gone. Looks like the bug was introduced in the 5.34.3. It was also my suspicion from the changelogs, so that confirms it.

[sukeshpabolu]

@dummdidumm I've downgraded us to 5.34.2 in production and the errors are gone. Looks like the bug was introduced in the 5.34.3. It was also my suspicion from the changelogs, so that confirms it.

This doesn't help. A proper reproduction helps the maintainers catch the root cause.

[elliott-with-the-longest-name-on-github]

@sukeshpabolu he's responding to @dummdidumm's request for information. Simon is on the core team of maintainers. Sometimes it's prohibitively difficult to find a minimal reproduction; sometimes users don't have time to do so. We greatly prefer when they do, but would rather hear about the problem either way, even if it means we have to close some invalid issues. We appreciate your effort to help but repeatedly asking for a reproduction without doing anything else to help is distracting and unhelpful.

[gyzerok]

Actually I'd gladly provide a reproduction, but unfortunately so far I've seen these errors only in the external logs and never was able to hit one in the console. Without it the problem is - I don't know where to start investigating. I clicked through various places of our UI without any success so far.

[mcullifer]

I'm still trying to figure out a minimal reproduction. In my case it's happening with tooltips in Svelte Floating UI. It seems like it has to do with transitions inside of an {#if} block in some way. Specifically it seems to revolve around the hover hook. I've found that removing the transition makes the error go away.

I haven't pinned it down exactly yet, but it seems like it could be related to a nested $effect() that references a bound element inside that if block. And perhaps the transition is causing an issue since it kind of delays it?

My component code looks something like this

<div
  bind:this={floating.elements.reference}
  {...interactions.getReferenceProps()}
  class={referenceClass}
>
  {@render reference()}
</div>
{#if open}
  <div bind:this={floating.elements.floating}>
    <div transition:scale={{ easing: cubicOut, duration: 150 }} class="drop-shadow-lg">
      {@render children()}
    </div>
  </div>
{/if}

When the first element is hovered open = true. Then internally the floating ui library uses that bound element to position the tooltip. I use a nested div with the transition so that the content could have the transition effect. If I don't do it this way it visually looks really weird as it's doing the transition at the same time the library is positioning the tooltip. It doesn't have to do with {@render children()}, commenting that out the error still happens when hovering on and off quickly, even with nothing appearing visually.

Still working on a minimal reproduction without using the library though, but I'm leaning on it being related to the nested effect somewhere in the hover hook I linked.

UPDATE: Another fix besides removing the transition was to surround it in {#await tick()}

{#if open}
  <div bind:this={floating.elements.floating}>
    {#await tick() then}
      <div transition:scale={{ easing: cubicOut, duration: 150 }} class="drop-shadow-lg">
        {@render children()}
      </div>
    {/await}
  </div>
{/if}