Skip to content

checkbox bind:group doesn't play nice with duplicated values #4397

Closed
@Conduitry

Description

@Conduitry

Describe the bug
Using <input type='checkbox' bind:group={foo} value='...'> where multiple checkboxes have the same value produces wonky behavior.

Logs
None.

To Reproduce

<script>
	let foo = [];
</script>

Checked: {foo}

<hr>

<input type='checkbox' bind:group={foo} value='a'>a<br>
<input type='checkbox' bind:group={foo} value='b'>b<br>
<input type='checkbox' bind:group={foo} value='c'>c<br>
<input type='checkbox' bind:group={foo} value='d'>d<br>

<hr>

<input type='checkbox' bind:group={foo} value='a'>a<br>
<input type='checkbox' bind:group={foo} value='b'>b<br>
<input type='checkbox' bind:group={foo} value='c'>c<br>
<input type='checkbox' bind:group={foo} value='d'>d<br>

Expected behavior
It would be nice if checking/unchecking one 'a' would result in just one instance of the value being added to the array, and would also cause the other one to be checked/unchecked in sync.

Stacktraces
None.

Information about your Svelte project:
v3.18.2

Severity
Low-ish, probably.

Additional context
Came up while investigating #3680, and I consider this part to be a separate issue, unrelated to the {...spread} attributes.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions