fix(signals): a derived store's per-key isPending reads true under a shown Loading (#4269)

.changeset/derived-store-ispending-boundary-4269.md

@@ -0,0 +1,5 @@
+---
+"@solidjs/signals": patch
+---
+
+A derived store's per-key `isPending` now reads `true` while the derive re-asks under a `Loading` boundary that has shown content, when the verdict is read in the same computation as the value (`${state.a} ${isPending(() => state.a)}`). The derive's first flight left a commit-beneath-a-flight mark that its setter landing never cleared, so the next re-ask suspended the verdict reader to the boundary (which kept the stale screen with `isPending` false) instead of serving it the committed value with `isPending` true, as an async memo does. (#4269)

packages/signals/src/core/async.ts

@@ -4,6 +4,7 @@ import {
   CONFIG_GUESS,
   CONFIG_OVERRIDE,
   CONFIG_HELD,
+  CONFIG_INPUTS_PUBLISHED,
   CONFIG_STAGED,
   CONFIG_STAGED_ERROR,
   CONFIG_SYNC,
@@ -550,8 +551,14 @@ export function handleAsync<T>(
         return;
       }
       // A store derive's landing commits through its setter: unheld, the
-      // shown error leaves now; held, at the derive's commit.
-      if (!(el._config & CONFIG_HELD)) el._x!._shownError = undefined;
+      // shown error leaves now, and so does a commit-beneath-a-flight's
+      // CONFIG_INPUTS_PUBLISHED (its first flight's, #4269) — left standing,
+      // a verdict reader of the next flight would suspend instead of being
+      // served the screen; held, both at the derive's commit.
+      if (!(el._config & CONFIG_HELD)) {
+        el._x!._shownError = undefined;
+        el._config &= ~CONFIG_INPUTS_PUBLISHED;
+      }
       if (wasUninitialized) landStatus(el, true);
       // Attribution hook: this path landed through the setter (derived
       // stores, projections), which does not go through setSignal, so the

packages/signals/tests/derived-store-ispending-boundary-4269.test.ts

@@ -0,0 +1,88 @@
+import { describe, expect, it } from "vitest";
+import {
+  createLoadingBoundary,
+  createMemo,
+  createRenderEffect,
+  createRoot,
+  createSignal,
+  createStore,
+  flush,
+  isPending,
+  untrack
+} from "../src/index.js";
+
+// #4269 (D-30, S-37 row 2): a derived store's leaves report the derive's
+// new-question refetch like any async memo — also when the verdict is read in
+// the same computation as the value, under a boundary that has shown content.
+describe("#4269 derived store per-key isPending under a revealed boundary", () => {
+  const tick = async () => {
+    await new Promise(r => setTimeout(r, 0));
+    flush();
+    await new Promise(r => setTimeout(r, 0));
+    flush();
+  };
+
+  async function run(kind: "store" | "memo", where: "boundary" | "none") {
+    const flights = new Map<string, { p: Promise<any>; resolve: (v: any) => void }>();
+    const fetchKey = (key: string) => {
+      if (!flights.has(key)) {
+        let resolve!: (v: any) => void;
+        const p = new Promise(r => (resolve = r));
+        flights.set(key, { p, resolve });
+      }
+      return flights.get(key)!.p;
+    };
+    const land = async (key: string, v: any) => {
+      flights.get(key)!.resolve(v);
+      await tick();
+    };
+    let screen = "";
+    const [id, setId] = createSignal(1);
+    let dispose!: () => void;
+    createRoot(d => {
+      dispose = d;
+      let a: () => any;
+      if (kind === "store") {
+        const [state] = createStore<any>(async (draft: any) => {
+          const v = await fetchKey("s:" + id());
+          Object.assign(draft, v);
+        }, {});
+        a = () => state.a;
+      } else {
+        const m = createMemo(() => fetchKey("s:" + id()));
+        a = () => (m() as any).a;
+      }
+      const view = () => `${a()} ${isPending(a) ? "pending" : "-"}`;
+      const out =
+        where === "boundary" ? untrack(() => createLoadingBoundary(view, () => "loading")) : view;
+      createRenderEffect(
+        () => out(),
+        v => {
+          screen = v as string;
+        }
+      );
+    });
+    flush();
+    await tick();
+    await land("s:1", { a: 1, b: 1 });
+    expect(screen).toBe("1 -");
+    setId(2);
+    flush();
+    await tick();
+    const pending = screen;
+    await land("s:2", { a: 2, b: 2 });
+    const landed = screen;
+    dispose();
+    return [pending, landed];
+  }
+
+  it("store under a boundary reports pending on the re-ask", async () => {
+    expect(await run("store", "boundary")).toEqual(["1 pending", "2 -"]);
+  });
+  it("memo under a boundary (control)", async () => {
+    expect(await run("memo", "boundary")).toEqual(["1 pending", "2 -"]);
+  });
+  it("store without a boundary (control)", async () => {
+    expect(await run("store", "none")).toEqual(["1 pending", "2 -"]);
+  });
+});