RMD039 — class where className was meant

Ramonda reads className, and a class written on an element is renamed to it before the vnode is built. So the element is styled and the page is not broken — this says the source does not match what the element gets, and names the two cases where the rename cannot save it.

className on the same element wins, and the class beside it is dropped without a word:

<span class="muted" className="loud" />   // renders class="loud"; "muted" goes nowhere

A component is renamed too. <Panel class="muted" /> reaches Panel as className, so a class prop that component declared reads undefined on every render:

class Panel extends Component<{ class?: string }> {
  render() { return <span>{this.props.class}</span>; }   // always undefined
}

This is the one place the JSX deliberately differs from HTML, and the reason is the language: class is a reserved word in the object a JSX factory receives.

Reported once per component and tag, so converting a codebase gets one report per place rather than one for the first class and silence for the rest. ramonda-check reports the same attribute before it renders, as class-instead-of-classname.

Next

• All diagnostics — every code the framework can report.
• Checking your app — the faults proved from the source, before anything runs.