[a11y] Fix Title announcement, image flyout dashboards #220027

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.

Sign up for GitHub

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

Jump to bottom

Merged

paulinashakirova merged 3 commits into elastic:main from paulinashakirova:a11y-image-editor-flyout-title

May 28, 2025

Contributor

paulinashakirova commented May 4, 2025 •

edited by kibanamachine

Loading

Summary

This PR resolves [Platform:Dashboards:DashboardEditMode] Add image panel is announced incorrectly issue.
Tested in Safari (Chrome still doesn't pronounce it correctly, which is a known issue confirmed by Eui team.)

Screenshot 2025-05-04 at 14 06 37


          [a11y] Fix Title announcement, image flyout dashboards

a3c5d87

paulinashakirova added Project:Accessibility release_note:skip Team:SharedUX backport:all-open a11y labels

paulinashakirova self-assigned this

paulinashakirova requested a review from a team as a code owner

May 4, 2025 13:06

Contributor

elasticmachine commented May 4, 2025

Pinging @elastic/kibana-accessibility (Project:Accessibility)

Contributor

elasticmachine commented May 4, 2025

Pinging @elastic/appex-sharedux (Team:SharedUX)

paulinashakirova commented

View reviewed changes

...atform/plugins/private/image_embeddable/public/components/image_editor/open_image_editor.tsx

@@ @@ -84,6 +84,7 @@ export const openImageEditor = async ({ @@
                       paddingSize: 'm',
                       ownFocus: true,
                       'data-test-subj': 'createImageEmbeddableFlyout',
+                      'aria-labelledby': 'image-editor-flyout-title',

Contributor Author

paulinashakirova May 4, 2025

I hard-coded here because I tried to pass using useGeneratedHtmld, but because the component is returned from a Promise (I think this could be the reason), it doesn't work correctly.
But maybe there is a better way?

Contributor

Dosant May 6, 2025

What exactly is issue? 🤔


          Merge branch 'main' into a11y-image-editor-flyout-title

e806687

Contributor

elasticmachine commented May 4, 2025

💚 Build Succeeded

Buildkite Build
Commit: e806687

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
`imageEmbeddable`	50.7KB	50.8KB	+120.0B

cc @paulinashakirova

alexwizp approved these changes

View reviewed changes

Dosant reviewed

View reviewed changes

Contributor

Dosant left a comment

Tested in Safari (Chrome still doesn't pronounce it correctly.)

So the issue isn't fully resolved? Sorry if I am miss-reading

...atform/plugins/private/image_embeddable/public/components/image_editor/open_image_editor.tsx

@@ @@ -84,6 +84,7 @@ export const openImageEditor = async ({ @@
                       paddingSize: 'm',
                       ownFocus: true,
                       'data-test-subj': 'createImageEmbeddableFlyout',
+                      'aria-labelledby': 'image-editor-flyout-title',

Contributor

Dosant May 6, 2025

What exactly is issue? 🤔

Contributor Author

paulinashakirova commented May 26, 2025

Tested in Safari (Chrome still doesn't pronounce it correctly.)

So the issue isn't fully resolved? Sorry if I am miss-reading
Thank you for asking - this is a known issue (I changed the description) it is related to how Chrome handles flyouts (role="dialog").

Screenshot 2025-05-26 at 13 28 17


          Merge branch 'main' into a11y-image-editor-flyout-title

Dosant approved these changes

View reviewed changes

paulinashakirova merged commit 641ee87 into elastic:main

10 checks passed

paulinashakirova deleted the a11y-image-editor-flyout-title branch

May 28, 2025 04:21

kibanamachine added the v9.1.0 label

Contributor

kibanamachine commented May 28, 2025

Starting backport for target branches: 7.17, 8.17, 8.18, 8.19, 9.0

https://github.com/elastic/kibana/actions/runs/15291424288

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request


          [a11y] Fix Title announcement, image flyout dashboards (elastic#220027)

82002e2

## Summary

This PR resolves [[Platform:Dashboards:DashboardEditMode] Add image
panel is announced
incorrectly](elastic#215483) issue.
Tested in Safari (Chrome still doesn't pronounce it correctly, which is
a known issue confirmed by Eui team.)

<img width="915" alt="Screenshot 2025-05-04 at 14 06 37"
src="https://github.com/user-attachments/assets/1c2fc8ae-1efc-49b7-ad0b-57eea4cf416c"
/>

(cherry picked from commit 641ee87)

kibanamachine mentioned this pull request

[8.17] [a11y] Fix Title announcement, image flyout dashboards (#220027) #221718

Merged

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request


          [a11y] Fix Title announcement, image flyout dashboards (elastic#220027)

## Summary

This PR resolves [[Platform:Dashboards:DashboardEditMode] Add image
panel is announced
incorrectly](elastic#215483) issue.
Tested in Safari (Chrome still doesn't pronounce it correctly, which is
a known issue confirmed by Eui team.)

<img width="915" alt="Screenshot 2025-05-04 at 14 06 37"
src="https://github.com/user-attachments/assets/1c2fc8ae-1efc-49b7-ad0b-57eea4cf416c"
/>

(cherry picked from commit 641ee87)

kibanamachine mentioned this pull request

[8.18] [a11y] Fix Title announcement, image flyout dashboards (#220027) #221719

Merged

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request


          [a11y] Fix Title announcement, image flyout dashboards (elastic#220027)

bbbecb4

## Summary

This PR resolves [[Platform:Dashboards:DashboardEditMode] Add image
panel is announced
incorrectly](elastic#215483) issue.
Tested in Safari (Chrome still doesn't pronounce it correctly, which is
a known issue confirmed by Eui team.)

<img width="915" alt="Screenshot 2025-05-04 at 14 06 37"
src="https://github.com/user-attachments/assets/1c2fc8ae-1efc-49b7-ad0b-57eea4cf416c"
/>

(cherry picked from commit 641ee87)

kibanamachine mentioned this pull request

[8.19] [a11y] Fix Title announcement, image flyout dashboards (#220027) #221720

Merged

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request


          [a11y] Fix Title announcement, image flyout dashboards (elastic#220027)

## Summary

This PR resolves [[Platform:Dashboards:DashboardEditMode] Add image
panel is announced
incorrectly](elastic#215483) issue.
Tested in Safari (Chrome still doesn't pronounce it correctly, which is
a known issue confirmed by Eui team.)

<img width="915" alt="Screenshot 2025-05-04 at 14 06 37"
src="https://github.com/user-attachments/assets/1c2fc8ae-1efc-49b7-ad0b-57eea4cf416c"
/>

(cherry picked from commit 641ee87)

kibanamachine mentioned this pull request

[9.0] [a11y] Fix Title announcement, image flyout dashboards (#220027) #221721

Merged

kibanamachine added the backport missing label

Contributor

kibanamachine commented May 29, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

akowalska622 pushed a commit to akowalska622/kibana that referenced this pull request


          [a11y] Fix Title announcement, image flyout dashboards (elastic#220027)

0cfd14d

## Summary

This PR resolves [[Platform:Dashboards:DashboardEditMode] Add image
panel is announced
incorrectly](elastic#215483) issue.
Tested in Safari (Chrome still doesn't pronounce it correctly, which is
a known issue confirmed by Eui team.)

<img width="915" alt="Screenshot 2025-05-04 at 14 06 37"
src="https://github.com/user-attachments/assets/1c2fc8ae-1efc-49b7-ad0b-57eea4cf416c"
/>

mistic added v8.18.3 and removed v8.18.2 labels

Contributor

kibanamachine commented May 30, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

14 similar comments

Contributor

kibanamachine commented Jun 2, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 3, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 4, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 5, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 6, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 9, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 10, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 11, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 12, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 13, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 16, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 18, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 19, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

Contributor

kibanamachine commented Jun 20, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.
cc: @paulinashakirova

alexwizp added backport:version and removed backport:all-open backport missing labels

elastic deleted a comment from kibanamachine

elastic deleted a comment from kibanamachine

kibanamachine added a commit that referenced this pull request


          [8.17] [a11y] Fix Title announcement, image flyout dashboards (#220027)…

00aef8f

… (#221718)

# Backport

This will backport the following commits from `main` to `8.17`:
- [[a11y] Fix Title announcement, image flyout dashboards
(#220027)](#220027)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Paulina
Shakirova","email":"paulina.shakirova@elastic.co"},"sourceCommit":{"committedDate":"2025-05-28T04:21:01Z","message":"[a11y]
Fix Title announcement, image flyout dashboards (#220027)\n\n##
Summary\n\nThis PR resolves [[Platform:Dashboards:DashboardEditMode] Add
image\npanel is
announced\nincorrectly](#215483)
issue.\nTested in Safari (Chrome still doesn't pronounce it correctly,
which is\na known issue confirmed by Eui team.)\n\n<img width=\"915\"
alt=\"Screenshot 2025-05-04 at 14 06
37\"\nsrc=\"https://github.com/user-attachments/assets/1c2fc8ae-1efc-49b7-ad0b-57eea4cf416c\"\n/>","sha":"641ee87cc1b54b18e9320767071118ca5205c80d","branchLabelMapping":{"^v9.1.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Project:Accessibility","release_note:skip","Team:SharedUX","backport:all-open","a11y","v9.1.0"],"title":"[a11y]
Fix Title announcement, image flyout
dashboards","number":220027,"url":"https://github.com/elastic/kibana/pull/220027","mergeCommit":{"message":"[a11y]
Fix Title announcement, image flyout dashboards (#220027)\n\n##
Summary\n\nThis PR resolves [[Platform:Dashboards:DashboardEditMode] Add
image\npanel is
announced\nincorrectly](#215483)
issue.\nTested in Safari (Chrome still doesn't pronounce it correctly,
which is\na known issue confirmed by Eui team.)\n\n<img width=\"915\"
alt=\"Screenshot 2025-05-04 at 14 06
37\"\nsrc=\"https://github.com/user-attachments/assets/1c2fc8ae-1efc-49b7-ad0b-57eea4cf416c\"\n/>","sha":"641ee87cc1b54b18e9320767071118ca5205c80d"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/220027","number":220027,"mergeCommit":{"message":"[a11y]
Fix Title announcement, image flyout dashboards (#220027)\n\n##
Summary\n\nThis PR resolves [[Platform:Dashboards:DashboardEditMode] Add
image\npanel is
announced\nincorrectly](#215483)
issue.\nTested in Safari (Chrome still doesn't pronounce it correctly,
which is\na known issue confirmed by Eui team.)\n\n<img width=\"915\"
alt=\"Screenshot 2025-05-04 at 14 06
37\"\nsrc=\"https://github.com/user-attachments/assets/1c2fc8ae-1efc-49b7-ad0b-57eea4cf416c\"\n/>","sha":"641ee87cc1b54b18e9320767071118ca5205c80d"}}]}]
BACKPORT-->

Co-authored-by: Paulina Shakirova <paulina.shakirova@elastic.co>
Co-authored-by: Alexey Antonov <alexwizp@gmail.com>

kibanamachine added the v8.17.8 label

mistic added v8.17.9 and removed v8.17.8 labels

Member

mistic commented Jun 24, 2025

This PR didn't get it on time into the latest BC for v8.17.8. Updating the labels

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

a11y backport:version Project:Accessibility release_note:skip Team:SharedUX v8.17.9 v8.18.3 v8.19.0 v9.0.2 v9.1.0