2.0.0-rc.20: a memo that calls isPending()/latest() on an unrelated signal makes a branch opened by a held update read the pre-hold world; <Loading> never settles

オープン
#4,544 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 1 日以内に返信

まだ誰も着手していません。

評価

難易度
5/5
見積もり時間
1週間以上
初心者へのやさしさ
8/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
活発
技術スタック
typescript
領域
frontend

調査の方向性

The reproduction is the it.each block around arrive(probe), which renders a Loading root with a Show branch and runs the three probes against the chrome memo. Start by reading how isPending and latest interact with memo reads inside a held Loading boundary, then run the three probes to confirm plain read passes and the other two hang on root. Done means all three probes return rows and the held update settles, which requires understanding the signals reactivity internals, not a local edit.

索引モデルが issue の本文から書いたものです。

説明

Describe the bug

A held update (an async memo under the root <Loading>) writes session and opens <Show when={session() !== undefined}>. Inside, params is a memo that reads session and a chrome memo; chrome reads an unrelated signal plan, which is written afterwards outside the hold.

If chrome reads plan plainly, the branch reads session as "acc" and the hold lands. If chrome calls isPending(plan) or latest(plan) instead, params observes signedIn: false inside the branch whose condition already observed session !== undefined. The branch reads a lazy memo that never resolves (only reachable while signed out), and the root <Loading> stays on root forever.

Two plain reads of session on one screen disagree (the tear RULES-DERIVED.md D-27 forbids), and a display-ahead reader ends up holding the change it read ahead of (contradicts F-6: "display-ahead readers never hold the change they read ahead of").

Reproduces on rc.13, rc.20 and next@215c365 (not a regression). Related closed issues: #4010, #4426.

Steps to Reproduce
import { render } from "@solidjs/web";
import { createMemo, createSignal, isPending, Loading, latest, Show } from "solid-js";
import { expect, it } from "vitest";

const wait = (ms: number) => new Promise((r) => setTimeout(r, ms));
const NEVER = new Promise<never>(() => {});

type Probe = "plain read" | "isPending" | "latest";

async function arrive(probe: Probe): Promise<string | null | undefined> {
  const [session, setSession] = createSignal<string | undefined>(undefined);
  const [plan, setPlan] = createSignal(false);
  const [gate, setGate] = createSignal(0);
  let release: () => void = () => {};

  function Page() {
    // The only difference between the cases is how this memo reads `plan`.
    const chrome = createMemo(() =>
      probe === "isPending" ? (isPending(plan), plan()) : probe === "latest" ? latest(plan) : plan(),
    );
    const params = createMemo(() => ({ plan: chrome(), signedIn: session() !== undefined }));
    const signedOutOnly = createMemo(() => NEVER, { lazy: true });
    return (
      <Show when={session() !== undefined} fallback={<i>signed out</i>}>
        <b>{params().signedIn ? "rows" : signedOutOnly()}</b>
      </Show>
    );
  }
  const held = createMemo(() => {
    const g = gate();
    return g === 0 ? g : new Promise<number>((r) => (release = () => r(g)));
  });

  const el = document.createElement("div");
  const dispose = render(
    () => (
      <Loading fallback={<i>root</i>}>
        <span>{held()}</span>
        <Page />
      </Loading>
    ),
    el,
  );
  await wait(10);
  setGate(1);
  setSession("acc");
  await wait(5);
  setPlan(true);
  await wait(5);
  release();
  await wait(50);
  const out = el.querySelector("b")?.textContent ?? el.querySelector("i")?.textContent;
  dispose();
  return out;
}

it.each<Probe>(["plain read", "isPending", "latest"])(
  "%s of an unrelated signal upstream: the branch the hold opens reads the hold's session and the hold lands",
  async (probe) => {
    expect(await arrive(probe)).toBe("rows");
  },
);

package.json

{
  "name": "solid-repro",
  "private": true,
  "type": "module",
  "scripts": { "test": "vitest run" },
  "dependencies": {
    "solid-js": "2.0.0-rc.20",
    "@solidjs/web": "2.0.0-rc.20",
    "@solidjs/signals": "2.0.0-rc.20"
  },
  "devDependencies": {
    "@solidjs/vite-plugin": "3.0.0-next.54",
    "jsdom": "30.1.2",
    "vitest": "5.0.5"
  }
}

vitest.config.ts

import solid from "@solidjs/vite-plugin";
import { defineConfig } from "vitest/config";

export default defineConfig({
  plugins: [solid()],
  test: { environment: "jsdom" },
});
Expected behavior

rows for all three probes: the only difference is how chrome reads an unrelated signal.

Actual behavior

plain read → rows; isPending and latest → root forever.

主要言語
TypeScript
スター
36.2k
フォーク
1.1k
平均マージ
11時間 5分
マージ済み PR(30日)
475

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

solidjs/solid のほかの issue

solidjs/solid の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。