[7.x] Fix eslint rule for vis_type_metric `jsx-a11y/click-even… (elas…

…tic#54363)
lizozom · Jan 9, 2020 · 05d0293 · 05d0293
1 parent 3093296
commit 05d0293
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 7 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -94,12 +94,6 @@ module.exports = {
         'react-hooks/exhaustive-deps': 'off',
       },
     },
-    {
-      files: ['src/legacy/core_plugins/vis_type_metric/**/*.{js,ts,tsx}'],
-      rules: {
-        'jsx-a11y/click-events-have-key-events': 'off',
-      },
-    },
     {
       files: ['src/legacy/core_plugins/vis_type_table/**/*.{js,ts,tsx}'],
       rules: {

diff --git a/src/legacy/core_plugins/vis_type_metric/public/components/metric_vis_value.js b/src/legacy/core_plugins/vis_type_metric/public/components/metric_vis_value.js
@@ -21,13 +21,19 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 
-import { EuiKeyboardAccessible } from '@elastic/eui';
+import { EuiKeyboardAccessible, keyCodes } from '@elastic/eui';
 
 class MetricVisValue extends Component {
   onClick = () => {
     this.props.onFilter(this.props.metric);
   };
 
+  onKeyPress = e => {
+    if (e.keyCode === keyCodes.ENTER) {
+      this.onClick();
+    }
+  };
+
   render() {
     const { fontSize, metric, onFilter, showLabel } = this.props;
     const hasFilter = !!onFilter;
@@ -47,6 +53,7 @@ class MetricVisValue extends Component {
         className={containerClassName}
         style={{ backgroundColor: metric.bgColor }}
         onClick={hasFilter ? this.onClick : null}
+        onKeyPress={hasFilter ? this.onKeyPress : null}
         tabIndex={hasFilter ? 0 : null}
         role={hasFilter ? 'button' : null}
       >