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

fix: [Search:AppSearch:Engines:Synonyms page]Button behind Manage synonym set dialog modal is announced by screen reader #202417

Merged
merged 3 commits into from
Dec 4, 2024

Conversation

alexwizp
Copy link
Contributor

@alexwizp alexwizp commented Dec 2, 2024

Closes: #202272

Description

Buttons which are behind dialog modals shouldn't be announced for the user using assistive technology.

Changes Made:

  1. The DELETE_VALUE_BUTTON_LABEL translation was updated to include the row index in its value.
  2. A container with role="group" was created for input values. Now, the container is focused when the "Delete row" item is pressed.

Screen

image

@alexwizp alexwizp added release_note:skip Skip the PR/issue when compiling release notes v9.0.0 backport:prev-minor Backport to (8.x) the previous minor version (i.e. one version back from main) Team:Search Project:Accessibility labels Dec 2, 2024
@alexwizp
Copy link
Contributor Author

alexwizp commented Dec 2, 2024

/ci

…onym set dialog modal is announced by screen reader

Closes: elastic#202272
@elastic elastic deleted a comment from elasticmachine Dec 2, 2024
@alexwizp alexwizp marked this pull request as ready for review December 2, 2024 13:06
@alexwizp alexwizp requested a review from a team as a code owner December 2, 2024 13:06
@elasticmachine
Copy link
Contributor

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

@elasticmachine
Copy link
Contributor

💚 Build Succeeded

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
enterpriseSearch 2.6MB 2.6MB +324.0B

History

Copy link
Contributor

@Samiul-TheSoccerFan Samiul-TheSoccerFan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@alexwizp alexwizp merged commit 258754d into elastic:main Dec 4, 2024
8 checks passed
@kibanamachine
Copy link
Contributor

Starting backport for target branches: 8.x

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

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Dec 4, 2024
…onym set dialog modal is announced by screen reader (elastic#202417)

Closes: elastic#202272

## Description
Buttons which are behind dialog modals shouldn't be announced for the
user using assistive technology.

## Changes Made:
1. The DELETE_VALUE_BUTTON_LABEL translation was updated to include the
row index in its value.
2. A container with role="group" was created for input values. Now, the
container is focused when the "Delete row" item is pressed.

## Screen

<img width="1135" alt="image"
src="https://github.com/user-attachments/assets/919a547c-f878-430b-b187-1273e698bb61">

(cherry picked from commit 258754d)
@kibanamachine
Copy link
Contributor

💚 All backports created successfully

Status Branch Result
8.x

Note: Successful backport PRs will be merged automatically after passing CI.

Questions ?

Please refer to the Backport tool documentation

kibanamachine added a commit that referenced this pull request Dec 4, 2024
…ge synonym set dialog modal is announced by screen reader (#202417) (#202871)

# Backport

This will backport the following commits from `main` to `8.x`:
- [fix: [Search:AppSearch:Engines:Synonyms page]Button behind Manage
synonym set dialog modal is announced by screen reader
(#202417)](#202417)

<!--- Backport version: 9.4.3 -->

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

<!--BACKPORT [{"author":{"name":"Alexey
Antonov","email":"alexwizp@gmail.com"},"sourceCommit":{"committedDate":"2024-12-04T06:18:18Z","message":"fix:
[Search:AppSearch:Engines:Synonyms page]Button behind Manage synonym set
dialog modal is announced by screen reader (#202417)\n\nCloses:
#202272\r\n\r\n## Description\r\nButtons which are behind dialog modals
shouldn't be announced for the\r\nuser using assistive
technology.\r\n\r\n## Changes Made:\r\n1. The DELETE_VALUE_BUTTON_LABEL
translation was updated to include the\r\nrow index in its value.\r\n2.
A container with role=\"group\" was created for input values. Now,
the\r\ncontainer is focused when the \"Delete row\" item is
pressed.\r\n\r\n## Screen\r\n\r\n<img width=\"1135\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/919a547c-f878-430b-b187-1273e698bb61\">","sha":"258754d011d4fcc1be2ebe5834215e019c834949","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Project:Accessibility","release_note:skip","v9.0.0","Team:Search","backport:prev-minor"],"title":"fix:
[Search:AppSearch:Engines:Synonyms page]Button behind Manage synonym set
dialog modal is announced by screen
reader","number":202417,"url":"https://github.com/elastic/kibana/pull/202417","mergeCommit":{"message":"fix:
[Search:AppSearch:Engines:Synonyms page]Button behind Manage synonym set
dialog modal is announced by screen reader (#202417)\n\nCloses:
#202272\r\n\r\n## Description\r\nButtons which are behind dialog modals
shouldn't be announced for the\r\nuser using assistive
technology.\r\n\r\n## Changes Made:\r\n1. The DELETE_VALUE_BUTTON_LABEL
translation was updated to include the\r\nrow index in its value.\r\n2.
A container with role=\"group\" was created for input values. Now,
the\r\ncontainer is focused when the \"Delete row\" item is
pressed.\r\n\r\n## Screen\r\n\r\n<img width=\"1135\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/919a547c-f878-430b-b187-1273e698bb61\">","sha":"258754d011d4fcc1be2ebe5834215e019c834949"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/202417","number":202417,"mergeCommit":{"message":"fix:
[Search:AppSearch:Engines:Synonyms page]Button behind Manage synonym set
dialog modal is announced by screen reader (#202417)\n\nCloses:
#202272\r\n\r\n## Description\r\nButtons which are behind dialog modals
shouldn't be announced for the\r\nuser using assistive
technology.\r\n\r\n## Changes Made:\r\n1. The DELETE_VALUE_BUTTON_LABEL
translation was updated to include the\r\nrow index in its value.\r\n2.
A container with role=\"group\" was created for input values. Now,
the\r\ncontainer is focused when the \"Delete row\" item is
pressed.\r\n\r\n## Screen\r\n\r\n<img width=\"1135\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/919a547c-f878-430b-b187-1273e698bb61\">","sha":"258754d011d4fcc1be2ebe5834215e019c834949"}}]}]
BACKPORT-->

Co-authored-by: Alexey Antonov <alexwizp@gmail.com>
hop-dev pushed a commit to hop-dev/kibana that referenced this pull request Dec 5, 2024
…onym set dialog modal is announced by screen reader (elastic#202417)

Closes: elastic#202272

## Description
Buttons which are behind dialog modals shouldn't be announced for the
user using assistive technology.

## Changes Made:
1. The DELETE_VALUE_BUTTON_LABEL translation was updated to include the
row index in its value.
2. A container with role="group" was created for input values. Now, the
container is focused when the "Delete row" item is pressed.

## Screen

<img width="1135" alt="image"
src="https://github.com/user-attachments/assets/919a547c-f878-430b-b187-1273e698bb61">
CAWilson94 pushed a commit to CAWilson94/kibana that referenced this pull request Dec 9, 2024
…onym set dialog modal is announced by screen reader (elastic#202417)

Closes: elastic#202272

## Description
Buttons which are behind dialog modals shouldn't be announced for the
user using assistive technology.

## Changes Made:
1. The DELETE_VALUE_BUTTON_LABEL translation was updated to include the
row index in its value.
2. A container with role="group" was created for input values. Now, the
container is focused when the "Delete row" item is pressed.

## Screen

<img width="1135" alt="image"
src="https://github.com/user-attachments/assets/919a547c-f878-430b-b187-1273e698bb61">
CAWilson94 pushed a commit to CAWilson94/kibana that referenced this pull request Dec 12, 2024
…onym set dialog modal is announced by screen reader (elastic#202417)

Closes: elastic#202272

## Description
Buttons which are behind dialog modals shouldn't be announced for the
user using assistive technology.

## Changes Made:
1. The DELETE_VALUE_BUTTON_LABEL translation was updated to include the
row index in its value.
2. A container with role="group" was created for input values. Now, the
container is focused when the "Delete row" item is pressed.

## Screen

<img width="1135" alt="image"
src="https://github.com/user-attachments/assets/919a547c-f878-430b-b187-1273e698bb61">
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
backport:prev-minor Backport to (8.x) the previous minor version (i.e. one version back from main) Project:Accessibility release_note:skip Skip the PR/issue when compiling release notes Team:Search v8.18.0 v9.0.0
Projects
None yet
4 participants