Reports mouse events without corresponding keyboard events.
✅ This rule is included in the jsx logical and logicalStrict presets.
Mouse events should have keyboard equivalents for users who cannot use a mouse.
This ensures that functionality is accessible to all users, such as those with limited hardware or personal disabilities.
Specifically:
onMouseOver must be paired with onFocus
onMouseOut must be paired with onBlur
This is required for WCAG 2.1.1 compliance.
CE6dCB0onMouseOvA3<4{sp ansty="le--0:#D9F5DD;--1:#1111">114{sp><()sp ansty="le--1:#8844">CEA<=>sp ansty="le--0:#7FDB">CA =>sp>()sp><{}sp ansty="le--0:#E2817F;--1:#B238">3{}sp><4}sp ansty="le--0:#7FDBCA;--1:#8844">AE 4}sp>>d ivclassNa="meco"> {}} ">>d>/>d>/>d>CE6dCB0onMouseOA3<4{sp ansty="le--0:#D9F5DD;--1:#1111">114{sp><()sp ansty="le--1:#8844">CEA<=>sp ansty="le--0:#7FDB">CA =>sp>()sp><{}sp ansty="le--0:#E2817F;--1:#B238">3{}sp><4}sp ansty="le--0:#7FDBCA;--1:#8844">AE 4}sp>>d ivclassNa="meco"> {}} ">>d>/>d>/>d> <44AE spans="tyle--0:#7F">D44AE>ECE<6div spans="tyle--0:#7F">D6div>61B0onMouse4<4AE= spans="tyle--0:#E2817F;--1:#B2">34AE=><834{ spans="tyle--0:#D9F5DD;--1:#11">11834{><11() spans="tyle--1:#88"><44AE spans="tyle--0:#7F">D44AE>92 spans="tyle--0:#7F">DBC>11()>3<834} spans="tyle--0:#7FDBCA;--1:#88">4834}><4AE spans="tyle--0:#C5E478;--1:#3B">61B0onF4AE >4<4AE= spans="tyle--0:#E2817F;--1:#B2">34AE=><834{ spans="tyle--0:#D9F5DD;--1:#11">11834{><11() spans="tyle--1:#88"><44AE spans="tyle--0:#7F">D44AE>92 spans="tyle--0:#7F">DBC>11()>3<834} spans="tyle--0:#7FDBCA;--1:#88">44A834}> {}} onFocus={() => {}"><} />} /><>di vdivclass="Nameexpressive-"><44AE spans="tyle--0:#7F">D44AE>ECE<6div spans="tyle--0:#7F">D6div>61B0onMous4<4AE= spans="tyle--0:#E2817F;--1:#B2">34AE=><834{ spans="tyle--0:#D9F5DD;--1:#11">11834{><11() spans="tyle--1:#88"><44AE spans="tyle--0:#7F">D44AE>92 spans="tyle--0:#7F">DBC>11()>3<834} spans="tyle--0:#7FDBCA;--1:#88">4834}><4AE spans="tyle--0:#C5E478;--1:#3B">61B0on4AE >4<4AE= spans="tyle--0:#E2817F;--1:#B2">34AE=><834{ spans="tyle--0:#D9F5DD;--1:#11">11834{><11() spans="tyle--1:#88"><44AE spans="tyle--0:#7F">D44AE>92 spans="tyle--0:#7F">DBC>11()>3<834} spans="tyle--0:#7FDBCA;--1:#88">44A834}> {}} onBlur={() => {}"><} />} />>di>
If your application doesn’t use mouse event handlers, or if you use a framework that automatically injects key event handlers for equivalent mouse event handlers, you can disable this rule.