Skip to content

(Accessibility) Remove instances of deprecated EuiKeyboardAccessible  #81064

Closed
@myasonik

Description

@myasonik

EuiKeyboardAccessible was deprecated because it was abused more often than it was used successfully so we need to remove it from Kibana before December 2020.

It's used 3 times throughout monitoring each presenting different issues:

  1. https://github.com/elastic/kibana/blob/master/x-pack/plugins/monitoring/public/components/chart/horizontal_legend.js#L70-L94
    Here it wraps a <button> which ends up with redundant structure with an extra tab stop:
    <div tabindex={0} role="button><button>{...}</button></div>. Here you should be able to remove <EuiKeyboardAccessible> without any further changes.

  2. https://github.com/elastic/kibana/blob/master/x-pack/plugins/monitoring/public/components/elasticsearch/nodes/cells.js#L85-L96
    Here it wraps EuiIcon that has an onClick assigned to it. EuiButtonIcon will serve this usecase better.

  3. https://github.com/elastic/kibana/blob/master/x-pack/plugins/monitoring/public/components/elasticsearch/shard_allocation/components/assigned.js#L56-L67
    Here it wraps a <a> to, it seems from the comment, to change the styles of it. Changing styles should be done with CSS, not with accessibility-focused components. EuiLink supports several colors to render links as.

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions