@solidjs/router 2.0.0-next.12 → 2.0.0-next.13

package/dist/data/action.js

@@ -330,7 +330,11 @@ function applyResponseMetadata(metadata, navigate, flightData) {
     cacheKeyOp(keys, entry => (entry[0] = 0));
     // set cache
     flightData && Object.keys(flightData).forEach(k => query.set(k, flightData[k]));
-    // trigger revalidation
+    // trigger revalidation inside the same transition as the navigation, so
+    // the redirect commits atomically with fresh data: surviving consumers
+    // (shared layouts) the flight payload didn't seed refetch and hold the
+    // commit rather than painting stale and updating after. Seeded entries
+    // are fresh again by now, so the sweep re-reads them from cache.
     revalidate(keys, false);
 }
 async function handleResponse(response, error, navigate, metadataHandled) {

package/dist/data/query.js

@@ -1,7 +1,7 @@
 import { createSignal, getObserver, getOwner, onCleanup, sharedConfig } from "solid-js";
-import { getRequestEvent, isResponseEnvelope, isServer } from "@solidjs/web";
+import { getRequestEvent, isResponseEnvelope, isServer, REVALIDATE_HEADER } from "@solidjs/web";
 import { GET, decodeResponse, getServerFunctionMetadata, isServerFunction } from "@solidjs/web/server-functions";
-import { useNavigate, getIntent, getInPreloadFn } from "../routing.js";
+import { useRouter, useRoute, getIntent, getInPreloadFn } from "../routing.js";
 const LocationHeader = "Location";
 const PRELOAD_TIMEOUT = 5000;
 const CACHE_TIMEOUT = 180000;
@@ -58,7 +58,9 @@ export function query(fn, name) {
         const intent = getIntent();
         const inPreloadFn = getInPreloadFn();
         const owner = getOwner();
-        const navigate = owner ? useNavigate() : undefined;
+        const router = owner ? useRouter() : undefined;
+        const route = owner ? useRoute() : undefined;
+        const navigate = router && router.navigatorFactory();
         const now = Date.now();
         const key = name + hashKey(args);
         let cached = cache.get(key);
@@ -82,17 +84,27 @@ export function query(fn, name) {
             tracking = true;
             onCleanup(() => cached[4].count--);
         }
+        // A read under a route section the in-flight navigation is leaving keeps
+        // its invalidated value instead of refetching: this render is disposed at
+        // commit and never paints, and refiring would put a second request on
+        // what single flight promises is one. The entry stays a cache miss, so
+        // the fetch happens at its next real use — a later navigation's preload
+        // or read — unless the flight payload seeds it first. Retained sections
+        // still refetch here, inside the navigation's transition, so the
+        // redirect commits with fresh data.
+        const leaving = cached && !cached[0] && route && router.leaving?.(route);
         if (cached &&
-            cached[0] &&
-            (isServer ||
-                intent === "native" ||
-                cached[4].count ||
-                Date.now() - cached[0] < PRELOAD_TIMEOUT)) {
+            (cached[0]
+                ? isServer ||
+                    intent === "native" ||
+                    cached[4].count ||
+                    Date.now() - cached[0] < PRELOAD_TIMEOUT
+                : leaving)) {
             if (tracking) {
                 cached[4].count++;
                 cached[4][0](); // track
             }
-            if (cached[3] === "preload" && intent !== "preload") {
+            if (!leaving && cached[3] === "preload" && intent !== "preload") {
                 cached[0] = now;
             }
             let res = cached[1];
@@ -101,7 +113,7 @@ export function query(fn, name) {
                     "then" in cached[1]
                         ? cached[1].then(handleResponse(false), handleResponse(true))
                         : handleResponse(false)(cached[1]);
-                !isServer && intent === "navigate" && cached[4][1](cached[0]); // update version
+                !leaving && !isServer && intent === "navigate" && cached[4][1](cached[0]); // update version
             }
             inPreloadFn && "then" in res && res.catch(() => { });
             return res;
@@ -171,14 +183,28 @@ export function query(fn, name) {
                     }
                     const url = v.headers.get(LocationHeader);
                     if (url !== null) {
+                        // invalidate the redirect's revalidation keys before navigating so
+                        // the destination's preloads see the miss and fetch fresh (#580 thread)
+                        const keys = !isServer && v.headers.get(REVALIDATE_HEADER)?.split(",");
+                        keys && cacheKeyOp(keys, entry => (entry[0] = 0));
                         // client + server relative redirect
-                        if (navigate && url.startsWith("/"))
+                        const soft = navigate && url.startsWith("/");
+                        if (soft)
                             navigate(url, { replace: true });
                         else if (!isServer)
                             window.location.href = url;
                         else if (e)
                             e.response.status = 302;
-                        return;
+                        // sweep the live signals inside the same transition as the
+                        // navigation: surviving consumers (shared layouts) refetch and
+                        // hold the commit, so the destination never paints stale data
+                        keys && revalidate(keys, false);
+                        // Hold the read pending on the client: the navigation unmounts this
+                        // consumer, and resolving `undefined` instead hands a missing value
+                        // to whatever renders before the transition commits (a downstream
+                        // `.map()` crashes). The server keeps resolving — its render can't
+                        // await a navigation and the 302 discards the body anyway.
+                        return isServer ? undefined : new Promise(() => { });
                     }
                     if (hasEnveloped)
                         v = enveloped;

package/dist/index.js

@@ -1165,6 +1165,12 @@ function createRouterContext(integration, branches, getContext, options = {}) {
     get pendingTarget() {
       return lastTransitionTarget;
     },
+    leaving(route) {
+      const t = lastTransitionTarget;
+      if (!t || !route.retained) return false;
+      const pathname = t.value.split(/[?#]/, 1)[0];
+      return !route.retained(options.transformUrl ? options.transformUrl(pathname) : pathname);
+    },
     renderPath,
     parsePath,
     navigatorFactory,
@@ -1191,7 +1197,6 @@ function createRouterContext(integration, branches, getContext, options = {}) {
       }
       // typed path proxy nodes coerce to their href
       if (typeof to !== "string") to = to.toString();
-      const queryOnly = !to || to[0] === "?";
       const {
         replace,
         resolve,
@@ -1199,11 +1204,21 @@ function createRouterContext(integration, branches, getContext, options = {}) {
         state: nextState
       } = {
         replace: false,
-        resolve: !queryOnly,
+        resolve: true,
         scroll: true,
         ...options
       };
-      const resolvedTo = resolve ? route.resolvePath(to) : resolvePath(queryOnly && location.pathname || "", to);
+
+      // A string means what the same string means as an href. Leading "/"
+      // stays base-prefixed; anything else resolves URL-style against the
+      // current location — `new URL` collapses `..` and handles `?`/`#`-only
+      // references natively (#502). A cross-origin result (scheme or
+      // protocol-relative input) falls through as unroutable.
+      let resolvedTo;
+      if (!resolve) resolvedTo = resolvePath((!to || to[0] === "?") && location.pathname || "", to);else if (to[0] === "/") resolvedTo = route.resolvePath(to);else {
+        const url = new URL(to, mockBase + location.pathname + location.search + location.hash);
+        resolvedTo = url.origin === mockBase ? url.pathname + url.search + url.hash : undefined;
+      }
       if (resolvedTo === undefined) {
         throw new Error(`Path '${to}' is not a routable path`);
       } else if (referrers.length >= MAX_REDIRECTS) {
@@ -1360,6 +1375,13 @@ function createRouteContext(router, parent, outlet, match, matches = () => [matc
     pattern,
     params,
     path,
+    retained(target) {
+      const m = match();
+      const p = m.route.matcher(target);
+      // params derive from the matched path, so equal paths mean this
+      // section instance (layouts match prefixes via partial matchers)
+      return !!p && p.path === m.path;
+    },
     outlet: () => component ? createComponent(component, {
       params,
       location,
@@ -2174,7 +2196,9 @@ function query(fn, name) {
     const intent = getIntent();
     const inPreloadFn = getInPreloadFn();
     const owner = getOwner();
-    const navigate = owner ? useNavigate() : undefined;
+    const router = owner ? useRouter() : undefined;
+    const route = owner ? useRoute() : undefined;
+    const navigate = router && router.navigatorFactory();
     const now = Date.now();
     const key = name + hashKey(args);
     let cached = cache.get(key);
@@ -2197,18 +2221,28 @@ function query(fn, name) {
       tracking = true;
       onCleanup(() => cached[4].count--);
     }
-    if (cached && cached[0] && (isServer || intent === "native" || cached[4].count || Date.now() - cached[0] < PRELOAD_TIMEOUT)) {
+
+    // A read under a route section the in-flight navigation is leaving keeps
+    // its invalidated value instead of refetching: this render is disposed at
+    // commit and never paints, and refiring would put a second request on
+    // what single flight promises is one. The entry stays a cache miss, so
+    // the fetch happens at its next real use — a later navigation's preload
+    // or read — unless the flight payload seeds it first. Retained sections
+    // still refetch here, inside the navigation's transition, so the
+    // redirect commits with fresh data.
+    const leaving = cached && !cached[0] && route && router.leaving?.(route);
+    if (cached && (cached[0] ? isServer || intent === "native" || cached[4].count || Date.now() - cached[0] < PRELOAD_TIMEOUT : leaving)) {
       if (tracking) {
         cached[4].count++;
         cached[4][0](); // track
       }
-      if (cached[3] === "preload" && intent !== "preload") {
+      if (!leaving && cached[3] === "preload" && intent !== "preload") {
         cached[0] = now;
       }
       let res = cached[1];
       if (intent !== "preload") {
         res = "then" in cached[1] ? cached[1].then(handleResponse(false), handleResponse(true)) : handleResponse(false)(cached[1]);
-        !isServer && intent === "navigate" && cached[4][1](cached[0]); // update version
+        !leaving && !isServer && intent === "navigate" && cached[4][1](cached[0]); // update version
       }
       inPreloadFn && "then" in res && res.catch(() => {});
       return res;
@@ -2267,11 +2301,28 @@ function query(fn, name) {
           }
           const url = v.headers.get(LocationHeader);
           if (url !== null) {
+            // invalidate the redirect's revalidation keys before navigating so
+            // the destination's preloads see the miss and fetch fresh (#580 thread)
+            const keys = !isServer && v.headers.get(REVALIDATE_HEADER)?.split(",");
+            keys && cacheKeyOp(keys, entry => entry[0] = 0);
+
             // client + server relative redirect
-            if (navigate && url.startsWith("/")) navigate(url, {
+            const soft = navigate && url.startsWith("/");
+            if (soft) navigate(url, {
               replace: true
             });else if (!isServer) window.location.href = url;else if (e) e.response.status = 302;
-            return;
+
+            // sweep the live signals inside the same transition as the
+            // navigation: surviving consumers (shared layouts) refetch and
+            // hold the commit, so the destination never paints stale data
+            keys && revalidate(keys, false);
+
+            // Hold the read pending on the client: the navigation unmounts this
+            // consumer, and resolving `undefined` instead hands a missing value
+            // to whatever renders before the transition commits (a downstream
+            // `.map()` crashes). The server keeps resolving — its render can't
+            // await a navigation and the 302 discards the body anyway.
+            return isServer ? undefined : new Promise(() => {});
           }
           if (hasEnveloped) v = enveloped;else if (v.body) {
             // responses the transport hands over whole (revalidation) carry a
@@ -2660,7 +2711,11 @@ function applyResponseMetadata(metadata, navigate, flightData) {
   cacheKeyOp(keys, entry => entry[0] = 0);
   // set cache
   flightData && Object.keys(flightData).forEach(k => query.set(k, flightData[k]));
-  // trigger revalidation
+  // trigger revalidation inside the same transition as the navigation, so
+  // the redirect commits atomically with fresh data: surviving consumers
+  // (shared layouts) the flight payload didn't seed refetch and hold the
+  // commit rather than painting stale and updating after. Seeded entries
+  // are fresh again by now, so the sweep re-reads them from cache.
   revalidate(keys, false);
 }
 async function handleResponse(response, error, navigate, metadataHandled) {

package/dist/routing.js

@@ -621,6 +621,13 @@ export function createRouterContext(integration, branches, getContext, options =
         get pendingTarget() {
             return lastTransitionTarget;
         },
+        leaving(route) {
+            const t = lastTransitionTarget;
+            if (!t || !route.retained)
+                return false;
+            const pathname = t.value.split(/[?#]/, 1)[0];
+            return !route.retained(options.transformUrl ? options.transformUrl(pathname) : pathname);
+        },
         renderPath,
         parsePath,
         navigatorFactory,
@@ -650,16 +657,27 @@ export function createRouterContext(integration, branches, getContext, options =
             // typed path proxy nodes coerce to their href
             if (typeof to !== "string")
                 to = to.toString();
-            const queryOnly = !to || to[0] === "?";
             const { replace, resolve, scroll, state: nextState } = {
                 replace: false,
-                resolve: !queryOnly,
+                resolve: true,
                 scroll: true,
                 ...options
             };
-            const resolvedTo = resolve
-                ? route.resolvePath(to)
-                : resolvePath((queryOnly && location.pathname) || "", to);
+            // A string means what the same string means as an href. Leading "/"
+            // stays base-prefixed; anything else resolves URL-style against the
+            // current location — `new URL` collapses `..` and handles `?`/`#`-only
+            // references natively (#502). A cross-origin result (scheme or
+            // protocol-relative input) falls through as unroutable.
+            let resolvedTo;
+            if (!resolve)
+                resolvedTo = resolvePath(((!to || to[0] === "?") && location.pathname) || "", to);
+            else if (to[0] === "/")
+                resolvedTo = route.resolvePath(to);
+            else {
+                const url = new URL(to, mockBase + location.pathname + location.search + location.hash);
+                resolvedTo =
+                    url.origin === mockBase ? url.pathname + url.search + url.hash : undefined;
+            }
             if (resolvedTo === undefined) {
                 throw new Error(`Path '${to}' is not a routable path`);
             }
@@ -797,6 +815,13 @@ export function createRouteContext(router, parent, outlet, match, matches = () =
         pattern,
         params,
         path,
+        retained(target) {
+            const m = match();
+            const p = m.route.matcher(target);
+            // params derive from the matched path, so equal paths mean this
+            // section instance (layouts match prefixes via partial matchers)
+            return !!p && p.path === m.path;
+        },
         outlet: () => component
             ? createComponent(component, {
                 params,

package/dist/types.d.ts

@@ -74,6 +74,12 @@ export interface Location<S = unknown> extends Path {
     key: string;
 }
 export interface NavigateOptions<S = unknown> {
+    /**
+     * Resolve the target like an href: leading-`/` paths are prefixed with the
+     * router base, anything else resolves URL-style against the current
+     * location (`..` collapses, `?`/`#`-only strings keep the path). `false`
+     * takes the string as the final path. Defaults to `true`.
+     */
     resolve: boolean;
     replace: boolean;
     scroll: boolean;
@@ -238,6 +244,8 @@ export interface RouteContext {
     path: () => string;
     outlet: () => JSX.Element;
     resolvePath(to: string): string | undefined;
+    /** Whether this route section still matches `target` (same matched path), i.e. survives a navigation there. Absent on the base route, which always survives. */
+    retained?(target: string): boolean;
 }
 export interface RouterUtils {
     renderPath(path: string): string;
@@ -256,6 +264,8 @@ export interface RouterContext {
     isRouting: () => boolean;
     /** The target of the in-flight navigation transition, if any. Not reactive. */
     readonly pendingTarget?: LocationChange;
+    /** Whether `route` is a section the in-flight navigation is leaving. False when no navigation is pending. */
+    leaving?(route: RouteContext): boolean;
     matches: () => RouteMatch[];
     renderPath(path: string): string;
     parsePath(str: string): string;

package/package.json

@@ -6,7 +6,7 @@
     "Ryan Turnquist"
   ],
   "license": "MIT",
-  "version": "2.0.0-next.12",
+  "version": "2.0.0-next.13",
   "homepage": "https://github.com/solidjs/solid-router#readme",
   "repository": {
     "type": "git",