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>

src/compiler/compile/render_dom/wrappers/Element/Binding.ts

@@ -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};`;

test/runtime/samples/binding-input-group-undefined/_config.js

@@ -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);
+	}
+};

test/runtime/samples/binding-input-group-undefined/main.svelte

@@ -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>