Skip to content

Svelte 5: select bindings broken when options rendered via #each loop #9412

@theodorejb

Description

@theodorejb

Describe the bug

When a select element value binding doesn't match an option, no option should be selected. This works correctly in Svelte 4 and is tested in tests/runtime-legacy/samples/binding-select-unmatched. However, it is broken in Svelte 5 when the option elements are rendered from an array via an #each loop (rather than hardcoded like they are in the test). The first option incorrectly appears selected, even though its value doesn't match the select element value binding.

Secondly, when a select element value binding is initially undefined, then the first non-disabled or selected option value should be selected (and the bound variable set to its value). This also works in Svelte 4, and is tested via tests/runtime-legacy/samples/binding-select-initial-value-undefined and tests/runtime-legacy/samples/binding-select-initial-value-undefined-2. However, this is likewise broken in Svelte 5 when the options are rendered via an #each loop. The expected option appears selected, but the variable bound to the select value fails to be initialized with the selected option value.

Reproduction

binding-select-unmatched broken when options rendered in each loop.

binding-select-initial-value-undefined broken when options rendered in each loop.

Logs

No response

System Info

Firefox, Chromium, Edge

Severity

blocking an upgrade

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions