Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[a11y] legend loses focus after closing its popover #1266

Closed
mbondyra opened this issue Jul 26, 2021 · 6 comments · Fixed by #1272 or elastic/kibana#113968
Closed

[a11y] legend loses focus after closing its popover #1266

mbondyra opened this issue Jul 26, 2021 · 6 comments · Fixed by #1272 or elastic/kibana#113968
Assignees
Labels
:accessibility Accessibility related issue bug Something isn't working Impact:Medium released Issue released publicly

Comments

@mbondyra
Copy link
Contributor

mbondyra commented Jul 26, 2021

Describe the bug
When opening the legend popover and then closing it, the focus is lost (see video below)

Expected behaviour
The focus should go back to the popover handle.

Screenshots
in Kibana:
https://user-images.githubusercontent.com/4283304/126983142-90d5e0d4-d9a1-4be0-a9a8-202f6648b804.mp4

in Storybook:
https://user-images.githubusercontent.com/4283304/126983155-9a389ef9-3567-4a09-86e4-d635d98ddb8a.mp4

Version (please complete the following information):
Chrome, master

Kibana Additional context
Found when checking elastic/kibana#106374

@mbondyra mbondyra added the bug Something isn't working label Jul 26, 2021
@mbondyra mbondyra changed the title [a11y] legend loses focus after closing popover [a11y] legend loses focus after closing its popover Jul 26, 2021
@myasonik myasonik added the :accessibility Accessibility related issue label Jul 26, 2021
@rshen91 rshen91 self-assigned this Jul 28, 2021
nickofthyme pushed a commit that referenced this issue Sep 13, 2021
# [35.0.0](v34.2.1...v35.0.0) (2021-09-13)

### Bug Fixes

* **a11y:** restore focus after popover close with color picker ([#1272](#1272)) ([0c6f945](0c6f945)), closes [#1266](#1266) [#935](#935)
* **build:** fix license in package.json ([#1362](#1362)) ([d524fdf](d524fdf))
* **deps:** update dependency @elastic/eui to ^37.5.0 ([#1341](#1341)) ([fb05c98](fb05c98))
* **deps:** update dependency @elastic/eui to ^37.6.1 ([#1359](#1359)) ([2ae90ce](2ae90ce))
* **deps:** update dependency @elastic/eui to ^37.7.0 ([#1373](#1373)) ([553b6b0](553b6b0))
* **heatmap:** filter out tooltip picked shapes in x-axis area ([#1351](#1351)) ([174047d](174047d)), closes [#1215](#1215)
* **heatmap:** remove values when brushing only over axes ([#1364](#1364)) ([77ff8d3](77ff8d3))

### Features

* **annotations:** add onClickHandler for annotations ([#1293](#1293)) ([48198be](48198be)), closes [#1211](#1211)
* **heatmap:** add text color contrast to heatmap cells ([#1342](#1342)) ([f9a26ef](f9a26ef)), closes [#1296](#1296)
* **heatmap:** reduce font size to fit label within cells ([#1352](#1352)) ([16b5546](16b5546))
* **xy:** mutilayer time axis step 1 ([#1326](#1326)) ([867b1f5](867b1f5))

### BREAKING CHANGES

* **xy:** - feat: removes the axis deduplication feature
- fix: `showDuplicatedTicks` causes a duplication check on the actual axis tick label (possibly yielded by `Axis.tickLabel` rather than the more general `tickFormat`)
* **heatmap:** the `config.label.fontSize` prop is replaced by `config.label.minFontSize` and `config.label.maxFontSize`. You can specify the same value for both properties to have a fixed font size. The `config.label.align` and `config.label.baseline` props are removed from the `HeatmapConfig` object.
@nickofthyme
Copy link
Collaborator

🎉 This issue has been resolved in version 35.0.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

@dej611
Copy link
Contributor

dej611 commented Oct 11, 2021

Tested this again with v.37 and in Lens it is still broken.

@dej611 dej611 reopened this Oct 11, 2021
@nickofthyme
Copy link
Collaborator

@rshen91 ⬆️

@rshen91
Copy link
Contributor

rshen91 commented Oct 14, 2021

The issue I'm facing is handling the focus state with the euiContextMenu I opened #1423 where I'm able to handle the focus within elastic charts, however the same fix isn't working in kibana currently. I'm investigating thanks!

@ghudgins
Copy link
Contributor

ghudgins commented Dec 9, 2021

@rshen91 can we close this?

@rshen91
Copy link
Contributor

rshen91 commented Dec 29, 2021

There is one edge case that isn't yet handled in elastic/kibana#115066 (comment) but I think it's ok to close this issue for now 👍🏻

@rshen91 rshen91 closed this as completed Dec 29, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
:accessibility Accessibility related issue bug Something isn't working Impact:Medium released Issue released publicly
Projects
None yet
6 participants