react/no-invalid-html-attribute

Reports static HTML attributes and literal values that HTML5 metadata forbids for a React DOM intrinsic element. It is enabled in recommended.

The rule uses the checked-in HTML metadata contract in lib/html5-attributes.js. The module is published with this package, so linting does not read the filesystem or load an external validator at runtime. To update the metadata, verify the change against the relevant WHATWG section, record the source link, inspect the data diff, and run pnpm run quality:complete.

Read HTML and React attribute contract before changing the metadata or adding a manual exception. It defines the authoritative sources, the HTML-versus-React boundary, and the required review matrix.

Incorrect

<div href="/docs" />

<button type="link" />

<input type="telephone" />

import React from 'react';

React.createElement('form', { method: 'put' });

Correct

<button type="submit" data-variant="compact" aria-label="Save" />

<button type="submit" name="operation">Save</button>

<div align="center" />

Obsolete-but-valid HTML is intentionally not reported. data-* and aria-* attributes are also outside this rule; use an accessibility-focused tool for ARIA semantics.

Boundaries

The rule analyzes lowercase HTML elements in JSX and statically proven React.createElement calls. PascalCase components, custom elements, React Native host components, SVG and MathML are skipped. Dynamic values, unknown spreads, and unknown attribute spellings are skipped as well: spelling belongs to Biome's suspicious/noUnknownAttribute, and this rule avoids duplicating it.

No automatic fix is offered because removing or changing an attribute can alter application behavior.