solid icon indicating copy to clipboard operation
solid copied to clipboard

Value of `<select>` is set before the children are created when using spread

Open ghalle opened this issue 1 year ago • 2 comments

Describe the bug

When using spread on a select element the value will be set before the children are created and this will cause the value to be set to an empty string (this is a browser behavior because no option match).

Your Example Website or App

https://playground.solidjs.com/anonymous/d2bf2e03-5e3b-4a9c-a5c0-37a62bbc8f9c

Steps to Reproduce the Bug or Issue

  1. Open the example
  2. Look at the result

Expected behavior

The second and third select boxes should have the same option selected.

Screenshots or Videos

No response

Platform

  • OS: Windows
  • Browser: Edge
  • Version: 113

Additional context

No response

ghalle avatar Jun 03 '23 16:06 ghalle

Thanks. I see the problem. Right DOM Expression classifies things into few categories:

  1. declarations:
  • declarations, walks
  1. expressions
  • non-reactive expressions
  • spreads
  • children
  1. dynamics
  • reactive expressions

And get inserted in that order.

Spreads... are clearly in the wrong category. Or rather they straddle both categories. The reason for their location historically was so that refs could be set before children. Moving them to dynamic suggests that even static expressions are dynamic (ie... after children). I think that is fair. Ultimately I wonder if spreads should have 2 phases. Or alternatively refs would always be set at the end. Downside of the latter is no easy pass down. The former seems better but it will take a little bit of work. A quick fix here will break something else. So this will probably need a minor or major release.

ryansolid avatar Jun 26 '23 17:06 ryansolid

Having similar problem when trying to assign the value of each option to a TS enum

westbrma avatar Jun 07 '24 10:06 westbrma