From 4e8efd3c1e3002a894910cfad6a3389257cb7434 Mon Sep 17 00:00:00 2001
From: David Hunt <davidhuntatwork@gmail.com>
Date: Mon, 27 Feb 2023 06:02:34 -0800
Subject: [PATCH] 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>
---
 .../render_dom/wrappers/Element/Binding.ts    |  2 +-
 .../binding-input-group-undefined/_config.js  | 25 +++++++++++++++++++
 .../binding-input-group-undefined/main.svelte | 15 +++++++++++
 3 files changed, 41 insertions(+), 1 deletion(-)
 create mode 100644 test/runtime/samples/binding-input-group-undefined/_config.js
 create mode 100644 test/runtime/samples/binding-input-group-undefined/main.svelte

diff --git a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts
index ab863e9dff..47e3795ec2 100644
--- a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts
+++ b/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};`;
diff --git a/test/runtime/samples/binding-input-group-undefined/_config.js b/test/runtime/samples/binding-input-group-undefined/_config.js
new file mode 100644
index 0000000000..501e37813c
--- /dev/null
+++ b/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);
+	}
+};
diff --git a/test/runtime/samples/binding-input-group-undefined/main.svelte b/test/runtime/samples/binding-input-group-undefined/main.svelte
new file mode 100644
index 0000000000..4dadc84a31
--- /dev/null
+++ b/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>