fix: fixes sveltejs/svelte#8214 `bind:group` to `undefined` (#8215)

* fixes sveltejs/svelte#8214 bind:group to undefined

* fix code and add test

---------

Co-authored-by: Yuichiro Yamashita <xydybaseball@gmail.com>
pull/8335/head
David Hunt 2 years ago committed by GitHub
parent 26104eaaba
commit 4e8efd3c1e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -266,7 +266,7 @@ function get_dom_updater(
const type = node.get_static_attribute_value('type');
const condition = type === 'checkbox'
? x`~${binding.snippet}.indexOf(${element.var}.__value)`
? x`~(${binding.snippet} || []).indexOf(${element.var}.__value)`
: x`${element.var}.__value === ${binding.snippet}`;
return b`${element.var}.checked = ${condition};`;

@ -0,0 +1,25 @@
export default {
async test({ assert, target, component, window }) {
const [input1, input2, input3] = target.querySelectorAll('input');
const event = new window.Event('change');
function validate_inputs(v1, v2, v3) {
assert.equal(input1.checked, v1);
assert.equal(input2.checked, v2);
assert.equal(input3.checked, v3);
}
assert.deepEqual(component.values.inner, []);
validate_inputs(false, false, false);
component.values = { inner: undefined };
assert.deepEqual(component.values.inner, undefined);
validate_inputs(false, false, false);
input1.checked = true;
await input1.dispatchEvent(event);
assert.deepEqual(component.values.inner, ['first']);
validate_inputs(true, false, false);
}
};

@ -0,0 +1,15 @@
<script>
export let values = {
inner: []
};
</script>
<input type='checkbox' value='first' bind:group={values.inner} />
<input type='checkbox' value='second' bind:group={values.inner} />
<input type='checkbox' value='third' bind:group={values.inner} />
<div>
{#each ['first', 'second', 'third'] as k}
<span>{k}</span>
{/each}
</div>
Loading…
Cancel
Save