Skip to content

fix: warn when implicit label has no visible text#1864

Open
ShivaniNR wants to merge 3 commits intohtmlhint:mainfrom
ShivaniNR:dev/shivaninr/empty-label-text-warning
Open

fix: warn when implicit label has no visible text#1864
ShivaniNR wants to merge 3 commits intohtmlhint:mainfrom
ShivaniNR:dev/shivaninr/empty-label-text-warning

Conversation

@ShivaniNR
Copy link
Copy Markdown
Contributor

Short description of what this resolves

Closes #1860

An implicit label wrapping an input (<label><input /></label>) without any visible text is inaccessible; screen readers find the input but have no name to announce. After #1852 added implicit label support, this case was silently accepted.

Proposed changes

  • Added a labelHasText flag that resets when an implicit <label> opens
  • Added a text event listener that sets the flag when non-whitespace text is found inside the label
  • On </label> close, if no text was found, nested inputs are marked as unlabeled, so the existing warning fires
  • Updated tests: empty/whitespace-only labels now warn, labels with visible text pass

@ShivaniNR ShivaniNR requested a review from coliff as a code owner April 22, 2026 23:18
Copy link
Copy Markdown
Contributor

@gemini-code-assist gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request updates the input-requires-label rule to ensure that labels with nested inputs contain descriptive, non-whitespace text. While the changes introduce a text listener and updated tests, a logic bug was identified where the use of a single boolean flag incorrectly tracks text presence across multiple or nested labels. The reviewer provides actionable feedback and code suggestions to replace this logic with a state stack, ensuring correct validation for each label's scope.

Comment thread src/core/rules/input-requires-label.ts Outdated
Comment thread src/core/rules/input-requires-label.ts Outdated
Comment thread src/core/rules/input-requires-label.ts Outdated
Comment thread src/core/rules/input-requires-label.ts Outdated
Comment thread dist/core/rules/input-requires-label.js Outdated
Comment thread dist/core/rules/input-requires-label.js Outdated
Comment thread dist/core/rules/input-requires-label.js Outdated
Comment thread dist/core/rules/input-requires-label.js Outdated
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Updates the input-requires-label rule to warn when an implicit <label> (wrapping an <input>) contains no non-whitespace text, closing an accessibility gap introduced when implicit-label support was added in #1852.

Changes:

  • Track per-implicit-label state (text presence + input range) and mark wrapped inputs as unlabeled when the label has no text.
  • Listen to parser text events to detect non-whitespace label content (including within child elements).
  • Expand test coverage for empty/whitespace-only implicit labels and multi-label/nested-label regressions.

Reviewed changes

Copilot reviewed 2 out of 3 changed files in this pull request and generated 1 comment.

File Description
test/rules/input-requires-label.spec.js Updates/extends specs to cover implicit labels with/without visible text.
src/core/rules/input-requires-label.ts Adds label state stack + text listener to detect empty implicit labels and trigger existing warnings.
dist/core/rules/input-requires-label.js Compiled output reflecting the TypeScript rule changes.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread test/rules/input-requires-label.spec.js Outdated
@coliff
Copy link
Copy Markdown
Member

coliff commented Apr 23, 2026

PR looking really good. thanks for your work on this! Just one comment left from Copilot to review I think.

@ShivaniNR
Copy link
Copy Markdown
Contributor Author

PR looking really good. thanks for your work on this! Just one comment left from Copilot to review I think.

Thanks! Moved the two tests to the Error cases block as Copilot suggested.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

input-requires-label: warn when label wraps input but contains no visible text

3 participants