From 9e3a8341e6ebfaee6dcd9f0d2800142b3f638847 Mon Sep 17 00:00:00 2001
From: Tan Li Hau <lhtan93@gmail.com>
Date: Thu, 21 May 2020 22:14:55 +0800
Subject: [PATCH] attach binding_group into array

---
 .../render_dom/wrappers/Element/Binding.ts    | 43 ++++++++++---------
 src/runtime/internal/dom.ts                   | 33 +++++++++++++-
 src/runtime/internal/index.ts                 |  2 +-
 3 files changed, 56 insertions(+), 22 deletions(-)

diff --git a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts
index ac5732eae7..122c403935 100644
--- a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts
+++ b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts
@@ -121,17 +121,17 @@ export default class BindingWrapper {
 		switch (this.node.name) {
 			case 'group':
 			{
-				const binding_group = get_binding_group(parent.renderer, this.node.expression.node);
+				// const binding_group = get_binding_group(parent.renderer, this.node.expression.node);
 
-				block.renderer.add_to_context(`$$binding_groups`);
-				const reference = block.renderer.reference(`$$binding_groups`);
+				// block.renderer.add_to_context(`$$binding_groups`);
+				// const reference = block.renderer.reference(`$$binding_groups`);
 
 				block.chunks.hydrate.push(
-					b`${reference}[${binding_group}].push(${parent.var});`
+					b`@add_into_binding_group(${this.snippet}, ${parent.var});`
 				);
 
 				block.chunks.destroy.push(
-					b`${reference}[${binding_group}].splice(${reference}[${binding_group}].indexOf(${parent.var}), 1);`
+					b`@remove_from_binding_group(${this.snippet}, ${parent.var});`
 				);
 				break;
 			}
@@ -233,7 +233,10 @@ function get_dom_updater(
 			? x`~${binding.snippet}.indexOf(${element.var}.__value)`
 			: x`${element.var}.__value === ${binding.snippet}`;
 
-		return b`${element.var}.checked = ${condition};`;
+		return b`
+			@reattach_binding_group(${binding.snippet}, ${element.var});
+			${element.var}.checked = ${condition};
+		`;
 	}
 
 	if (binding.node.name === 'value') {
@@ -243,20 +246,20 @@ function get_dom_updater(
 	return b`${element.var}.${binding.node.name} = ${binding.snippet};`;
 }
 
-function get_binding_group(renderer: Renderer, value: Node) {
-	const { parts } = flatten_reference(value); // TODO handle cases involving computed member expressions
-	const keypath = parts.join('.');
+// function get_binding_group(renderer: Renderer, value: Node) {
+// 	const { parts } = flatten_reference(value); // TODO handle cases involving computed member expressions
+// 	const keypath = parts.join('.');
 
-	// TODO handle contextual bindings — `keypath` should include unique ID of
-	// each block that provides context
-	let index = renderer.binding_groups.indexOf(keypath);
-	if (index === -1) {
-		index = renderer.binding_groups.length;
-		renderer.binding_groups.push(keypath);
-	}
+// 	// TODO handle contextual bindings — `keypath` should include unique ID of
+// 	// each block that provides context
+// 	let index = renderer.binding_groups.indexOf(keypath);
+// 	if (index === -1) {
+// 		index = renderer.binding_groups.length;
+// 		renderer.binding_groups.push(keypath);
+// 	}
 
-	return index;
-}
+// 	return index;
+// }
 
 function get_event_handler(
 	binding: BindingWrapper,
@@ -332,9 +335,9 @@ function get_value_from_dom(
 
 	// <input type='checkbox' bind:group='foo'>
 	if (name === 'group') {
-		const binding_group = get_binding_group(renderer, binding.node.expression.node);
+		// const binding_group = get_binding_group(renderer, binding.node.expression.node);
 		if (type === 'checkbox') {
-			return x`@get_binding_group_value($$binding_groups[${binding_group}])`;
+			return x`@get_binding_group_value(this)`;
 		}
 
 		return x`this.__value`;
diff --git a/src/runtime/internal/dom.ts b/src/runtime/internal/dom.ts
index 02fd3dc23e..13f0bdb0ea 100644
--- a/src/runtime/internal/dom.ts
+++ b/src/runtime/internal/dom.ts
@@ -126,7 +126,38 @@ export function xlink_attr(node, attribute, value) {
 	node.setAttributeNS('http://www.w3.org/1999/xlink', attribute, value);
 }
 
-export function get_binding_group_value(group) {
+const binding_group = Symbol.for("$$binding_group");
+
+export function add_into_binding_group(array, input) {
+	if (array) {
+		if (!array[binding_group]) {
+			Object.defineProperty(array, binding_group, {
+				enumerable: false,
+				value: [],
+			});
+    }
+		array[binding_group].push(input);
+		input.__binding_group = array[binding_group];
+	}
+}
+
+export function remove_from_binding_group(array, input) {
+	if (array && array[binding_group]) {
+		array[binding_group].splice(array[binding_group].indexOf(input), 1);
+		delete input.__binding_group;
+	}
+}
+
+export function reattach_binding_group(array, input) {
+	// if the array got reassigned, reattach binding group
+	if (array[binding_group] !== input.__binding_group) {
+		array.__binding_group.splice(array.__binding_group.indexOf(input), 1);
+		add_into_binding_group(array, input);
+	}
+}
+
+export function get_binding_group_value(input) {
+	const group = input.__binding_group;
 	const value = [];
 	for (let i = 0; i < group.length; i += 1) {
 		if (group[i].checked) value.push(group[i].__value);
diff --git a/src/runtime/internal/index.ts b/src/runtime/internal/index.ts
index e1dd2a1fcf..aaf8ddc793 100644
--- a/src/runtime/internal/index.ts
+++ b/src/runtime/internal/index.ts
@@ -12,4 +12,4 @@ export * from './ssr';
 export * from './transitions';
 export * from './utils';
 export * from './Component';
-export * from './dev';
+export * from './dev';
\ No newline at end of file