Skip to content
Flint
Blog

iframeTitles

Reports <iframe> elements without a title prop.

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

The title attribute on <iframe> elements provides a label that describes the iframe’s content to screen reader users. Without it, users may have difficulty understanding the purpose of the iframe.

This is required for WCAG 2.4.1 and 4.1.2 compliance.

Examples

Section titled “Examples”
CE6ifraCA d ivclassNa="meco">d>d>d>CE6ifraCB0sA1<1"sp ansty="le--0:#ECC48D;--1:#984E">4Dhttps://example.c1<1"sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>CE6ifraCB0titA11<""sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>CE6ifraCB0titA3<4{sp ansty="le--0:#82AAFF;--1:#3B61">B0undefin3<4}sp ansty="le--0:#7FDBCA;--1:#8844">AE d ivclassNa="meco">d>d>d>
<44AE spans="tyle--0:#7F">DECE6ifD61B0t4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4DThis is a unique t1<111" spans="tyle--0:#7FDBCA;--1:#88">44A<" /><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECE6ifD61B0t4<4AE= spans="tyle--0:#E2817F;--1:#B2">3<834{ spans="tyle--0:#D6DEEB;--1:#40">3F53uniqueT3<834} spans="tyle--0:#7FDBCA;--1:#88">44A<} />di><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">DECE6ifD61B0t4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4DVideo pl1<111" spans="tyle--0:#7FDBCA;--1:#88">4<4AE spans="tyle--0:#C5E478;--1:#3B">61B<0src spans="tyle--0:#C792EA;--1:#88">4<4AE= spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#ECC48D;--1:#98">4E4Dvideo<.mp4 spans="tyle--0:#D9F5DD;--1:#11">1<111" spans="tyle--0:#7FDBCA;--1:#88">44A<" />di>

When Not To Use It

Section titled “When Not To Use It”

If you’re not using iframes in your application, or your iframes are implicitly handled by a framework, you can disable this rule.

Further Reading

Section titled “Further Reading”

Equivalents in Other Linters

Section titled “Equivalents in Other Linters”