== Why is this an issue?

Offering the same experience with the mouse and the keyboard allow users to pick their preferred devices.

Additionally, users of assistive technology will also be able to browse the site even if they cannot use the mouse.

This rules detects the following issues:

 - when `onClick` is not accompanied by at least one of the following: `onKeyUp`, `onKeyDown`, `onKeyPress`.
 - when `onmouseover`/`onmouseout` are not paired by `onfocus`/`onblur`.

== How to fix it in JSX

Add at least one of the following event handlers `onKeyUp`, `onKeyDown`, `onKeyPress` to the element when using `onClick` event handler.
Add corresponding event handlers `onfocus`/`onblur` to the element when using `onmouseover`/`onmouseout` event handlers.

=== Code examples

==== Noncompliant code example

[source,javascript,diff-id=1,diff-type=noncompliant]
----
<div onClick={() => {}} />

<div onMouseOver={ () => {}} }  />
----

==== Compliant solution

[source,javascript,diff-id=1,diff-type=compliant]
----
<div onClick={() => {}} onKeyDown={this.handleKeyDown} />

<div onMouseOver={ () => {} } onFocus={ () => {} } />
----

== Exceptions

This does not apply for interactive or hidden elements, eg. when using `aria-hidden="true"` attribute.

== Resources

* SCR2 - https://www.w3.org/TR/WCAG20-TECHS/SCR2.html[Using redundant keyboard and mouse event handlers]
* G90 - https://www.w3.org/TR/WCAG20-TECHS/G90.html[Providing keyboard-triggered event handlers]