Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

[2.0] The MIGRATION.md replacement for `from()` keeps the upstream subscription after dispose; add a subscription helper

Đang mở
  • Có gì không ổn?
#4,182 1 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

Chưa có ai nhận issue này.

Đánh giá

Độ khó
5/5
Thời gian dự kiến
Hơn một tuần
Mức phù hợp với người mới
35/100
Loại issue
Tính năng
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
typescript
Lĩnh vực
backend-api-design

Hướng nghiên cứu

Start with documentation/solid-2.0/MIGRATION.md and the consumeIterator behavior described in the issue; the minimal reproduction shows how disposal leaves the upstream subscription open. Compare the migration guidance with the From React page additions referenced in the payload. Done means the docs explain safe teardown and an official reusable subscription approach is available or the issue’s API proposal has a clear resolution.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

Describe the bug

documentation/solid-2.0/MIGRATION.md ("from / observable → async iterators / effects") recommends:

const value = createMemo(async function* () {
  for await (const val of observable$) yield val;
});

After the owner is disposed, the upstream iterator's return() is not called. It runs only when the upstream produces another value, which may never happen. The cause is that the generator is suspended at an await (inside for await), so its return() is queued behind the pending step. Solid's side is correct: consumeIterator calls return() on dispose and on supersede.

Your Example Website or App

Minimal repro inline below (signals-only).

Steps to Reproduce the Bug or Issue
import { createMemo, createRoot, createRenderEffect, flush } from "@solidjs/signals";

let push: (v: number) => void;
let closed = 0;
const observable$: AsyncIterable<number> = {
  [Symbol.asyncIterator]: () => ({
    next: () => new Promise(r => (push = v => r({ value: v, done: false }))),
    return: async () => { closed++; return { value: undefined, done: true }; }
  })
};

const dispose = createRoot(d => {
  const value = createMemo(async function* () { for await (const v of observable$) yield v; }, { loadingValue: 0 });
  createRenderEffect(value, v => console.log("value", v));
  return d;
});
flush(); push!(1); /* await a few microtasks */ flush(); // logs 0, 1

dispose(); /* await 50 microtasks */
console.log(closed); // 0: upstream still subscribed
push!(2);  /* await */
console.log(closed); // 1: closes only after the next upstream value

By contrast, a hand-written iterator whose return() unsubscribes synchronously behaves well. I tested:

  • isPending stays false while the memo waits for the next value;
  • loadingValue covers the first read;
  • return() unsubscribes immediately on dispose;
  • bursts coalesce into one update with a dirty flag.

It's about 20 lines and easy to get wrong:

function fromSubscription<T>(subscribe: (cb: () => void) => () => void, getSnapshot: () => T): AsyncIterable<T> {
  return {
    [Symbol.asyncIterator]() {
      let dirty = true, done = false;
      let wake: ((r: IteratorResult<T>) => void) | undefined;
      const unsubscribe = subscribe(() => {
        dirty = true;
        if (wake) { const w = wake; wake = undefined; dirty = false; w({ value: getSnapshot(), done: false }); }
      });
      return {
        next: () => {
          if (done) return Promise.resolve({ value: undefined, done: true });
          if (dirty) { dirty = false; return Promise.resolve({ value: getSnapshot(), done: false }); }
          return new Promise(r => (wake = r));
        },
        return: () => {
          done = true; unsubscribe();
          wake?.({ value: undefined, done: true }); wake = undefined;
          return Promise.resolve({ value: undefined, done: true });
        }
      };
    }
  };
}
Expected behavior
  • Docs: fix the MIGRATION.md snippet so disposal actually unsubscribes, and document (or flag in dev) that async function* + await delays teardown until the next upstream value.
  • API: provide a helper equivalent to React's useSyncExternalStore / Solid 1's from: 
    const online = createMemo(() => fromSubscription(subscribe, () => navigator.onLine), { loadingValue: true });
    MIGRATION.md says this is expected to "move into @solid-primitives". Given how central external stores are to incremental migrations (keeping existing domain stores and putting Solid on top), it may be worth a minimal version in core. Either way, a correct, reusable implementation should exist somewhere official.
Screenshots or Videos

No response

Platform
  • OS: macOS (Darwin 25.5)
  • Browser: n/a (reproduced in Node v24.18.0 with vitest, importing source)
  • Version: solid next @ b0ad1df50 (2026-10-20, after 2.0.0-rc.16)
Additional context

This came up while documenting useSyncExternalStore for the From React page (solidjs/solid-docs#1664). The From React additions describe the hand-written iterator and warn against async function* for this.

Ngôn ngữ chính
TypeScript
Star
36.2k
Fork
1.1k
Merge trung bình
11 giờ 17 phút
Pull request đã merge (30 ngày)
371

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của solidjs/solid

Tất cả issue của solidjs/solid

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.