Merge pull request #340 from canjs/teardown

Teardown bindings when a nodeList in unregistered
canjs · May 6, 2019 · 672796a · 672796a
2 parents b332db2 + c35001b
commit 672796a
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 6 deletions.
diff --git a/benchmark/memory.html b/benchmark/memory.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<title>Memory tests</title>
+<button type="button">Run me</button>
+<div id="root"></div>
+<script src="../node_modules/steal/steal.js"></script>
+<script type="steal-module">
+	var Component = require("can-component");
+	var nodeLists = require("can-view-nodelist");
+
+	var MyComponent = Component.extend({
+		tag: "my-thing",
+		view: "Hello world"
+	});
+
+	function run() {
+		var inst = new MyComponent();
+		nodeLists.unregister(inst.nodeList);
+	}
+
+	document.querySelector('button').addEventListener('click', run);
+</script>
diff --git a/can-component.js b/can-component.js
@@ -132,7 +132,6 @@ function makeReplacementTagCallback(tagName, componentTagData, shadowTagData, le
 	// - `el` - the element
 	// - `insertionElementTagData` - the tagData where the element was found.
 	return function replacementTag(el, insertionElementTagData) {
-
 		// If there's no template to be rendered, we'll render what's inside the
 		// element. This is usually default content.
 		var template = getPrimaryTemplate(el) || insertionElementTagData.subtemplate,
@@ -178,8 +177,9 @@ function makeReplacementTagCallback(tagName, componentTagData, shadowTagData, le
 			// We need to teardown any bindings created too so we create a nodeList
 			// to do this.
 
-			var nodeList = nodeLists.register([el],
-				tagData.teardown || noop,
+
+
+			var nodeList = nodeLists.register([el], tagData.teardown || noop,
 				insertionElementTagData.parentNodeList || true,
 				insertionElementTagData.directlyNested);
 
@@ -557,8 +557,13 @@ var Component = Construct.extend(
 					var doc = el.ownerDocument;
 					var rootNode = doc.contains ? doc : doc.documentElement;
 					if (!rootNode || !rootNode.contains(el)) {
-						removalDisposal();
-						callTeardownFunctions();
+						if(removalDisposal) {
+							nodeRemoved = true;
+							removalDisposal();
+							callTeardownFunctions();
+							removalDisposal = null;
+							callTeardownFunctions = null;
+						}
 					}
 				});
 			}
@@ -623,10 +628,17 @@ var Component = Construct.extend(
 				betweenTagsView = componentTagData.subtemplate || el.ownerDocument.createDocumentFragment.bind(el.ownerDocument);
 			}
 			var viewModelDisconnectedCallback,
-				componentInPage;
+				componentInPage,
+				nodeRemoved;
 
 			// Keep a nodeList so we can kill any directly nested nodeLists within this component
 			var nodeList = nodeLists.register([], function() {
+				if(removalDisposal && !nodeRemoved) {
+					removalDisposal();
+					callTeardownFunctions();
+					removalDisposal = null;
+					callTeardownFunctions = null;
+				}
 				component._torndown = true;
 				domEvents.dispatch(el, "beforeremove", false);
 				if(teardownBindings) {