Svelte

fix: treat CSS attribute selectors as case-insensitive for HTML enumerated attributes

#17712

Closing issue

Pull request

Merged
V
veeceey
Feb 15, 2026, 10:10 AM

Fixes

CSS attribute selectors for HTML enumerated attributes (like method, type, dir, etc.) are supposed to match case-insensitively per the HTML spec. Browsers handle this correctly — form[method="get"] matches <form method="GET">. But Svelte's CSS pruning was doing a strict case-sensitive comparison, which meant:

  1. The selector got incorrectly flagged as unused (no css_unused_selector warning was shown when spreads were involved, but the selector was still pruned)
  2. The scoping class wasn't applied to the matching element
  3. Styles silently disappeared in production builds

The fix adds a set of known HTML attributes with case-insensitive enumerated values (sourced from the HTML spec) and uses it during CSS attribute selector matching. The explicit CSS s flag still overrides this behavior, as expected.

Before

<form method="GET">
  <h1>Hello</h1>
</form>

<style>
  form[method="get"] h1 { color: red; }
  /* ^ incorrectly pruned, <h1> not styled */
</style>

After

The selector correctly matches and styles are applied.

Test plan

  • Added attribute-selector-html-case-insensitive CSS test covering form[method] and input[type] cases
  • All 179 existing CSS tests pass
  • Verified the existing attribute-selector-case-sensitive test (using s flag) still works correctly
  • Compiler error tests and validator tests all pass
👍 1

Info

Merged at Feb 17, 2026, 2:54 PM
Merged by Rich-Harris
Assignees None
Reviewers None
Labels None
Milestone None

Pro tip: You can prefix GitHub URLs of issues, PRs or discussions with svcl.dev/ to view them on this page! Also try it on a GitHub release ;)