vike 0.4.199-commit-43cc34a → 0.4.199-commit-5d1b353

package/dist/cjs/utils/PROJECT_VERSION.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PROJECT_VERSION = void 0;
 // Automatically updated by @brillout/release-me
-exports.PROJECT_VERSION = '0.4.199-commit-43cc34a';
+exports.PROJECT_VERSION = '0.4.199-commit-5d1b353';

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

@@ -1,5 +1,9 @@
-export { enhanceHistoryState, getHistoryState, pushHistory, type ScrollPosition, saveScrollPosition, monkeyPatchHistoryPushState };
-type StateVikeEnhanced = {
+export { pushHistoryState };
+export { onPopStateBegin };
+export { saveScrollPosition };
+export type { HistoryInfo };
+export type { ScrollPosition };
+type StateEnhanced = {
     timestamp: number;
     scrollPosition: null | ScrollPosition;
     triggeredBy: 'user' | 'vike' | 'browser';
@@ -9,9 +13,14 @@ type ScrollPosition = {
     x: number;
     y: number;
 };
-type StateNotInitialized = null | undefined | Partial<StateVikeEnhanced> | StateVikeEnhanced;
-declare function enhanceHistoryState(): void;
-declare function getHistoryState(): StateNotInitialized;
 declare function saveScrollPosition(): void;
-declare function pushHistory(url: string, overwriteLastHistoryEntry: boolean): void;
-declare function monkeyPatchHistoryPushState(): void;
+declare function pushHistoryState(url: string, overwriteLastHistoryEntry: boolean): void;
+type HistoryInfo = {
+    url: `/${string}`;
+    state: StateEnhanced;
+};
+declare function onPopStateBegin(): {
+    isNewState: boolean;
+    previous: HistoryInfo;
+    current: HistoryInfo;
+};

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

@@ -1,22 +1,26 @@
-export { enhanceHistoryState, getHistoryState, pushHistory, saveScrollPosition, monkeyPatchHistoryPushState };
-import { assert, assertUsage, hasProp, isObject } from './utils.js';
+export { pushHistoryState };
+export { onPopStateBegin };
+export { saveScrollPosition };
+import { assert, assertUsage, getCurrentUrl, getGlobalObject, hasProp, isObject } from './utils.js';
+init();
+const globalObject = getGlobalObject('history.ts', { previous: getHistoryInfo() });
 // `window.history.state === null` when:
 // - The very first render
 // - Click on `<a href="#some-hash" />`
 // - `location.hash = 'some-hash'`
 function enhanceHistoryState() {
-    const stateNotInitialized = window.history.state;
-    if (isVikeEnhanced(stateNotInitialized))
+    const stateNotEnhanced = getStateNotEnhanced();
+    if (isVikeEnhanced(stateNotEnhanced))
         return;
-    const stateVikeEnhanced = enhance(stateNotInitialized);
+    const stateVikeEnhanced = enhance(stateNotEnhanced);
     replaceHistoryState(stateVikeEnhanced);
 }
-function enhance(stateNotInitialized) {
+function enhance(stateNotEnhanced) {
     const timestamp = getTimestamp();
     const scrollPosition = getScrollPosition();
     const triggeredBy = 'browser';
     let stateVikeEnhanced;
-    if (!stateNotInitialized) {
+    if (!stateNotEnhanced) {
         stateVikeEnhanced = {
             timestamp,
             scrollPosition,
@@ -27,21 +31,26 @@ function enhance(stateNotInitialized) {
     else {
         // State information may be incomplete if `window.history.state` is set by an old Vike version. (E.g. `state.timestamp` was introduced for `pageContext.isBackwardNavigation` in `0.4.19`.)
         stateVikeEnhanced = {
-            timestamp: stateNotInitialized.timestamp ?? timestamp,
-            scrollPosition: stateNotInitialized.scrollPosition ?? scrollPosition,
-            triggeredBy: stateNotInitialized.triggeredBy ?? triggeredBy,
+            timestamp: stateNotEnhanced.timestamp ?? timestamp,
+            scrollPosition: stateNotEnhanced.scrollPosition ?? scrollPosition,
+            triggeredBy: stateNotEnhanced.triggeredBy ?? triggeredBy,
             _isVikeEnhanced: true
         };
     }
     assert(isVikeEnhanced(stateVikeEnhanced));
     return stateVikeEnhanced;
 }
-function getState_alreadyEnhanced() {
-    const state = getHistoryState();
+function getState() {
+    const state = getStateNotEnhanced();
+    // *Every* state added to the history needs to go through Vike.
+    // - Otherwise Vike's `popstate` listener won't work. (Because, for example, if globalObject.previous is outdated => isHashNavigation faulty => client-side navigation wrongfully skipped.)
+    // - Therefore, we monkey patch history.pushState() and history.replaceState()
+    // - Therefore, we assert() below that history.state has been enhanced by Vike
+    // - If users stumble upon this assert() then make it a assertUsage()
     assert(isVikeEnhanced(state));
     return state;
 }
-function getHistoryState() {
+function getStateNotEnhanced() {
     const state = window.history.state;
     return state;
 }
@@ -54,48 +63,54 @@ function getTimestamp() {
 }
 function saveScrollPosition() {
     const scrollPosition = getScrollPosition();
-    const state = getState_alreadyEnhanced();
+    const state = getState();
     replaceHistoryState({ ...state, scrollPosition });
 }
-function pushHistory(url, overwriteLastHistoryEntry) {
+function pushHistoryState(url, overwriteLastHistoryEntry) {
     if (!overwriteLastHistoryEntry) {
-        const timestamp = getTimestamp();
-        pushHistoryState({
-            timestamp,
+        const state = {
+            timestamp: getTimestamp(),
             // I don't remember why I set it to `null`, maybe because setting it now would be too early? (Maybe there is a delay between renderPageClientSide() is finished and the browser updating the scroll position.) Anyways, it seems like autoSaveScrollPosition() is enough.
             scrollPosition: null,
             triggeredBy: 'vike',
             _isVikeEnhanced: true
-        }, url);
+        };
+        // Calling the monkey patched history.pushState() (and not the orignal) so that other tools (e.g. user tracking) can listen to Vike's pushState() calls
+        // https://github.com/vikejs/vike/issues/1582
+        window.history.pushState(state, '', url);
     }
     else {
-        replaceHistoryState(getState_alreadyEnhanced(), url);
+        replaceHistoryState(getState(), url);
     }
 }
 function replaceHistoryState(state, url) {
     const url_ = url ?? null; // Passing `undefined` chokes older Edge versions.
     window.history.replaceState(state, '', url_);
 }
-function pushHistoryState(state, url) {
-    // Vike should call window.history.pushState() (and not the orignal `pushStateOriginal()`) so that other tools (e.g. user tracking) can listen to Vike's pushState() calls, see https://github.com/vikejs/vike/issues/1582.
-    window.history.pushState(state, '', url);
-}
-function monkeyPatchHistoryPushState() {
-    const pushStateOriginal = window.history.pushState.bind(window.history);
-    window.history.pushState = (stateOriginal = {}, ...rest) => {
-        assertUsage(stateOriginal === undefined || stateOriginal === null || isObject(stateOriginal), 'history.pushState(state) argument state must be an object');
-        const stateEnhanced = isVikeEnhanced(stateOriginal)
-            ? stateOriginal
-            : {
-                _isVikeEnhanced: true,
-                scrollPosition: getScrollPosition(),
-                timestamp: getTimestamp(),
-                triggeredBy: 'user',
-                ...stateOriginal
-            };
-        assert(isVikeEnhanced(stateEnhanced));
-        return pushStateOriginal(stateEnhanced, ...rest);
-    };
+// Monkey patch:
+// - history.pushState()
+// - history.replaceState()
+function monkeyPatchHistoryAPI() {
+    ;
+    ['pushState', 'replaceState'].forEach((funcName) => {
+        const funcOriginal = window.history[funcName].bind(window.history);
+        window.history[funcName] = (stateOriginal = {}, ...rest) => {
+            assertUsage(stateOriginal === undefined || stateOriginal === null || isObject(stateOriginal), `history.${funcName}(state) argument state must be an object`);
+            const stateEnhanced = isVikeEnhanced(stateOriginal)
+                ? stateOriginal
+                : {
+                    _isVikeEnhanced: true,
+                    scrollPosition: getScrollPosition(),
+                    timestamp: getTimestamp(),
+                    triggeredBy: 'user',
+                    ...stateOriginal
+                };
+            assert(isVikeEnhanced(stateEnhanced));
+            const ret = funcOriginal(stateEnhanced, ...rest);
+            globalObject.previous = getHistoryInfo();
+            return ret;
+        };
+    });
 }
 function isVikeEnhanced(state) {
     const yes = isObject(state) && '_isVikeEnhanced' in state;
@@ -114,3 +129,22 @@ function assertStateVikeEnhanced(state) {
         assert(hasProp(state.scrollPosition, 'x', 'number') && hasProp(state.scrollPosition, 'y', 'number'));
     }
 }
+function init() {
+    enhanceHistoryState();
+    monkeyPatchHistoryAPI();
+}
+function getHistoryInfo() {
+    return {
+        url: getCurrentUrl(),
+        state: getState()
+    };
+}
+function onPopStateBegin() {
+    const isNewState = window.history.state === null;
+    if (isNewState)
+        enhanceHistoryState();
+    const { previous } = globalObject;
+    const current = getHistoryInfo();
+    globalObject.previous = current;
+    return { isNewState, previous, current };
+}

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

@@ -1,6 +1,5 @@
 export { initClientRouter };
 import { assert } from './utils.js';
-import { enhanceHistoryState, monkeyPatchHistoryPushState } from './history.js';
 import { getRenderCount, renderPageClientSide } from './renderPageClientSide.js';
 import { initOnPopState } from './initOnPopState.js';
 import { initOnLinkClick } from './initOnLinkClick.js';
@@ -29,9 +28,7 @@ async function renderFirstPage() {
 }
 function initHistoryAndScroll() {
     setupNativeScrollRestoration();
-    enhanceHistoryState();
     autoSaveScrollPosition();
-    monkeyPatchHistoryPushState();
     // Handle back-/forward navigation
     initOnPopState();
 }

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

@@ -1,27 +1,12 @@
 export { initOnPopState };
-export { updateState };
 export { onPopState };
+import { type HistoryInfo } from './history.js';
 declare function initOnPopState(): void;
 type Listener = (arg: {
-    previous: ReturnType<typeof getState>;
+    previous: HistoryInfo;
 }) => void | boolean;
-/** Control client-side navigation.
+/** Control back-/forward navigation.
  *
  * https://vike.dev/onPopState
  */
 declare function onPopState(listener: Listener): void;
-declare function getState(): {
-    url: `/${string}`;
-    state: {
-        timestamp: number;
-        scrollPosition: null | import("./history.js").ScrollPosition;
-        triggeredBy: "user" | "vike" | "browser";
-        _isVikeEnhanced: true;
-    } | Partial<{
-        timestamp: number;
-        scrollPosition: null | import("./history.js").ScrollPosition;
-        triggeredBy: "user" | "vike" | "browser";
-        _isVikeEnhanced: true;
-    }> | null | undefined;
-};
-declare function updateState(): void;

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

@@ -1,11 +1,10 @@
 export { initOnPopState };
-export { updateState };
 export { onPopState };
-import { assert, getCurrentUrl, getGlobalObject } from './utils.js';
-import { enhanceHistoryState, getHistoryState } from './history.js';
+import { getGlobalObject } from './utils.js';
+import { onPopStateBegin } from './history.js';
 import { renderPageClientSide } from './renderPageClientSide.js';
 import { setScrollPosition } from './setScrollPosition.js';
-const globalObject = getGlobalObject('initOnPopState.ts', { previousState: getState(), listeners: [] });
+const globalObject = getGlobalObject('initOnPopState.ts', { listeners: [] });
 function initOnPopState() {
     // - The popstate event is trigged upon:
     //   - Back-/forward navigation.
@@ -17,25 +16,16 @@ function initOnPopState() {
     //     - `location.hash = 'some-hash'`
     // - The `event` argument 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', async () => {
-        const previous = globalObject.previousState;
-        const current = getState();
-        globalObject.previousState = current;
-        const scrollTarget = current.state?.scrollPosition || undefined;
-        const isHashNavigation = removeHash(current.url) === removeHash(previous.url);
-        const isBackwardNavigation = !current.state?.timestamp || !previous.state?.timestamp
-            ? null
-            : current.state.timestamp < previous.state.timestamp;
-        // - `history.state === null` when:
+        const { isNewState, previous, current } = onPopStateBegin();
+        const scrollTarget = current.state.scrollPosition || undefined;
+        const isUserPushStateNavigation = current.state.triggeredBy === 'user' || previous.state.triggeredBy === 'user';
+        const isHashNavigation = current.url !== previous.url && removeHash(current.url) === removeHash(previous.url);
+        // - `isNewState === true` when:
         //   - Click on `<a href="#some-hash" />` (note that Vike's `initOnLinkClick()` handler skips hash links)
         //   - `location.hash = 'some-hash'`
-        // - `history.state !== null` when `popstate` was triggered by the user clicking on his browser's forward/backward history button.
-        let isHashNavigationNew = isHashNavigation && window.history.state === null;
-        if (window.history.state === null) {
-            assert(isHashNavigation);
-            // The browser already scrolled to `#${hash}` => the current scroll position is the right one => we save it with `enhanceHistoryState()`.
-            enhanceHistoryState();
-            globalObject.previousState = getState();
-        }
+        // - `isNewState === false` when `popstate` was triggered by the user clicking on his browser's forward/backward history button.
+        const isHashNavigationNew = isHashNavigation && isNewState;
+        const isBackwardNavigation = !current.state.timestamp || !previous.state.timestamp ? null : current.state.timestamp < previous.state.timestamp;
         // We have to scroll ourselves because we use `window.history.scrollRestoration = 'manual'`. So far this seems to work. Alternatives in case it doesn't work:
         // - Alternative: we use `window.history.scrollRestoration = 'auto'`
         //   - Problem: I don't think it's possbible to set `window.history.scrollRestoration = 'auto'` only for hash navigation and not for non-hash navigations?
@@ -49,33 +39,32 @@ function initOnPopState() {
             if (!isHashNavigationNew) {
                 setScrollPosition(scrollTarget);
             }
+            else {
+                // The browser already scrolled to `#${hash}` => the current scroll position is the right one => we saved it with `enhanceHistoryState()`.
+            }
             return;
         }
+        let doNotRenderIfSamePage = isUserPushStateNavigation;
         let abort;
         globalObject.listeners.forEach((listener) => {
             abort || (abort = listener({ previous }));
         });
-        if (abort)
+        if (abort) {
             return;
-        await renderPageClientSide({ scrollTarget, isBackwardNavigation });
+        }
+        if (abort === false) {
+            doNotRenderIfSamePage = false;
+        }
+        await renderPageClientSide({ scrollTarget, isBackwardNavigation, doNotRenderIfSamePage });
     });
 }
-/** Control client-side navigation.
+/** Control back-/forward navigation.
  *
  * https://vike.dev/onPopState
  */
 function onPopState(listener) {
     globalObject.listeners.push(listener);
 }
-function getState() {
-    return {
-        url: getCurrentUrl(),
-        state: getHistoryState()
-    };
-}
 function removeHash(url) {
     return url.split('#')[0];
 }
-function updateState() {
-    globalObject.previousState = getState();
-}

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

@@ -12,6 +12,7 @@ type RenderArgs = {
     overwriteLastHistoryEntry?: boolean;
     pageContextsFromRewrite?: PageContextFromRewrite[];
     redirectCount?: number;
+    doNotRenderIfSamePage?: boolean;
     isClientSideNavigation?: boolean;
 };
 declare function renderPageClientSide(renderArgs: RenderArgs): Promise<void>;

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

@@ -10,12 +10,11 @@ import { assertInfo, assertWarning, isReact } from './utils.js';
 import { executeOnRenderClientHook } from '../shared/executeOnRenderClientHook.js';
 import { assertHook, getHook } from '../../shared/hooks/getHook.js';
 import { isErrorFetchingStaticAssets, loadUserFilesClientSide } from '../shared/loadUserFilesClientSide.js';
-import { pushHistory } from './history.js';
+import { pushHistoryState } from './history.js';
 import { assertNoInfiniteAbortLoop, getPageContextFromAllRewrites, isAbortError, logAbortErrorHandled } from '../../shared/route/abort.js';
 import { route } from '../../shared/route/index.js';
 import { isClientSideRoutable } from './isClientSideRoutable.js';
 import { setScrollPosition } from './setScrollPosition.js';
-import { updateState } from './initOnPopState.js';
 import { browserNativeScrollRestoration_disable, setInitialRenderIsDone } from './scrollRestoration.js';
 import { getErrorPageId } from '../../shared/error-page.js';
 import { setPageContextCurrent } from './getPageContextCurrent.js';
@@ -30,7 +29,7 @@ const globalObject = getGlobalObject('renderPageClientSide.ts', (() => {
 })());
 const { firstRenderStartPromise } = globalObject;
 async function renderPageClientSide(renderArgs) {
-    const { urlOriginal = getCurrentUrl(), overwriteLastHistoryEntry = false, isBackwardNavigation, pageContextsFromRewrite = [], redirectCount = 0, isClientSideNavigation = true } = renderArgs;
+    const { urlOriginal = getCurrentUrl(), overwriteLastHistoryEntry = false, isBackwardNavigation, pageContextsFromRewrite = [], redirectCount = 0, doNotRenderIfSamePage, isClientSideNavigation = true } = renderArgs;
     let { scrollTarget } = renderArgs;
     const { previousPageContext } = globalObject;
     addLinkPrefetchHandlers_unwatch();
@@ -117,6 +116,13 @@ async function renderPageClientSide(renderArgs) {
                 redirectHard(urlOriginal);
                 return;
             }
+            const isSamePage = pageContextFromRoute.pageId &&
+                previousPageContext?.pageId &&
+                pageContextFromRoute.pageId === previousPageContext.pageId;
+            if (doNotRenderIfSamePage && isSamePage) {
+                // Skip's Vike's rendering; let the user handle the navigation
+                return;
+            }
             // TODO/eventually: create helper assertPageContextFromHook()
             assert(!('urlOriginal' in pageContextFromRoute));
             objectAssign(pageContext, pageContextFromRoute);
@@ -469,8 +475,7 @@ function changeUrl(url, overwriteLastHistoryEntry) {
     if (getCurrentUrl() === url)
         return;
     browserNativeScrollRestoration_disable();
-    pushHistory(url, overwriteLastHistoryEntry);
-    updateState();
+    pushHistoryState(url, overwriteLastHistoryEntry);
 }
 function handleErrorFetchingStaticAssets(err, pageContext, isFirstRender) {
     if (!isErrorFetchingStaticAssets(err)) {

package/dist/esm/utils/PROJECT_VERSION.d.ts

@@ -1 +1 @@
-export declare const PROJECT_VERSION: "0.4.199-commit-43cc34a";
+export declare const PROJECT_VERSION: "0.4.199-commit-5d1b353";

package/dist/esm/utils/PROJECT_VERSION.js

@@ -1,2 +1,2 @@
 // Automatically updated by @brillout/release-me
-export const PROJECT_VERSION = '0.4.199-commit-43cc34a';
+export const PROJECT_VERSION = '0.4.199-commit-5d1b353';

package/dist/esm/utils/projectInfo.d.ts

@@ -1,4 +1,4 @@
 export declare const projectInfo: {
     projectName: "Vike";
-    projectVersion: "0.4.199-commit-43cc34a";
+    projectVersion: "0.4.199-commit-5d1b353";
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vike",
-  "version": "0.4.199-commit-43cc34a",
+  "version": "0.4.199-commit-5d1b353",
   "repository": "https://github.com/vikejs/vike",
   "exports": {
     "./server": {