Skip to content
Flint
Blog

roleRedundancies

Reports redundant ARIA roles on elements with implicit roles.

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

HTML elements have default semantics implemented by the browser, including implicit ARIA roles. Setting an explicit role that matches the element’s implicit role is redundant and should be removed.

Examples

Section titled “Examples”
CE6buttCB0roA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Dbutt1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>CE6iCB0roA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Di1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AB0sA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Dfoo.j1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>CE6nCB0roA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Dnavigati1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>
<44AE spans="tyle--0:#7F">DECE6buDBC<>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECE6buD61B04<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4Dpresenta1<111" spans="tyle--0:#7FDBCA;--1:#88">44A<" />di><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECE<6img spans="tyle--0:#7F">D61B<0src spans="tyle--0:#C792EA;--1:#88">4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4Dfoo<.jpg spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#7FDBCA;--1:#88">44A<" />di><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECE<6nav spans="tyle--0:#7F">DBCdi>

When Not To Use It

Section titled “When Not To Use It”

If you need to explicitly set roles for documentation purposes, you may want to disable this rule.

Further Reading

Section titled “Further Reading”

Equivalents in Other Linters

Section titled “Equivalents in Other Linters”