allow updating props

Author: JoviDeCroock

src/router.js

@@ -118,24 +118,21 @@ export function Router(props) {
 	const didSuspend = useRef();
 	didSuspend.current = false;
 
-	cur.current = useMemo(() => {
+	useMemo(() => {
 		// This hack prevents Preact from diffing when we swap `cur` to `prev`:
 		if (this.__v && this.__v.__k) this.__v.__k.reverse();
 
 		count.current++;
-
 		prev.current = cur.current;
-
-		let p, d, m;
-		toChildArray(props.children).some(vnode => {
-			const matches = exec(rest, vnode.props.path, (m = { ...vnode.props, path: rest, query, params, rest: '' }));
-			if (matches) return (p = cloneElement(vnode, m));
-			if (vnode.props.default) d = cloneElement(vnode, m);
-		});
-
-		return h(RouteContext.Provider, { value: m }, p || d);
 	}, [url]);
 
+	let pr, d, m;
+	toChildArray(props.children).some(vnode => {
+		const matches = exec(rest, vnode.props.path, (m = { ...vnode.props, path: rest, query, params, rest: '' }));
+		if (matches) return (pr = cloneElement(vnode, m));
+		if (vnode.props.default) d = cloneElement(vnode, m);
+	});
+	cur.current =  h(RouteContext.Provider, { value: m }, pr || d);
 	// Reset previous children - if rendering succeeds synchronously, we shouldn't render the previous children.
 	const p = prev.current;
 	prev.current = null;

test/router.test.js

@@ -55,6 +55,68 @@ describe('Router', () => {
 		});
 	});
 
+	it.only('should allow updating props in a route', async () => {
+		const Home = jest.fn(() => html`<h1>Home</h1>`);
+		const stack = [];
+		let loc;
+		render(
+			html`
+				<${LocationProvider}>
+					<${Router}
+						onRouteChange=${url => {
+							stack.push(url);
+						}}
+					>
+						<${Home} path="/" test="2" />
+					<//>
+					<${() => {
+						loc = useLocation();
+					}} />
+				<//>
+			`,
+			scratch
+		);
+
+		expect(scratch).toHaveProperty('textContent', 'Home');
+		expect(Home).toHaveBeenCalledWith({ path: '/', query: {}, params: {}, rest: '', test: '2' }, expect.anything());
+		expect(loc).toMatchObject({
+			url: '/',
+			path: '/',
+			query: {},
+			route: expect.any(Function)
+		});
+
+		Home.mockReset();
+
+		render(
+			html`
+				<${LocationProvider}>
+					<${Router}
+						onRouteChange=${url => {
+							stack.push(url);
+						}}
+					>
+						<${Home} path="/" test="3" />
+					<//>
+					<${() => {
+						loc = useLocation();
+					}} />
+				<//>
+			`,
+			scratch
+		);
+
+		console.log(scratch.outerHTML)
+		expect(scratch).toHaveProperty('textContent', 'Home');
+		expect(Home).toHaveBeenCalledWith({ path: '/', query: {}, params: {}, rest: '', test: '3' }, expect.anything());
+		expect(loc).toMatchObject({
+			url: '/',
+			path: '/',
+			query: {},
+			route: expect.any(Function)
+		});
+	});
+
 	it('should switch between synchronous routes', async () => {
 		const Home = jest.fn(() => html`<h1>Home</h1>`);
 		const Profiles = jest.fn(() => html`<h1>Profiles</h1>`);