svelte icon indicating copy to clipboard operation
svelte copied to clipboard

[Svelte 4] bind:this is undefined when running action of child until all children initialize

Open BLucky-gh opened this issue 6 months ago • 0 comments

Describe the bug

this should be similar to #12673 but that one is about svelte 5, this is svelte 4, so I can't easily just upgrade to the prerelease version of svelte 5 the fix got applied to.

#12673 also was about the action and bind:this being on the same element, but here it's a child element having the action, while the parent element is being bound.

I do acknowledge that it might be intentional with the intention to not bind it until it's fully initialized to uphold invariants, among other things, but nothing of that sort is mentioned in the docs so I figured I'd mention it here but marking it as annoyance instead of "blocking usage of svelte". also in most cases one can just directly get the parent from the element ref you get as the param of the action which further lowers the priority of this issue

EDIT: I just realized that in event handlers like <svelte:window on:resize={()=>{}}/> there's no option to "just get the parent"

Reproduction

https://svelte.dev/repl/9ed2feb6cdc64ca2a795ee98f89c4a7d?version=4.2.18

the children already exist, and thus the parent also exist, but thing does not get bound until its children are done intializing.

Logs

No response

System Info

System:
    OS: macOS 14.0
    CPU: (8) arm64 Apple M2
    Memory: 68.31 MB / 8.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.5.1 - /opt/homebrew/bin/node
    npm: 10.8.2 - /opt/homebrew/bin/npm
    pnpm: 9.6.0 - /opt/homebrew/bin/pnpm
    bun: 1.1.21 - /opt/homebrew/bin/bun
  Browsers:
    Chrome: 127.0.6533.99
    Safari: 17.0
  npmPackages:
    svelte: ^4.2.18 => 4.2.18

Severity

annoyance

BLucky-gh avatar Aug 07 '24 21:08 BLucky-gh