hidden="until-found" がAstro/Reactコンポーネントのスプレッドで値が落ちる
Maintainers usually reply within 1 day
Nobody has claimed this yet.
Assessment
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Newbie friendliness
- 42/100
- Issue type
- Bug
- Clarity
- Mostly clear
- Activity status
- Stale
- Tech stack
- react, typescript
- Domain
- frontend
Research direction
Read Lism.astro and setAccordion.js, then trace how hidden="until-found" passes through the component prop spread and how ACCORDION_HIDDEN_VALUE is obtained. Reproduce the static and spread cases described in the issue; done means the rendered attribute retains "until-found" and accordion interactions do not replace it with an empty value.
Written by the indexing model from the issue text.
Description
概要
Lismコンポーネントに hidden="until-found" を渡すと、出力されるHTMLでは値が落ちて単なる hidden になってしまう。
原因
Astroのランタイム(render/util.ts)が hidden をboolean属性として扱っているため、{...props} でスプレッドする際に文字列値が無視され、truthy → hidden(値なし)に変換される。
- 静的HTML:
<div hidden="until-found">→ そのまま出力される(OK) - 動的スプレッド:
<div {...{hidden: "until-found"}}>→<div hidden>になる(NG)
Lismコンポーネントは内部で <JSX {...getLismProps(props)}> とスプレッドしているため、後者のパターンに該当する。
getLismProps 自体は hidden: "until-found" を正しくパススルーしており、Lism側のprop処理には問題ない。
参考: React 18でも同様の問題がある(React 19で修正済み)
https://github.com/facebook/react/issues/24740
影響
- Accordionパネルなど
hidden="until-found"を使用するコンポーネントで、ブラウザのページ内検索(Find in Page)が正しく動作しない setAccordion.jsで初期値をgetAttribute('hidden')で取得する処理にも波及し、JS側の開閉後もhidden=""になってしまう(デフォルトの'until-found'が空文字で上書きされる)
対応案
- Lism.astro で
hiddenを特別扱いし、スプレッドではなく直接属性として出力する方法を検討 setAccordion.jsのACCORDION_HIDDEN_VALUE取得ロジックで空文字の場合にデフォルト値を維持する修正
- Dominant language
- TypeScript
- Stars
- 283
- Forks
- 8
- Avg merge
- 6h 37m
- Merged PRs (30d)
- 15
Getting set up
This project ships no dev container, Dockerfile or contributing guide, so setting up is up to you: start from its README, and see our first-contribution guide for the general steps.
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from lism-css/core
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
Maintainers usually reply within 1 day
-
将来的に検討
Difficulty 2/5 1-3 hours Newbie friendliness 65/100
Maintainers usually reply within 1 day
-
Difficulty 3/5 1-2 days Newbie friendliness 55/100
Maintainers usually reply within 1 day
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
Maintainers usually reply within 1 day
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
Maintainers usually reply within 1 day
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 66/100
CopilotKit/openmuse#215 ·
Maintainers usually reply within 3 days
-
b:minor bug
Difficulty 2/5 1-3 hours Newbie friendliness 76/100
software-mansion/argent#1698 ·
Maintainers usually reply within 1 day
-
e2e-failure ready-to-code
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
redhat-developer/rhdh-plugin-export-overlays#4624 · 1 comment ·
Maintainers usually reply within 1 day