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

Inline event handlers in sub-app HTML survive the build: dead under CSP, and a dark-mode leak without it

クローズ
  • 何か問題がありますか？
#67 コメント 0 件 リアクション 0 件 担当者 1 名 GitHub で見る

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

@oto-macenauer-absa がすでに取り組んでいます。

2026年8月14日 から。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
50/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
静か
技術スタック
html, javascript
領域
build-system, documentation

調査の方向性

Start in src/utils/transform.js, where inline <script> handling is implemented, and add policy logic for on* event attributes in the same transform pipeline. Check scripts/hoist-inline-scripts.js and the docs-example onclick snippet for expected behavior, then extend tests/build-integrity.spec.js so it asserts the output has no inline event-handler attributes. Update contract/HEADLESS_RULES.md accordingly; done means tests pass and the new invariant is documented in that rule file.

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

説明

Summary

The "nothing inline in the output" invariant is enforced for <script> elements only. Inline event-handler attributes are neither hoisted nor stripped, and script-src 'self' blocks them exactly like an inline script.

The vendored docs-example fixture ships one, and it reaches dist/:

<button id="theme-toggle" aria-label="Toggle theme" onclick="
  const r=document.getElementById('docs-root');
  r.classList.toggle('dark');
  localStorage.setItem('theme',r.classList.contains('dark')?'dark':'light');
">

Two problems

  1. It is dead code in production. script-src 'self' with no 'unsafe-inline' blocks inline handlers, so the button is inert and logs a CSP violation when clicked. scripts/hoist-inline-scripts.js exists precisely so that already-published bundles keep working under the policy; it does not cover this case, so any doc app whose interactivity is written as onclick= is quietly broken instead.
  2. It is a light-only leak wherever the CSP is absent. astro dev and astro preview serve no CSP, so there the toggle works and adds dark to the sub-app root — the exact thing transform.js strips the theme bootstrap to prevent (#48).

tests/build-integrity.spec.js asserts every <script> has a src, which is why this got through. Nothing asserts on on* attributes.

Suggested fix

Decide between the two available policies and apply it in src/utils/transform.js, where the document is already parsed:

  • Strip on* attributes. Honest about what production does — the handler cannot run anyway — and closes the dev-mode dark leak. Cost: a doc app's inline interactivity disappears rather than failing loudly.
  • Hoist them, the way <script> bodies are hoisted: turn onclick="…" into a listener registered from a generated file. Preserves behaviour, but needs a stable element handle and is a good deal more machinery.

Either way, add the assertion to tests/build-integrity.spec.js so the invariant covers attributes and not just elements, and say so in contract/HEADLESS_RULES.md — this is a rule onboarding repositories need to know about.

Separately worth deciding whether the docs-example fixture should keep shipping a dark-mode toggle at all, given the marketplace is light-only.

主要言語
JavaScript
スター
0
フォーク
0
平均マージ
55分
マージ済み PR（30日）
10

環境構築

はじめの一歩

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

AbsaOSS/knowledge-base のほかの issue

AbsaOSS/knowledge-base の issue をすべて見る

似ている issue

JavaScript の issue をもっと見る

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

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