Skip to content
Flint
Blog

scopeProps

Reports scope props on non-th elements.

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

The scope attribute defines whether a table header is a column header or row header. Using it on non-<th> elements has no semantic meaning and may confuse assistive technologies.

This is required for WCAG 1.3.1 and 4.1.1 compliance.

Examples

Section titled “Examples”
CE6dCB0scoAE d ivclassNa="meco">d>d>d>CE6dCB0scoA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Dc1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>CE6CB0scoA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Dr1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>
<44AE spans="tyle--0:#7F">DECD61B0s4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E41<111" spans="tyle--0:#7FDBCA;--1:#88">44A<" /><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECD61B0s4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E41<111" spans="tyle--0:#7FDBCA;--1:#88">44A<" />di><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECD61B0s4<4AE= spans="tyle--0:#E2817F;--1:#B2">3<834{ spans="tyle--0:#D6DEEB;--1:#40">3F53s3<834} spans="tyle--0:#7FDBCA;--1:#88">44A<} />di><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECE<6div spans="tyle--0:#7F">DBCdi>

When Not To Use It

Section titled “When Not To Use It”

If you’re not working with HTML tables, you can disable this rule.

Further Reading

Section titled “Further Reading”

Equivalents in Other Linters

Section titled “Equivalents in Other Linters”