Skip to content

interactiveHandlers.json includes non-interactive handlers #1381

@AdrianFahrbach

Description

@AdrianFahrbach

The issue

The interactiveHandlers.json file should be a list of interactive handlers, but includes non-interactive handlers like mouseenter and mousemove.

This leads to issues with rules like no-static-element-interactions, where an issue is thrown when an element only includes non-interactive like this:

<div @mouseenter="emit('hover')"></div>

AFAIK W3C doesn't provide an official list of which events are interactive and which aren't, but the eslint-plugin-jsx-a11y has the following events set as default in their jsx-a11y/no-noninteractive-element-interactions config:

'onClick',
'onError',
'onLoad',
'onMouseDown',
'onMouseUp',
'onKeyPress',
'onKeyDown',
'onKeyUp',

Proposed solution

  1. Adjust the interactiveHandlers.json to only interactive events. This is my preferred solution, but there is no clear definition of interactive events and this could affect other rules as well. Aligning with eslint-plugin-jsx-a11ywould probably still be a good idea though.
  2. jsx-a11y/no-noninteractive-element-interactions has an option to pass custom handlers. Adding options like that to rules using the interactive events would be a possible solution as well.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions