(chore) - commit for future testing

compat/src/index.js

@@ -356,6 +356,7 @@ function memo(c, comparer) {
 
 	function Memoed(props) {
 		this.shouldComponentUpdate = shouldUpdate;
+		console.error('memo', props);
 		return h(c, assign({}, props));
 	}
 	Memoed.prototype.isReactComponent = true;

demo/index.js

@@ -20,6 +20,7 @@ import DevtoolsDemo from './devtools';
 import SuspenseDemo from './suspense';
 import Redux from './redux';
 import TextFields from './textFields';
+import ReduxBug from './reduxUpdate';
 
 let isBenchmark = /(\/spiral|\/pythagoras|[#&]bench)/g.test(window.location.href);
 if (!isBenchmark) {
@@ -77,6 +78,7 @@ class App extends Component {
 						<Link href="/redux" activeClassName="active">Redux</Link>
 						<Link href="/suspense" activeClassName="active">Suspense / lazy</Link>
 						<Link href="/textfields" activeClassName="active">Textfields</Link>
+						<Link href="/reduxBug/1" activeClassName="active">Redux Bug</Link>
 					</nav>
 				</header>
 				<main>
@@ -108,6 +110,7 @@ class App extends Component {
 						<StyledComp path="/styled-components" />
 						<Redux path="/redux" />
 						<TextFields path="/textfields" />
+						<ReduxBug path="/reduxBug/:start" />
 					</Router>
 				</main>
 			</div>

demo/package.json

@@ -35,6 +35,8 @@
     "preact-render-to-string": "^5.0.2",
     "preact-router": "^3.0.0",
     "react-redux": "^7.1.0",
+    "react-router": "^5.0.1",
+    "react-router-dom": "^5.0.1",
     "redux": "^4.0.1",
     "styled-components": "^4.2.0"
   }

demo/reduxUpdate.js

@@ -0,0 +1,60 @@
+import { createElement, Component } from 'preact';
+import { connect, Provider } from 'react-redux';
+import { createStore } from 'redux';
+import { HashRouter, Route, Link } from 'react-router-dom';
+
+const store = createStore(
+	(state, action) => ({ ...state, display: action.display }),
+	{ display: false }
+);
+
+function _Redux({ showMe, counter }) {
+	if (!showMe) return null;
+	return <div>showMe {counter}</div>;
+}
+const Redux = connect(state => console.log('injecting', state.display) || ({ showMe: state.display }))(_Redux);
+
+let display = false;
+class Test extends Component {
+
+	componentDidUpdate(prevProps) {
+		if (this.props.start != prevProps.start) {
+			this.setState({ f: (this.props.start || 0) + 1 });
+			setTimeout(() => this.setState({ i: (this.state.i || 0) + 1 }));
+		}
+	}
+
+	render() {
+		const { f } = this.state;
+		return (
+			<div>
+				<button
+					onClick={() => {
+						display = !display;
+						store.dispatch({ type: 1, display });
+					}}
+				>
+          Toggle visibilty
+				</button>
+				<Link to={`/${(parseInt(this.props.start) || 0) + 1}`}>Click me</Link>
+
+				<Redux counter={f} />
+			</div>
+		);
+	}
+}
+
+function App() {
+	return (
+		<Provider store={store}>
+			<HashRouter>
+				<Route
+					path="/:start?"
+					render={({ match }) => <Test start={match.params.start || 0} />}
+				/>
+			</HashRouter>
+		</Provider>
+	);
+}
+
+export default App;

src/component.js

@@ -68,6 +68,9 @@ Component.prototype.forceUpdate = function(callback) {
 		// shouldComponentUpdate
 		const force = callback!==false;
 
+		if (oldDom == null && vnode._depth > 16) {
+			console.log('hey', this);
+		}
 		let mounts = [];
 		let newDom = diff(parentDom, vnode, assign({}, vnode), this._context, parentDom.ownerSVGElement!==undefined, null, mounts, force, oldDom == null ? getDomSibling(vnode) : oldDom);
 		commitRoot(mounts, vnode);
@@ -96,6 +99,7 @@ Component.prototype.render = Fragment;
  * @param {number | null} [childIndex]
  */
 export function getDomSibling(vnode, childIndex) {
+	console.log('getting siblign for for ', vnode.type, childIndex);
 	if (childIndex == null) {
 		// Use childIndex==null as a signal to resume the search from the vnode's sibling
 		return vnode._parent
@@ -128,10 +132,12 @@ export function getDomSibling(vnode, childIndex) {
  */
 function updateParentDomPointers(vnode) {
 	if ((vnode = vnode._parent) != null && vnode._component != null) {
+		console.log(vnode.type, 'setting', vnode._dom, 'to', vnode._component.base);
 		vnode._dom = vnode._component.base = null;
 		for (let i = 0; i < vnode._children.length; i++) {
 			let child = vnode._children[i];
 			if (child != null && child._dom != null) {
+				console.log(vnode.type, 'setting', vnode._dom, 'to', child._dom, 'or', vnode._component.base);
 				vnode._dom = vnode._component.base = child._dom;
 				break;
 			}

src/create-element.js

@@ -10,6 +10,7 @@ import { assign } from './util';
   * @returns {import('./internal').VNode}
   */
 export function createElement(type, props, children) {
+	console.log('creating vnode', props);
 	props = assign({}, props);
 
 	if (arguments.length>3) {