@pylonsync/functions 0.22.33 → 0.22.34

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pylonsync/functions",
-  "version": "0.22.33",
+  "version": "0.22.34",
   "description": "TypeScript function runtime for pylon — defines server-side queries, mutations, and actions.",
   "type": "module",
   "main": "src/index.ts",

package/src/ssr-client-bundler.test.ts

@@ -804,3 +804,14 @@ describe("nearestBoundaryComponent across route groups", () => {
     ).toBe("app/(marketing)/not-found");
   });
 });
+
+describe("client router popstate", () => {
+  test("a hash-only popstate does not re-render the route", () => {
+    // Clicking a same-page anchor fires popstate. Treating it as a navigation
+    // re-rendered the page and scrolled back to the top.
+    const src = fs.readFileSync(path.join(import.meta.dir, "ssr-client-bundler.ts"), "utf8");
+    const popstate = src.slice(src.indexOf('window.addEventListener("popstate"'));
+    expect(popstate).toContain("if (next === renderedPath) return;");
+    expect(src.match(/renderedPath = location\.pathname \+ location\.search;/g)?.length).toBeGreaterThanOrEqual(3);
+  });
+});

package/src/ssr-client-bundler.ts

@@ -830,6 +830,12 @@ function renderPendingPlaceholder(pathname, manifest, myEpoch) {
   return true;
 }
 
+// The path and query the page last rendered. A popstate that keeps them and
+// only changes the hash is a same-page jump (an anchor link, a back press
+// between anchors), not a navigation: re-rendering for it would reset the
+// scroll to the top.
+let renderedPath = "";
+
 async function navigate(href, opts) {
   const push = !opts || opts.push !== false;
   const url = new URL(href, location.href);
@@ -891,6 +897,7 @@ async function navigate(href, opts) {
           history.pushState({ component: matched.component }, "", target);
         }
         window.dispatchEvent(new Event("pylon:navigation"));
+        renderedPath = location.pathname + location.search;
         window.scrollTo(0, 0);
         didOptimistic = true;
       }
@@ -915,6 +922,7 @@ async function navigate(href, opts) {
       loadManifest().then((manifest) => {
         if (navState.settled || myEpoch !== navEpoch) return;
         if (renderPendingPlaceholder(url.pathname, manifest, myEpoch)) {
+          renderedPath = location.pathname + location.search;
           window.scrollTo(0, 0);
         }
       });
@@ -1013,6 +1021,7 @@ async function navigate(href, opts) {
     // re-read location after a Link click or a router.push(). popstate already
     // covers back/forward, but pushState/replaceState fire no event.
     window.dispatchEvent(new Event("pylon:navigation"));
+    renderedPath = location.pathname + location.search;
     // After a successful nav, scroll to top (Next.js default).
     window.scrollTo(0, 0);
   }
@@ -1042,8 +1051,11 @@ function installNavHandlers() {
     const seed = seeds ? seeds.get(link) : undefined;
     navigate(href, seed != null ? { seed } : undefined);
   });
+  renderedPath = location.pathname + location.search;
   window.addEventListener("popstate", () => {
-    navigate(location.pathname + location.search, { push: false });
+    const next = location.pathname + location.search;
+    if (next === renderedPath) return;
+    navigate(next, { push: false });
   });
   // Progressive-enhancement form submit (#276): intercept <form data-pylon-form>
   // so the page doesn't full-reload. fetch the same route.ts endpoint, follow