roleRequiredAriaProps

Reports ARIA roles missing their required ARIA properties.

✅ This rule is included in the jsx logical and logicalStrict presets.

ARIA roles define how elements are exposed to assistive technologies like screen readers. Some roles require specific ARIA properties to function correctly and provide meaningful information to users. Omitting these required properties can result in incomplete or confusing experiences for users of assistive technologies.

Examples

❌ Incorre

CE6dCB0roA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Dcheckb1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>CE6dCB0roA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Dslid1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AB0aria-valuenA1<1"sp ansty="le--0:#ECC48D;--1:#984E">41<1"sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>CE6spCB0roA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Dcombob1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>CE6dCB0roA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Dheadi1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>

<44AE spans="tyle--0:#7F">DECE<6div spans="tyle--0:#7F">D61B04<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4Dchec1<111" spans="tyle--0:#7FDBCA;--1:#88">4<4AE spans="tyle--0:#C5E478;--1:#3B">61B0aria-che4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4Df1<111" spans="tyle--0:#7FDBCA;--1:#88">44A<" /><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECE<6div spans="tyle--0:#7F">D61B04<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4Dsl1<111" spans="tyle--0:#7FDBCA;--1:#88">4<4AE spans="tyle--0:#C5E478;--1:#3B">61B0aria-valu4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">41<111" spans="tyle--0:#7FDBCA;--1:#88">4<4AE spans="tyle--0:#C5E478;--1:#3B">61B0aria-valu4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E<4D10 spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#7FDBCA;--1:#88">4<4AE spans="tyle--0:#C5E478;--1:#3B">61B0aria-valu4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">41<111" spans="tyle--0:#7FDBCA;--1:#88">44A<" />di><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECE6D61B04<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4Dcomb1<111" spans="tyle--0:#7FDBCA;--1:#88">4<4AE spans="tyle--0:#C5E478;--1:#3B">61B0aria-cont4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4Dlis1<111" spans="tyle--0:#7FDBCA;--1:#88">4<4AE spans="tyle--0:#C5E478;--1:#3B">61B0aria-expa4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4Df1<111" spans="tyle--0:#7FDBCA;--1:#88">44A<" />di><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECE<6div spans="tyle--0:#7F">D61B04<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4Dhea1<111" spans="tyle--0:#7FDBCA;--1:#88">4<4AE spans="tyle--0:#C5E478;--1:#3B">61B0aria-l4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">41<111" spans="tyle--0:#7FDBCA;--1:#88">44A<" />di>

When Not To Use It

If you are using a custom framework that populates valid ARIA property roles for you, you might not need this rule.

Further Reading

• WAI-ARIA Roles Model
• ARIA Required States and Properties

Equivalents in Other Linters

• Biome: useAriaPropsForRole
• ESLint: jsx-a11y/role-has-required-aria-props
• Oxlint: jsx-a11y/role-has-required-aria-props