Optimistically mounted component appears before its dynamic style is applied
メンテナーはふだん 1 日以内に返信
まだ誰も着手していません。
評価
- 難易度
- 3/5
- 見積もり時間
- 半日
- 初心者へのやさしさ
- 65/100
- issue の種類
- バグ
- 明瞭さ
- 明確に書かれている
- 活発さ
- 活発
- 技術スタック
- javascript, typescript
- 領域
- frontend
調査の方向性
Start from the optimistic mounting and memo implementation in the rendering pipeline. The issue involves createMemo and style application during optimistic renders. Use the playground reproduction to verify the behavior. The fix should ensure the component either waits for styles before mounting or uses the committed signal value for the initial render.
索引モデルが issue の本文から書いたものです。
説明
Describe the bug
An optimistically mounted component reveals its static text before applying its dynamic style.
The component returns a memo containing an element whose color is always either red or blue. Its style and an inner conditional read the same non-optimistic signal. While an action holds that signal's update, clicking Run reveals <div>Hello</div> with no style attribute. After two seconds it becomes <div style="color: blue;">Hello world</div>.
The issue is the unstyled intermediate element, not that the blue update waits for the action.
Your Example Website or App
https://s.olid.uk/id/cu5JVqDbSkWlmoERReb30Q
Steps to Reproduce the Bug or Issue
- Open the playground and click Run once.
- During the two-second action, observe that Hello appears in the default black color. Inspecting its element shows no
styleattribute. - When the action finishes, the text becomes Hello world and the blue style is applied.
Expected behavior
Either keep the child held until it can render consistently, or reveal it using the committed signal value (false, so red). Revealing the element without either declared color is inconsistent.
Screenshots or Videos
No response
Platform
- OS: Linux (WSL)
- Browser: Chromium 153.0.8010.12
- Solid: preview build
3ab71b0(solid-js,@solidjs/web, and@solidjs/signals)
Additional context
Removing the component's createMemo wrapper or replacing its inner conditional text with static text avoids the unstyled intermediate element. The repro uses only signals, an optimistic signal, an action, and a real timer; Tailwind is disabled.
- 主要言語
- TypeScript
- スター
- 36.1k
- フォーク
- 1.1k
- 平均マージ
- 13時間 13分
- マージ済み PR（30日）
- 306
環境構築
- Dockerfile・Docker Compose ファイルなし
- プルリクエストのテンプレートあり
- コントリビューションガイドを読む
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
solidjs/solid のほかの issue
-
難易度 3/5 1〜2日 初心者へのやさしさ 70/100
メンテナーはふだん 1 日以内に返信
-
難易度 3/5 1〜2日 初心者へのやさしさ 45/100
メンテナーはふだん 1 日以内に返信
-
難易度 4/5 3〜5日 初心者へのやさしさ 55/100
メンテナーはふだん 1 日以内に返信
-
Per-scope takeover for live nodes whose server value is still streaming (D8 follow-up to #3817)オープン
難易度 4/5 3〜5日 初心者へのやさしさ 45/100
メンテナーはふだん 1 日以内に返信
-
難易度 4/5 3〜5日 初心者へのやさしさ 48/100
メンテナーはふだん 1 日以内に返信
似ている issue
-
refactor
難易度 2/5 1〜3時間 初心者へのやさしさ 76/100
tomnewport/memprot-topo#55 ·
-
難易度 2/5 1〜3時間 初心者へのやさしさ 72/100
WalletConnect/walletconnect-monorepo#7368 · コメント 1 件 ·
メンテナーはふだん 1 日以内に返信
-
enhancement
難易度 2/5 1〜3時間 初心者へのやさしさ 72/100
BU-Spark/se-chem-apll#47 ·
-
embed: handleTurboSignMessage header comment says the signing page posts to '*' (it never does)オープンdocumentation
難易度 2/5 1時間未満 初心者へのやさしさ 82/100
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 半日 初心者へのやさしさ 70/100
udistrital/paginaweb_root#23 ·