Skip to content

[8.x] fix: [Obs Services > Create Service Group modal][KEYBOARD]: Focus should not be auto-set on first input when modal appears (#194696)#195235

Merged
kibanamachine merged 1 commit intoelastic:8.xfrom
kibanamachine:backport/8.x/pr-194696
Oct 7, 2024
Merged

Conversation

@kibanamachine
Copy link
Copy Markdown
Contributor

…uld not be auto-set on first input when modal appears (elastic#194696)

Closes: elastic#194965
Closes: elastic#194966

# Description

- [x] elastic#194965 <br /> Focus is
currently being set on the first input in the "Create group" modal.
Screen reader users will hear the input name, but not get the title of
the modal read aloud this way, and it could be confusing. We should be
letting the EuiModal set focus naturally on the modal or close button so
screen reader users hear the title as expected.

- [x] elastic#194966 <br /> Focus must
be returned properly when I cancel the "Create group" workflow in
Services > Create service group modal.

# Changes Made

1. Removed:

```diff
- inputRef.current?.focus(); // autofocus on initial render
```

2. Added `aria-labelledby={modalTitleId}` for `EuiModal`. See
https://eui.elastic.co/#/layout/modal.
3. Slightly updated `Name` and `Color` validation.

# Screen

https://github.com/user-attachments/assets/6636f2dc-b9b7-4d4d-8144-90249f8327e7
(cherry picked from commit d576365)
@elasticmachine
Copy link
Copy Markdown
Contributor

Pinging @elastic/obs-ux-infra_services-team (Team:obs-ux-infra_services)

@kibana-ci
Copy link
Copy Markdown

💚 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
apm 3.5MB 3.5MB +251.0B

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

cc @alexwizp

@kibanamachine kibanamachine merged commit 5ea090b into elastic:8.x Oct 7, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

backport This PR is a backport of another PR ci:project-deploy-observability Create an Observability project Team:obs-ux-infra_services - DEPRECATED DEPRECATED - Use Team:obs-presentation.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants