Hacktoberfest 2026：メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Registry blocks violate determinism contract: runtime data fetches + async timeline registration (maps, vfx-iphone-device, caption components)

オープン
  • 何か問題がありますか？
#2,107 コメント 2 件 リアクション 0 件 担当者 0 名 GitHub で見る

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

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

評価

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

調査の方向性

Start by locating the us-map, us-map-flow, vfx-iphone-device, and caption-* catalog blocks and reproduce the cited validation builds. Inspect runtime data fetches, asynchronous window.__timelines registration, root backgrounds, projection handling, media lint errors, and caption contrast warnings. Done means the affected blocks render deterministically, register timelines synchronously, and pass the applicable lint and validation checks.

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

説明

triage/needs-triage

Found during systematic validation of the prompting-guide examples (every catalog block exercised via real builds). Three block families break the framework's own composition contract, all fixable with one shared pattern.

Affected blocks

Map blocks (us-map, us-map-flow, likely us-map-bubble, us-map-hex, world-map, spain-map):

  • Fetch topojson from a CDN at render time (fetch("https://cdn.jsdelivr.net/npm/us-atlas@3/states-10m.json") / d3.json(...)) — violates the no-render-time-network determinism rule.
  • Build their entire GSAP timeline inside the async .then() callback, so window.__timelines isn't registered synchronously → the producer's pollSubCompositionTimelines gate times out after 45 seconds and falls back to screenshot capture (same class as the known subcomp poll-timeout issue).
  • us-map additionally paints its background on the composition root (the documented black-frame anti-pattern), and us-map / us-map-flow use incompatible projections (fitSize vs scale/translate) plus opaque backgrounds, so the "layerable" flow/bubble overlays don't actually land on the base map's geography without merging at source.

vfx-iphone-device:

  • Registers its timeline inside an async onReady() (GLTF load + double rAF) → same 45s poll stall on every render.
  • Fails hyperframes lint as a root composition (requestanimationframe_in_composition), and can't be a <template> sub-comp (full HTML doc) — there is no consumption mode where lint passes and validate/inspect can exercise it without editing the block.
  • First ~0.7s of the render is black (scene not yet painted).
  • Ships hardcoded demo screen content with no injection point, though the catalog copy implies you can put "your UI" on the screen.

Caption components (all 15 caption-*):

  • Ship with an empty <video> (no src) → media_missing_src + media_in_subcomposition lint errors standalone; only lint-clean after being pasted into a host with real footage, which the catalog usage text doesn't mention.
  • caption-neon-glow's intentional dim resting state (rgba(0,255,240,0.14)) trips 16 WCAG warnings with no note that they're benign — agents "fix" them and break the identity.

Shared fix pattern

  1. Bake remote data offline (geo topojson → inline projected geometry; validated approach: d3-geo projection at authoring time, zero runtime network).
  2. Register the paused timeline synchronously; move async asset readiness behind the existing media-readiness gates instead of gating timeline registration.
  3. Keep composition backgrounds off the root element.
  4. For the maps: share one projection between base + overlay variants (or ship transparent, projection-matched overlays).
  5. Caption components: ship without the placeholder <video> (or with a documented, lint-exempt placeholder) and note the benign-contrast cases.

Repro evidence

Validation builds with full logs/renders exist for each case (us-map + us-map-flow merged-at-source build; vfx-iphone-device 15s render with 45s stall; caption-highlight/kinetic-slam/neon-glow re-authored builds). Happy to attach details per block.

🤖 Generated with Claude Code

主要言語
TypeScript
スター
54.1k
フォーク
4.9k
平均マージ
7時間 2分
マージ済み PR（30日）
782

環境構築

このプロジェクトには開発コンテナ、Dockerfile、コントリビューションガイドがありません。まず README を読み、一般的な手順ははじめてのコントリビューションガイドを参照してください。

はじめの一歩

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

heygen-com/hyperframes のほかの issue

heygen-com/hyperframes の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

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

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