Update can-stache deps to latest major; reuse observation if reconnected

package.json

@@ -10,8 +10,8 @@
     "@webcomponents/custom-elements": "^1.2.4",
     "can-observable-array": "^1.0.6",
     "can-observable-object": "^1.0.1",
-    "can-stache": "^4.17.21",
-    "can-stache-bindings": "^4.10.9",
+    "can-stache": "^5.1.1",
+    "can-stache-bindings": "^5.0.4",
     "preact": "^8.5.3",
     "preact-compat": "^3.19.0",
     "prop-types": "^15.7.2",

react-to-webcomponent-test.js

@@ -153,7 +153,7 @@ QUnit.test("works with nested properties of observable objects and arrays", func
 		render() {
 			return <React.Fragment>
 				<h1>
-					Hello, { this.props.name.first } { this.props.name.last }
+					Hello, { this.props.name.full }
 				</h1>
 				<h1>
 					I see you like { this.props.hobbies.join(" and ")}
@@ -169,9 +169,13 @@ QUnit.test("works with nested properties of observable objects and arrays", func
 	var fixture = document.getElementById("qunit-fixture");
 
 	var myWelcome = new MyWelcome();
-	myWelcome.name = new ObservableObject({
+	myWelcome.name = new (class extends ObservableObject {
+		get full() {
+			return this.first + ' ' + this.last;
+		}
+	})({
 		first: "Justin",
-		last: "Meyer"
+		last: "Meyer",
 	});
 	myWelcome.hobbies = new ObservableArray([
 		"basketball",

react-to-webcomponent.js

@@ -76,7 +76,7 @@ export default function(ReactComponent, React, ReactDOM) {
 		this[shouldRenderSymbol] = true;
 		// Also catch any sub-properties of observables which
 		//   are read while rendering the React component.
-		this[observationSymbol] = new Observation(() => {
+		this[observationSymbol] = this[observationSymbol] || new Observation(() => {
 			this[renderSymbol]();
 		});
 		this[observationSymbol].on();