vike 0.4.144-commit-6aef8a6 → 0.4.144-commit-7f5e99a

package/dist/esm/client/client-routing-runtime/{useClientRouter.js → installClientRouter.js}

@@ -1,6 +1,7 @@
-export { useClientRouter };
+export { installClientRouter };
 export { disableClientRouting };
 export { isDisableAutomaticLinkInterception };
+export { renderPageClientSide };
 import { assert, getCurrentUrl, isEquivalentError, objectAssign, serverSideRouteTo, throttle, sleep, getGlobalObject, executeHook } from './utils.js';
 import { navigationState } from './navigationState.js';
 import { checkIf404, getPageContext, getPageContextErrorPage, isAlreadyServerSideRouted } from './getPageContext.js';
@@ -9,130 +10,81 @@ import { addLinkPrefetchHandlers } from './prefetch.js';
 import { assertInfo, assertWarning, isReact } from './utils.js';
 import { executeOnRenderClientHook } from '../shared/executeOnRenderClientHook.js';
 import { assertHook } from '../../shared/hooks/getHook.js';
-import { isClientSideRoutable, skipLink } from './skipLink.js';
+import { skipLink } from './skipLink.js';
 import { isErrorFetchingStaticAssets } from '../shared/loadPageFilesClientSide.js';
-import { initHistoryState, getHistoryState, pushHistory, saveScrollPosition } from './history.js';
-import { defineNavigate } from './navigate.js';
+import { initHistoryState, getHistoryState, pushHistory, saveScrollPosition, monkeyPatchHistoryPushState } from './history.js';
 import { assertNoInfiniteAbortLoop, getPageContextFromAllRewrites, isAbortError, logAbortErrorHandled } from '../../shared/route/abort.js';
-const globalObject = getGlobalObject('useClientRouter.ts', { previousState: getState() });
-setupNativeScrollRestoration();
-initHistoryState();
-function disableClientRouting(err, log) {
-    assert(isErrorFetchingStaticAssets(err));
-    globalObject.clientRoutingIsDisabled = true;
-    if (log) {
-        // We don't use console.error() to avoid flooding error trackers such as Sentry
-        console.log(err);
-    }
-    // @ts-ignore Since dist/cjs/client/ is never used, we can ignore this error.
-    const isProd = import.meta.env.PROD;
-    assertInfo(false, [
-        'Failed to fetch static asset.',
-        isProd ? 'This usually happens when a new frontend is deployed.' : null,
-        'Falling back to Server Routing.',
-        '(The next page navigation will use Server Routing instead of Client Routing.)'
-    ]
-        .filter(Boolean)
-        .join(' '), { onlyOnce: true });
-}
-function useClientRouter() {
+import { route } from '../../shared/route/index.js';
+import { isClientSideRoutable } from './isClientSideRoutable.js';
+const globalObject = getGlobalObject('installClientRouter.ts', { previousState: getState(), renderCounter: 0 });
+function installClientRouter() {
+    setupNativeScrollRestoration();
+    initHistoryState();
     autoSaveScrollPosition();
-    onLinkClick((url, { keepScrollPosition }) => {
-        const scrollTarget = keepScrollPosition ? 'preserve-scroll' : 'scroll-to-top-or-hash';
-        fetchAndRender({
-            scrollTarget,
-            urlOriginal: url,
-            isBackwardNavigation: false,
-            checkClientSideRenderable: true
-        });
-    });
-    onBrowserHistoryNavigation((scrollTarget, isBackwardNavigation) => {
-        fetchAndRender({ scrollTarget, isBackwardNavigation });
-    });
-    defineNavigate(async (url, { keepScrollPosition = false, overwriteLastHistoryEntry = false } = {}) => {
-        const scrollTarget = keepScrollPosition ? 'preserve-scroll' : 'scroll-to-top-or-hash';
-        await fetchAndRender({
-            scrollTarget,
-            urlOriginal: url,
-            overwriteLastHistoryEntry,
-            isBackwardNavigation: false,
-            checkClientSideRenderable: true
-        });
+    monkeyPatchHistoryPushState();
+    // Intercept <a> links
+    onLinkClick();
+    // Handle back-/forward navigation
+    onBrowserHistoryNavigation();
+    // Intial render
+    renderPageClientSide({ scrollTarget: 'preserve-scroll', isBackwardNavigation: null });
+}
+async function renderPageClientSide(renderArgs) {
+    const { scrollTarget, urlOriginal = getCurrentUrl(), overwriteLastHistoryEntry = false, isBackwardNavigation, checkIfClientSideRenderable, pageContextsFromRewrite = [], redirectCount = 0, isUserLandNavigation } = renderArgs;
+    assertNoInfiniteAbortLoop(pageContextsFromRewrite.length, redirectCount);
+    if (globalObject.clientRoutingIsDisabled) {
+        serverSideRouteTo(urlOriginal);
+        return;
+    }
+    const pageContext = await createPageContext(urlOriginal);
+    objectAssign(pageContext, {
+        isBackwardNavigation
     });
-    let renderingCounter = 0;
-    let renderPromise;
-    let isTransitioning = false;
-    fetchAndRender({ scrollTarget: 'preserve-scroll', isBackwardNavigation: null });
-    return;
-    async function fetchAndRender({ scrollTarget, urlOriginal = getCurrentUrl(), overwriteLastHistoryEntry = false, isBackwardNavigation, checkClientSideRenderable, pageContextsFromRewrite = [], redirectCount = 0 }) {
-        assertNoInfiniteAbortLoop(pageContextsFromRewrite.length, redirectCount);
-        if (globalObject.clientRoutingIsDisabled) {
-            serverSideRouteTo(urlOriginal);
-            return;
-        }
+    {
         const pageContextFromAllRewrites = getPageContextFromAllRewrites(pageContextsFromRewrite);
-        if (checkClientSideRenderable) {
-            const urlLogical = pageContextFromAllRewrites._urlRewrite ?? urlOriginal;
-            let isClientRoutable;
-            try {
-                isClientRoutable = await isClientSideRoutable(urlLogical);
-            }
-            catch (err) {
-                if (!isAbortError(err)) {
-                    // If a route() hook has a bug
-                    throw err;
-                }
-                else {
-                    // If the user's route() hook throw redirect() / throw render()
-                    // We handle the abort error down below: the user's route() hook is called again in getPageContext()
-                    isClientRoutable = true;
-                }
-            }
-            if (!isClientRoutable) {
-                serverSideRouteTo(urlOriginal);
-                return;
-            }
+        objectAssign(pageContext, pageContextFromAllRewrites);
+    }
+    let hasError = false;
+    let err;
+    {
+        let pageContextFromRoute;
+        try {
+            pageContextFromRoute = await route(pageContext);
         }
-        const pageContextBase = {
-            urlOriginal,
-            isBackwardNavigation,
-            ...pageContextFromAllRewrites
-        };
-        const renderingNumber = ++renderingCounter;
-        assert(renderingNumber >= 1);
-        // Start transition before any await's
-        if (renderingNumber > 1) {
-            if (isTransitioning === false) {
-                await globalObject.onPageTransitionStart?.(pageContextBase);
-                isTransitioning = true;
-            }
+        catch (err_) {
+            hasError = true;
+            err = err_;
         }
-        let hydrationCanBeAborted = false;
-        const shouldAbort = () => {
-            {
-                // We should never abort the hydration if `hydrationCanBeAborted` isn't `true`
-                const isHydration = renderingNumber === 1;
-                if (isHydration && hydrationCanBeAborted === false) {
-                    return false;
+        if (pageContextFromRoute) {
+            objectAssign(pageContext, pageContextFromRoute);
+            if (checkIfClientSideRenderable) {
+                const isClientRoutable = await isClientSideRoutable(pageContext);
+                if (!isClientRoutable) {
+                    serverSideRouteTo(urlOriginal);
+                    return;
                 }
             }
-            // If there is a newer rendering, we should abort all previous renderings
-            if (renderingNumber !== renderingCounter) {
-                return true;
+            if (isUserLandNavigation && pageContextFromRoute._pageId === globalObject.previousPageContext?._pageId) {
+                // Skip's Vike's rendering; let the user handle the navigation
+                return;
             }
-            return false;
-        };
-        const pageContext = await createPageContext(pageContextBase);
-        if (shouldAbort()) {
-            return;
         }
-        const isFirstRenderAttempt = renderingNumber === 1;
-        objectAssign(pageContext, {
-            _isFirstRenderAttempt: isFirstRenderAttempt
-        });
-        let pageContextAddendum;
-        let err;
-        let hasError = false;
+    }
+    const { renderNumber, shouldAbort, setHydrationCanBeAborted } = getRenderNumber();
+    const isFirstRenderAttempt = renderNumber === 1;
+    objectAssign(pageContext, { _isFirstRenderAttempt: isFirstRenderAttempt });
+    // Start transition before any await's
+    if (renderNumber > 1) {
+        if (!globalObject.isTransitioning) {
+            await globalObject.onPageTransitionStart?.(pageContext);
+            globalObject.isTransitioning = true;
+        }
+    }
+    if (shouldAbort()) {
+        return;
+    }
+    let pageContextAddendum;
+    if (!hasError) {
         try {
             pageContextAddendum = await getPageContext(pageContext);
         }
@@ -140,141 +92,140 @@ function useClientRouter() {
             hasError = true;
             err = err_;
         }
-        if (hasError) {
-            if (!isAbortError(err)) {
-                // We don't swallow 404 errors:
-                //  - On the server-side, Vike swallows / doesn't show any 404 error log because it's expected that a user may go to some random non-existent URL. (We don't want to flood the app's error tracking with 404 logs.)
-                //  - On the client-side, if the user navigates to a 404 then it means that the UI has a broken link. (It isn't expected that users can go to some random URL using the client-side router, as it would require, for example, the user to manually change the URL of a link by manually manipulating the DOM which highly unlikely.)
-                console.error(err);
-            }
-            else {
-                // We swallow throw redirect()/render() called by client-side hooks onBeforeRender() and guard()
-                // We handle the abort error down below.
-            }
-            if (shouldSwallowAndInterrupt(err, pageContext))
+    }
+    if (hasError) {
+        if (!isAbortError(err)) {
+            // We don't swallow 404 errors:
+            //  - On the server-side, Vike swallows / doesn't show any 404 error log because it's expected that a user may go to some random non-existent URL. (We don't want to flood the app's error tracking with 404 logs.)
+            //  - On the client-side, if the user navigates to a 404 then it means that the UI has a broken link. (It isn't expected that users can go to some random URL using the client-side router, as it would require, for example, the user to manually change the URL of a link by manually manipulating the DOM which highly unlikely.)
+            console.error(err);
+        }
+        else {
+            // We swallow throw redirect()/render() called by client-side hooks onBeforeRender() and guard()
+            // We handle the abort error down below.
+        }
+        if (shouldSwallowAndInterrupt(err, pageContext))
+            return;
+        if (isAbortError(err)) {
+            const errAbort = err;
+            logAbortErrorHandled(err, pageContext._isProduction, pageContext);
+            const pageContextAbort = errAbort._pageContextAbort;
+            // throw render('/some-url')
+            if (pageContextAbort._urlRewrite) {
+                await renderPageClientSide({
+                    ...renderArgs,
+                    scrollTarget: 'scroll-to-top-or-hash',
+                    checkIfClientSideRenderable: true,
+                    pageContextsFromRewrite: [...pageContextsFromRewrite, pageContextAbort]
+                });
                 return;
-            if (isAbortError(err)) {
-                const errAbort = err;
-                logAbortErrorHandled(err, pageContext._isProduction, pageContext);
-                const pageContextAbort = errAbort._pageContextAbort;
-                // throw render('/some-url')
-                if (pageContextAbort._urlRewrite) {
-                    await fetchAndRender({
-                        scrollTarget,
-                        urlOriginal,
-                        overwriteLastHistoryEntry,
-                        isBackwardNavigation,
-                        pageContextsFromRewrite: [...pageContextsFromRewrite, pageContextAbort],
-                        redirectCount
-                    });
-                    return;
-                }
-                // throw redirect('/some-url')
-                if (pageContextAbort._urlRedirect) {
-                    const urlRedirect = pageContextAbort._urlRedirect.url;
-                    if (urlRedirect.startsWith('http')) {
-                        // External redirection
-                        window.location.href = urlRedirect;
-                        return;
-                    }
-                    else {
-                        await fetchAndRender({
-                            scrollTarget: 'scroll-to-top-or-hash',
-                            urlOriginal: urlRedirect,
-                            overwriteLastHistoryEntry: false,
-                            isBackwardNavigation: false,
-                            checkClientSideRenderable: true,
-                            pageContextsFromRewrite,
-                            redirectCount: redirectCount++
-                        });
-                    }
-                    return;
-                }
-                // throw render(statusCode)
-                assert(pageContextAbort.abortStatusCode);
-                objectAssign(pageContext, pageContextAbort);
-                if (pageContextAbort.abortStatusCode === 404) {
-                    objectAssign(pageContext, { is404: true });
-                }
             }
-            else {
-                objectAssign(pageContext, { is404: checkIf404(err) });
-            }
-            try {
-                pageContextAddendum = await getPageContextErrorPage(pageContext);
-            }
-            catch (err2) {
-                // - When user hasn't defined a `_error.page.js` file
-                // - Some unpexected vike internal error
-                if (shouldSwallowAndInterrupt(err2, pageContext))
+            // throw redirect('/some-url')
+            if (pageContextAbort._urlRedirect) {
+                const urlRedirect = pageContextAbort._urlRedirect.url;
+                if (urlRedirect.startsWith('http')) {
+                    // External redirection
+                    window.location.href = urlRedirect;
                     return;
-                if (!isFirstRenderAttempt) {
-                    setTimeout(() => {
-                        // We let the server show the 404 page
-                        window.location.pathname = urlOriginal;
-                    }, 0);
-                }
-                if (!isEquivalentError(err, err2)) {
-                    throw err2;
                 }
                 else {
-                    // Abort
-                    return;
+                    await renderPageClientSide({
+                        ...renderArgs,
+                        scrollTarget: 'scroll-to-top-or-hash',
+                        urlOriginal: urlRedirect,
+                        overwriteLastHistoryEntry: false,
+                        isBackwardNavigation: false,
+                        checkIfClientSideRenderable: true,
+                        redirectCount: redirectCount + 1
+                    });
                 }
+                return;
+            }
+            // throw render(statusCode)
+            assert(pageContextAbort.abortStatusCode);
+            objectAssign(pageContext, pageContextAbort);
+            if (pageContextAbort.abortStatusCode === 404) {
+                objectAssign(pageContext, { is404: true });
             }
-        }
-        assert(pageContextAddendum);
-        objectAssign(pageContext, pageContextAddendum);
-        assertHook(pageContext, 'onPageTransitionStart');
-        globalObject.onPageTransitionStart = pageContext.exports.onPageTransitionStart;
-        if (pageContext.exports.hydrationCanBeAborted) {
-            hydrationCanBeAborted = true;
         }
         else {
-            assertWarning(!isReact(), 'You seem to be using React; we recommend setting hydrationCanBeAborted to true, see https://vike.dev/clientRouting', { onlyOnce: true });
+            objectAssign(pageContext, { is404: checkIf404(err) });
         }
-        if (shouldAbort()) {
-            return;
-        }
-        if (renderPromise) {
-            // Always make sure that the previous render has finished,
-            // otherwise that previous render may finish after this one.
-            await renderPromise;
-        }
-        if (shouldAbort()) {
-            return;
+        try {
+            pageContextAddendum = await getPageContextErrorPage(pageContext);
         }
-        changeUrl(urlOriginal, overwriteLastHistoryEntry);
-        navigationState.markNavigationChange();
-        assert(renderPromise === undefined);
-        renderPromise = (async () => {
-            await executeOnRenderClientHook(pageContext, true);
-            addLinkPrefetchHandlers(pageContext);
-        })();
-        await renderPromise;
-        renderPromise = undefined;
-        if (pageContext._isFirstRenderAttempt) {
-            assertHook(pageContext, 'onHydrationEnd');
-            const { onHydrationEnd } = pageContext.exports;
-            if (onHydrationEnd) {
-                const hookFilePath = pageContext.exportsAll.onHydrationEnd[0].exportSource;
-                assert(hookFilePath);
-                await executeHook(() => onHydrationEnd(pageContext), 'onHydrationEnd', hookFilePath);
+        catch (err2) {
+            // - When user hasn't defined a `_error.page.js` file
+            // - Some unpexected vike internal error
+            if (shouldSwallowAndInterrupt(err2, pageContext))
+                return;
+            if (!isFirstRenderAttempt) {
+                setTimeout(() => {
+                    // We let the server show the 404 page
+                    window.location.pathname = urlOriginal;
+                }, 0);
             }
-        }
-        else if (renderingNumber === renderingCounter) {
-            if (pageContext.exports.onPageTransitionEnd) {
-                assertHook(pageContext, 'onPageTransitionEnd');
-                await pageContext.exports.onPageTransitionEnd(pageContext);
+            if (!isEquivalentError(err, err2)) {
+                throw err2;
             }
-            isTransitioning = false;
+            else {
+                // Abort
+                return;
+            }
+        }
+    }
+    assert(pageContextAddendum);
+    objectAssign(pageContext, pageContextAddendum);
+    assertHook(pageContext, 'onPageTransitionStart');
+    globalObject.onPageTransitionStart = pageContext.exports.onPageTransitionStart;
+    if (pageContext.exports.hydrationCanBeAborted) {
+        setHydrationCanBeAborted();
+    }
+    else {
+        assertWarning(!isReact(), 'You seem to be using React; we recommend setting hydrationCanBeAborted to true, see https://vike.dev/clientRouting', { onlyOnce: true });
+    }
+    if (shouldAbort()) {
+        return;
+    }
+    if (globalObject.renderPromise) {
+        // Always make sure that the previous render has finished,
+        // otherwise that previous render may finish after this one.
+        await globalObject.renderPromise;
+    }
+    if (shouldAbort()) {
+        return;
+    }
+    changeUrl(urlOriginal, overwriteLastHistoryEntry);
+    navigationState.markNavigationChange();
+    globalObject.previousPageContext = pageContext;
+    assert(globalObject.renderPromise === undefined);
+    globalObject.renderPromise = (async () => {
+        await executeOnRenderClientHook(pageContext, true);
+        addLinkPrefetchHandlers(pageContext);
+    })();
+    await globalObject.renderPromise;
+    globalObject.renderPromise = undefined;
+    if (pageContext._isFirstRenderAttempt) {
+        assertHook(pageContext, 'onHydrationEnd');
+        const { onHydrationEnd } = pageContext.exports;
+        if (onHydrationEnd) {
+            const hookFilePath = pageContext.exportsAll.onHydrationEnd[0].exportSource;
+            assert(hookFilePath);
+            await executeHook(() => onHydrationEnd(pageContext), 'onHydrationEnd', hookFilePath);
         }
-        setScrollPosition(scrollTarget);
-        browserNativeScrollRestoration_disable();
-        globalObject.initialRenderIsDone = true;
     }
+    else if (renderNumber === globalObject.renderCounter) {
+        if (pageContext.exports.onPageTransitionEnd) {
+            assertHook(pageContext, 'onPageTransitionEnd');
+            await pageContext.exports.onPageTransitionEnd(pageContext);
+        }
+        globalObject.isTransitioning = undefined;
+    }
+    setScrollPosition(scrollTarget);
+    browserNativeScrollRestoration_disable();
+    globalObject.initialRenderIsDone = true;
 }
-function onLinkClick(callback) {
+function onLinkClick() {
     document.addEventListener('click', onClick);
     return;
     // Code adapted from https://github.com/HenrikJoreteg/internal-nav-helper/blob/5199ec5448d0b0db7ec63cf76d88fa6cad878b7d/src/index.js#L11-L29
@@ -290,7 +241,13 @@ function onLinkClick(callback) {
         assert(url);
         ev.preventDefault();
         const keepScrollPosition = ![null, 'false'].includes(linkTag.getAttribute('keep-scroll-position'));
-        callback(url, { keepScrollPosition });
+        const scrollTarget = keepScrollPosition ? 'preserve-scroll' : 'scroll-to-top-or-hash';
+        renderPageClientSide({
+            scrollTarget,
+            urlOriginal: url,
+            isBackwardNavigation: false,
+            checkIfClientSideRenderable: true
+        });
     }
     function isNormalLeftClick(ev) {
         return ev.button === 0 && !ev.ctrlKey && !ev.shiftKey && !ev.altKey && !ev.metaKey;
@@ -306,21 +263,29 @@ function onLinkClick(callback) {
         return target;
     }
 }
-function onBrowserHistoryNavigation(callback) {
-    // The `event` of `window.addEventListener('popstate', (event) => /*...*/)` is useless:
-    //  - The History API doesn't provide the previous state (the popped state): https://stackoverflow.com/questions/48055323/is-history-state-always-the-same-as-popstate-event-state
+function onBrowserHistoryNavigation() {
+    // - The popstate event is trigged upon:
+    //   - Back-/forward navigation.
+    //     - By user clicking on his browser's back-/forward navigation (or using a shortcut)
+    //     - By JavaScript: `history.back()` / `history.forward()`
+    //   - URL hash change.
+    //     - By user clicking on a hash link `<a href="#some-hash" />`
+    //       - The popstate event is *only* triggered if `href` starts with '#' (even if `href` is '/#some-hash' while the current URL's pathname is '/' then the popstate still isn't triggered)
+    //     - By JavaScript: `location.hash = 'some-hash'`
+    // - The `event` of `window.addEventListener('popstate', (event) => /*...*/)` is useless: the History API doesn't provide the previous state (the popped state), see https://stackoverflow.com/questions/48055323/is-history-state-always-the-same-as-popstate-event-state
     window.addEventListener('popstate', () => {
         const currentState = getState();
         const scrollTarget = currentState.historyState.scrollPosition || 'scroll-to-top-or-hash';
+        const isUserLandNavigation = currentState.historyState.triggedBy === 'user';
         const isHashNavigation = currentState.urlWithoutHash === globalObject.previousState.urlWithoutHash;
         const isBackwardNavigation = !currentState.historyState.timestamp || !globalObject.previousState.historyState.timestamp
             ? null
             : currentState.historyState.timestamp < globalObject.previousState.historyState.timestamp;
         globalObject.previousState = currentState;
-        if (isHashNavigation) {
+        if (isHashNavigation && !isUserLandNavigation) {
             // - `history.state` is uninitialized (`null`) when:
-            //   - The vike app runs `window.location.hash = '#section'`.
-            //   - The user clicks on an anchor link `<a href="#section">Section</a>`. (Because Vike's `onLinkClick()` handler skips hash links.)
+            //   - The user's code runs `window.location.hash = '#section'`.
+            //   - The user clicks on an anchor link `<a href="#section">Section</a>` (because Vike's `onLinkClick()` handler skips hash links).
             // - `history.state` is `null` when uninitialized: https://developer.mozilla.org/en-US/docs/Web/API/History/state
             // - Alternatively, we completely take over hash navigation and reproduce the browser's native behavior upon hash navigation.
             //   - Problem: we cannot intercept `window.location.hash = '#section'`. (Or maybe we can with the `hashchange` event?)
@@ -341,8 +306,7 @@ function onBrowserHistoryNavigation(callback) {
             }
         }
         else {
-            // Fetch & render new page
-            callback(scrollTarget, isBackwardNavigation);
+            renderPageClientSide({ scrollTarget, isBackwardNavigation, isUserLandNavigation });
         }
     });
 }
@@ -418,6 +382,7 @@ function setScroll(scrollPosition) {
         }, 0);
     });
 }
+// Save scroll position (needed for back-/forward navigation)
 function autoSaveScrollPosition() {
     // Safari cannot handle more than 100 `history.replaceState()` calls within 30 seconds (https://github.com/vikejs/vike/issues/46)
     window.addEventListener('scroll', throttle(saveScrollPosition, Math.ceil(1000 / 3)), { passive: true });
@@ -491,3 +456,44 @@ function isDisableAutomaticLinkInterception() {
     return globalObject.disableAutomaticLinkInterception ?? false
     */
 }
+function disableClientRouting(err, log) {
+    assert(isErrorFetchingStaticAssets(err));
+    globalObject.clientRoutingIsDisabled = true;
+    if (log) {
+        // We don't use console.error() to avoid flooding error trackers such as Sentry
+        console.log(err);
+    }
+    // @ts-ignore Since dist/cjs/client/ is never used, we can ignore this error.
+    const isProd = import.meta.env.PROD;
+    assertInfo(false, [
+        'Failed to fetch static asset.',
+        isProd ? 'This usually happens when a new frontend is deployed.' : null,
+        'Falling back to Server Routing.',
+        '(The next page navigation will use Server Routing instead of Client Routing.)'
+    ]
+        .filter(Boolean)
+        .join(' '), { onlyOnce: true });
+}
+function getRenderNumber() {
+    const renderNumber = ++globalObject.renderCounter;
+    assert(renderNumber >= 1);
+    let hydrationCanBeAborted = false;
+    const setHydrationCanBeAborted = () => {
+        hydrationCanBeAborted = true;
+    };
+    const shouldAbort = () => {
+        {
+            // We should never abort the hydration if `hydrationCanBeAborted` isn't `true`
+            const isHydration = renderNumber === 1;
+            if (isHydration && hydrationCanBeAborted === false) {
+                return false;
+            }
+        }
+        // If there is a newer rendering, we should abort all previous renderings
+        if (renderNumber !== globalObject.renderCounter) {
+            return true;
+        }
+        return false;
+    };
+    return { renderNumber, shouldAbort, setHydrationCanBeAborted };
+}

package/dist/esm/client/client-routing-runtime/isClientSideRoutable.d.ts

@@ -0,0 +1,8 @@
+export { isClientSideRoutable };
+import type { PageFile } from '../../shared/getPageFiles.js';
+import type { PageConfigRuntime } from '../../shared/page-configs/PageConfig.js';
+declare function isClientSideRoutable(pageContext: {
+    _pageId: string | null;
+    _pageFilesAll: PageFile[];
+    _pageConfigs: PageConfigRuntime[];
+}): Promise<boolean>;

package/dist/esm/client/client-routing-runtime/isClientSideRoutable.js

@@ -0,0 +1,15 @@
+export { isClientSideRoutable };
+import { analyzePageClientSideInit } from '../../shared/getPageFiles/analyzePageClientSide.js';
+import { findPageConfig } from '../../shared/page-configs/findPageConfig.js';
+import { analyzeClientSide } from '../../shared/getPageFiles/analyzeClientSide.js';
+async function isClientSideRoutable(pageContext) {
+    if (!pageContext._pageId) {
+        return false;
+    }
+    await analyzePageClientSideInit(pageContext._pageFilesAll, pageContext._pageId, {
+        sharedPageFilesAlreadyLoaded: false
+    });
+    const pageConfig = findPageConfig(pageContext._pageConfigs, pageContext._pageId);
+    const { isClientSideRenderable, isClientRouting } = analyzeClientSide(pageConfig, pageContext._pageFilesAll, pageContext._pageId);
+    return isClientSideRenderable && isClientRouting;
+}

package/dist/esm/client/client-routing-runtime/navigate.d.ts

@@ -1,6 +1,5 @@
 export { navigate };
 export { reload };
-export { defineNavigate };
 /** Programmatically navigate to a new page.
  *
  * https://vike.dev/navigate
@@ -13,5 +12,4 @@ declare function navigate(url: string, { keepScrollPosition, overwriteLastHistor
     keepScrollPosition?: boolean | undefined;
     overwriteLastHistoryEntry?: boolean | undefined;
 }): Promise<void>;
-declare function defineNavigate(navigate_: typeof navigate): void;
 declare function reload(): Promise<void>;

package/dist/esm/client/client-routing-runtime/navigate.js

@@ -1,9 +1,8 @@
 export { navigate };
 export { reload };
-export { defineNavigate };
-import { assertUsage, isBrowser, getGlobalObject, assertClientRouting, checkIfClientRouting, getCurrentUrl } from './utils.js';
+import { renderPageClientSide } from './installClientRouter.js';
+import { assertUsage, isBrowser, assertClientRouting, checkIfClientRouting, getCurrentUrl } from './utils.js';
 assertClientRouting();
-const globalObject = getGlobalObject('navigate.ts', {});
 /** Programmatically navigate to a new page.
  *
  * https://vike.dev/navigate
@@ -15,7 +14,6 @@ const globalObject = getGlobalObject('navigate.ts', {});
 async function navigate(url, { keepScrollPosition = false, overwriteLastHistoryEntry = false } = {}) {
     assertUsage(isBrowser(), 'The navigate() function can be called only on the client-side', { showStackTrace: true });
     const errMsg = 'navigate() works only with Client Routing, see https://vike.dev/navigate';
-    assertUsage(globalObject.navigate, errMsg, { showStackTrace: true });
     assertUsage(checkIfClientRouting(), errMsg, { showStackTrace: true });
     assertUsage(url, '[navigate(url)] Missing argument url', { showStackTrace: true });
     assertUsage(typeof url === 'string', '[navigate(url)] Argument url should be a string', { showStackTrace: true });
@@ -24,10 +22,14 @@ async function navigate(url, { keepScrollPosition = false, overwriteLastHistoryE
     assertUsage(url.startsWith('/'), '[navigate(url)] Argument url should start with a leading /', {
         showStackTrace: true
     });
-    await globalObject.navigate(url, { keepScrollPosition, overwriteLastHistoryEntry });
-}
-function defineNavigate(navigate_) {
-    globalObject.navigate = navigate_;
+    const scrollTarget = keepScrollPosition ? 'preserve-scroll' : 'scroll-to-top-or-hash';
+    await renderPageClientSide({
+        scrollTarget,
+        urlOriginal: url,
+        overwriteLastHistoryEntry,
+        isBackwardNavigation: false,
+        checkIfClientSideRenderable: true
+    });
 }
 async function reload() {
     await navigate(getCurrentUrl());