diff --git a/src/router.js b/src/router.js index 1eb0737..ac5d5cc 100644 --- a/src/router.js +++ b/src/router.js @@ -145,9 +145,14 @@ export function Router(props) { /** @type {VNode | undefined} */ let incoming = pathRoute || defaultRoute; + + const isHydratingSuspense = cur.current && cur.current.__u & MODE_HYDRATE && cur.current.__u & MODE_SUSPENDED; + const isHydratingBool = cur.current && cur.current.__h; const routeChanged = useMemo(() => { prev.current = cur.current; + cur.current = /** @type {VNode} */ (h(RouteContext.Provider, { value: matchProps }, incoming)); + // Only mark as an update if the route component changed. const outgoing = prev.current && prev.current.props.children; if (!outgoing || !incoming || incoming.type !== outgoing.type || incoming.props.component !== outgoing.props.component) { @@ -157,12 +162,8 @@ export function Router(props) { return true; } return false; - }, [url]); + }, [url, JSON.stringify(matchProps)]); - const isHydratingSuspense = cur.current && cur.current.__u & MODE_HYDRATE && cur.current.__u & MODE_SUSPENDED; - const isHydratingBool = cur.current && cur.current.__h; - // @ts-ignore - cur.current = /** @type {VNode} */ (h(RouteContext.Provider, { value: matchProps }, incoming)); if (isHydratingSuspense) { cur.current.__u |= MODE_HYDRATE; cur.current.__u |= MODE_SUSPENDED; diff --git a/test/router.test.js b/test/router.test.js index fad9218..b068354 100644 --- a/test/router.test.js +++ b/test/router.test.js @@ -251,6 +251,7 @@ describe('Router', () => { await sleep(10); expect(scratch).to.have.property('innerHTML', '

B

hello

'); + expect(B).to.have.been.calledOnce; expect(B).to.have.been.calledWith({ path: '/b', query: {}, params: {}, rest: '' }); B.resetHistory(); @@ -277,6 +278,7 @@ describe('Router', () => { await sleep(10); expect(scratch).to.have.property('innerHTML', '

C

'); + expect(C).to.have.been.calledOnce; expect(C).to.have.been.calledWith({ path: '/c', query: {}, params: {}, rest: '' }); // "instant" routing to already-loaded routes