fix(solid): delay ref formAction to after mount

[SirbyAlive]

Proposition to fix #195 .

According to Solid documentation https://www.solidjs.com/docs/latest/api#ref:

Refs are assigned at render time but before the elements are connected to the DOM.

In practice, this means that when the function passed to ref is called, elements are created but not attached, resulting on the HTMLFormElement being passed to formAction empty with no children.

The documentation indicates the moments the functions are evaluated:

// variable assigned directly by ref
let myDiv;

// use onMount or createEffect to read after connected to DOM
onMount(() => console.log(myDiv));

<div ref={myDiv} />

// Or, callback function (called before connected to DOM)
<div ref={el => console.log(el)} />

From that and some tests it appear that:

• When ref is a pointer, it is accessible in onMount or createEffect are called after it is attached to the DOM.
• When ref is a function, it is called before the DOM is attached.
• When ref is a function, onMount and createEffect are first called before it is attached to the DOM.

As shown by this trace:

onMount - node.childElementCount = undefined
createEffect - node.childElementCount = undefined
ref - node.childElementCount = 0
createEffect - node.childElementCount = 1

Which led to my current proposition to proxy the ref into a signal observed in an effect. So Felte is initialized onceDOM is ready to be parsed. It does feel hacky though...

[vercel[bot]]

Someone is attempting to deploy a commit to a Personal Account owned by @pablo-abc on Vercel.

@pablo-abc first needs to authorize it.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
felte-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 24, 2024 4:50pm