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

In a worker, native functions read through `window` throw "Illegal invocation" (`window.setTimeout`, `window.requestAnimationFrame`)

Đang mở
  • Có gì không ổn?
#345 0 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 17 ngày

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

Đánh giá

Độ khó
3/5
Thời gian dự kiến
Nửa ngày
Mức phù hợp với người mới
50/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
javascript
Lĩnh vực
web-dev

Hướng nghiên cứu

Start with the get trap of the window Proxy in esm/interface/document.js around lines 133-135, which falls back to globalThis[name], and reproduce with the worker test case from the issue. Native functions read through the proxy need to be bound to globalThis while constructors such as Event and URL stay unchanged, so check that new and instanceof still work. Done means window.setTimeout, window.queueMicrotask and window.requestAnimationFrame run without Illegal invocation in a browser worker, and the existing suite still passes.

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

Mô tả

document.defaultView (the window that parseHTML returns) is a Proxy over globalThis. Anything it does not define itself comes from globalThis[name] (esm/interface/document.js#L133-L135). For the realm's native functions, the call then runs with the proxy as this, and browsers reject that. Node does not check, so this shows up only in a browser, e.g. in a worker with linkedom/worker.

This is common in practice. d3-timer captures window.requestAnimationFrame.bind(window) when it loads, so any d3 transition created while window is linkedom's window throws.

Minimal test case: save this as an HTML file, serve it from any local server, and open it in Chrome.

<!doctype html>
<meta charset="utf-8">
<pre id="out">running…</pre>
<script type="module">
const source = `
import { parseHTML } from 'https://cdn.jsdelivr.net/npm/[email protected]/worker.js';
const { window } = parseHTML('<!doctype html><html><body></body></html>');
const result = {};
const cases = {
  'self.setTimeout(f)': () => self.setTimeout(() => {}),
  'window.setTimeout(f)': () => window.setTimeout(() => {}),
  'window.queueMicrotask(f)': () => window.queueMicrotask(() => {}),
  'window.requestAnimationFrame(f)': () => window.requestAnimationFrame(() => {}),
  'window.requestAnimationFrame.bind(window)(f)': () => window.requestAnimationFrame.bind(window)(() => {}),
};
for (const [name, run] of Object.entries(cases)) {
  try { run(); result[name] = 'ok'; } catch (e) { result[name] = e.name + ': ' + e.message; }
}
postMessage(result);
`;
const url = URL.createObjectURL(new Blob([source], { type: 'text/javascript' }));
const worker = new Worker(url, { type: 'module' });
worker.onmessage = (e) => { document.getElementById('out').textContent = JSON.stringify(e.data, null, 2); };
</script>

Chrome 156, linkedom 0.18.12. The worker.js committed on main (3fcf145) gives the same result:

self.setTimeout(f)                              ok
window.setTimeout(f)                            TypeError: Illegal invocation
window.queueMicrotask(f)                        TypeError: Illegal invocation
window.requestAnimationFrame(f)                 TypeError: Illegal invocation
window.requestAnimationFrame.bind(window)(f)    TypeError: Illegal invocation

Expected: the same as self.setTimeout(f), as it would be with a real window.

Possible direction (not tested against the suite): in the proxy's get, when the value comes from globalThis and is a function that is not a constructor, return it bound to globalThis, once per name. Classes (Event, URL, …) would stay as they are, so new and instanceof keep working. Telling the two apart is the delicate part, which is why this is an issue and not a PR.

Workaround on our side: before d3 loads, assign plain functions to window.requestAnimationFrame and window.cancelAnimationFrame (they wrap setTimeout/clearTimeout). The proxy's set writes them onto globalThis, which replaces the native ones, and get then returns those plain functions.

Ngôn ngữ chính
HTML
Star
2.1k
Fork
110
Merge trung bình
11 ngày 1 giờ
Pull request đã merge (30 ngày)
1

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

Dự án này không cung cấp dev container, Dockerfile hay hướng dẫn đóng góp, nên bạn cần tự thiết lập môi trường: hãy bắt đầu từ README và xem hướng dẫn đóng góp lần đầu của chúng tôi để biết các bước chung.

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 WebReflection/linkedom

Tất cả issue của WebReflection/linkedom

Issue tương tự

Thêm issue về Web Dev

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.