Merge pull request #277 from canjs/276-test-and-partial-fix

DO NOT MERGE: partial fix and test for #276

Author: chasenlehara

can-component.js

@@ -206,7 +206,7 @@ function getSetupFunctionForComponentVM(componentInitVM) {
 				onCompleteBindings.push(canBinding.start.bind(canBinding));
 
 				// We’ll want to turn off the bindings when the component is destroyed
-				onTeardowns.push(canBinding.stop);
+				onTeardowns.push(canBinding.stop.bind(canBinding));
 
 			} else {
 				// Can’t get or set the value, so assume it’s not an observable

test/component-in-stache-test.js

@@ -1,5 +1,6 @@
 var Component = require("can-component");
 var SimpleMap = require("can-simple-map");
+var SimpleObservable = require("can-simple-observable");
 var stache = require("can-stache");
 var canReflect = require("can-reflect");
 var QUnit = require("steal-qunit");
@@ -75,3 +76,39 @@ QUnit.test("wrapped in a conditional", function (assert) {
 	templateVM.set("showComponent", false);
 	assert.equal(fragment.textContent, "", "fragment ends without content");
 });
+
+QUnit.test("Component can be removed from the page", 2, function(){
+
+	var ToBeRemoved = Component.extend({
+		tag: "to-be-removed",
+		view: "{{prop}}",
+		ViewModel: {
+			prop: "string"
+		},
+		events: {
+			"{element} beforeremove": function(){
+				QUnit.ok(true, "torn down");
+			}
+		}
+	});
+
+	var prop = new SimpleObservable(3);
+
+	var toBeRemoved = new ToBeRemoved({
+		viewModel: {
+			prop: prop
+		}
+	});
+
+	var show = new SimpleObservable(true);
+
+	var template = stache("<div>{{# if(show) }} {{{toBeRemoved}}} {{/ if}}</div>");
+
+	template({
+		show: show,
+		toBeRemoved: toBeRemoved
+	});
+
+	show.set(false);
+	QUnit.ok(true, "got here without an error");
+});