[ML] Anomaly Detection: Restore focus to row actions menu in job management table#230170
Merged
rbrtj merged 5 commits intoelastic:mainfrom Aug 5, 2025
Merged
[ML] Anomaly Detection: Restore focus to row actions menu in job management table#230170rbrtj merged 5 commits intoelastic:mainfrom
rbrtj merged 5 commits intoelastic:mainfrom
Conversation
rbrtj
commented
Aug 1, 2025
| ); | ||
|
|
||
| return ( | ||
| <EuiPortal> |
Contributor
Author
There was a problem hiding this comment.
This was obsolete, EuiFlyout already comes with a Portal
rbrtj
added
:ml
release_note:skip
Contributor
|
Pinging @elastic/ml-ui (:ml) |
peteharverson
approved these changes
Aug 1, 2025
Contributor
peteharverson
left a comment
peteharverson
left a comment
There was a problem hiding this comment.
Tested (Chrome and Firefox) and confirmed the focus is now being restored the menu correctly.
As discussed, the same fix should be applied to the bulk actions menu, but this can be done in a follow-up.
jgowdyelastic
approved these changes
Aug 1, 2025
Member
jgowdyelastic
left a comment
jgowdyelastic
left a comment
There was a problem hiding this comment.
Left a couple of comments, but on the whole LGTM
| end: number; | ||
| onClose: () => void; | ||
| onModelSnapshotAnnotationClick?: (modelSnapshot: ModelSnapshot) => void; | ||
| focusTrapProps?: EuiFlyoutProps['focusTrapProps']; |
Member
There was a problem hiding this comment.
As we're using this type a lot, maybe it's worth exporting it from create_focus_trap_props.ts
e.g.
export type FocusTrapProps = EuiFlyoutResizableProps['focusTrapProps'];
| }; | ||
|
|
||
| export const createJobActionFocusRestoration = (jobId: string) => { | ||
| const actionButton = document.getElementById(`${jobId}-actions`)?.querySelector('button'); |
Member
There was a problem hiding this comment.
nit, I think this could be:
Suggested change
| const actionButton = document.getElementById(`${jobId}-actions`)?.querySelector('button'); | |
| const actionButton = document.querySelector(`#${jobId}-actions button`); |
Contributor
Author
There was a problem hiding this comment.
It seems that actionButton would be typed as Element, which is a base class for e.g., HTMLElement, and doesn't have the focus method typed. I think it's better to stick with the current implementation rather than asserting the type or adding a type guard
jcger
approved these changes
Aug 4, 2025
Contributor
💚 Build Succeeded
Metrics [docs]Module Count
Async chunks
History
cc @rbrtj |
Contributor
|
Starting backport for target branches: 8.17, 8.18, 8.19, 9.0 |
1 task
Contributor
💔 All backports failed
Manual backportTo create the backport manually run: Questions ?Please refer to the Backport tool documentation |
This was referenced Aug 5, 2025
delanni
pushed a commit
to delanni/kibana
that referenced
this pull request
Aug 5, 2025
…0170) Fix for: elastic#195017 This PR fixes an issue with focus restoration, where opening a Flyout or Modal from the context action menu doesn't properly restore focus. Unfortunately, this isn't fixable on the Eui side at the moment, so to address this, we need to manually restore focus to the action button. It creates reusable helpers responsible for creating `focusTrapProps` for flyouts and manually restoring focus for Modals, as this issue occurs whenever a Flyout or Modal is triggered from the context action menu. After fix: https://github.com/user-attachments/assets/19c259e0-1c8b-4304-bcdd-918d4e0d45cf
rbrtj
added
backport:prev-minor
and removed
backport:version
Contributor
|
Starting backport for target branches: 9.1 |
Contributor
💔 All backports failed
Manual backportTo create the backport manually run: Questions ?Please refer to the Backport tool documentation |
Contributor
Author
💚 All backports created successfully
Note: Successful backport PRs will be merged automatically after passing CI. Questions ?Please refer to the Backport tool documentation |
rbrtj
added a commit
to rbrtj/kibana
that referenced
this pull request
Aug 6, 2025
…0170) Fix for: elastic#195017 This PR fixes an issue with focus restoration, where opening a Flyout or Modal from the context action menu doesn't properly restore focus. Unfortunately, this isn't fixable on the Eui side at the moment, so to address this, we need to manually restore focus to the action button. It creates reusable helpers responsible for creating `focusTrapProps` for flyouts and manually restoring focus for Modals, as this issue occurs whenever a Flyout or Modal is triggered from the context action menu. After fix: https://github.com/user-attachments/assets/19c259e0-1c8b-4304-bcdd-918d4e0d45cf (cherry picked from commit 742ddef) # Conflicts: # src/platform/packages/shared/response-ops/rule_form/flyout/rule_form_flyout.tsx
rbrtj
added a commit
that referenced
this pull request
Aug 6, 2025
) (#230735) # Backport This will backport the following commits from `main` to `9.1`: - [[ML] Anomaly Detection: Restore focus to row actions menu (#230170)](#230170) <!--- Backport version: 10.0.1 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT [{"author":{"name":"Robert Jaszczurek","email":"92210485+rbrtj@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-08-05T10:55:36Z","message":"[ML] Anomaly Detection: Restore focus to row actions menu (#230170)\n\nFix for: https://github.com/elastic/kibana/issues/195017\nThis PR fixes an issue with focus restoration, where opening a Flyout or\nModal from the context action menu doesn't properly restore focus.\nUnfortunately, this isn't fixable on the Eui side at the moment, so to\naddress this, we need to manually restore focus to the action button. It\ncreates reusable helpers responsible for creating `focusTrapProps` for\nflyouts and manually restoring focus for Modals, as this issue occurs\nwhenever a Flyout or Modal is triggered from the context action menu.\nAfter fix:\n\n\n\n\n\n\nhttps://github.com/user-attachments/assets/19c259e0-1c8b-4304-bcdd-918d4e0d45cf","sha":"742ddef446a90668868a566b2eef5916552425e8","branchLabelMapping":{"^v9.2.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":[":ml","release_note:skip","Team:ML","backport:prev-minor","v9.2.0"],"title":"[ML] Anomaly Detection: Restore focus to row actions menu","number":230170,"url":"https://github.com/elastic/kibana/pull/230170","mergeCommit":{"message":"[ML] Anomaly Detection: Restore focus to row actions menu (#230170)\n\nFix for: https://github.com/elastic/kibana/issues/195017\nThis PR fixes an issue with focus restoration, where opening a Flyout or\nModal from the context action menu doesn't properly restore focus.\nUnfortunately, this isn't fixable on the Eui side at the moment, so to\naddress this, we need to manually restore focus to the action button. It\ncreates reusable helpers responsible for creating `focusTrapProps` for\nflyouts and manually restoring focus for Modals, as this issue occurs\nwhenever a Flyout or Modal is triggered from the context action menu.\nAfter fix:\n\n\n\n\n\n\nhttps://github.com/user-attachments/assets/19c259e0-1c8b-4304-bcdd-918d4e0d45cf","sha":"742ddef446a90668868a566b2eef5916552425e8"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.2.0","branchLabelMappingKey":"^v9.2.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/230170","number":230170,"mergeCommit":{"message":"[ML] Anomaly Detection: Restore focus to row actions menu (#230170)\n\nFix for: https://github.com/elastic/kibana/issues/195017\nThis PR fixes an issue with focus restoration, where opening a Flyout or\nModal from the context action menu doesn't properly restore focus.\nUnfortunately, this isn't fixable on the Eui side at the moment, so to\naddress this, we need to manually restore focus to the action button. It\ncreates reusable helpers responsible for creating `focusTrapProps` for\nflyouts and manually restoring focus for Modals, as this issue occurs\nwhenever a Flyout or Modal is triggered from the context action menu.\nAfter fix:\n\n\n\n\n\n\nhttps://github.com/user-attachments/assets/19c259e0-1c8b-4304-bcdd-918d4e0d45cf","sha":"742ddef446a90668868a566b2eef5916552425e8"}}]}] BACKPORT-->
NicholasPeretti
pushed a commit
to NicholasPeretti/kibana
that referenced
this pull request
Aug 18, 2025
…0170) Fix for: elastic#195017 This PR fixes an issue with focus restoration, where opening a Flyout or Modal from the context action menu doesn't properly restore focus. Unfortunately, this isn't fixable on the Eui side at the moment, so to address this, we need to manually restore focus to the action button. It creates reusable helpers responsible for creating `focusTrapProps` for flyouts and manually restoring focus for Modals, as this issue occurs whenever a Flyout or Modal is triggered from the context action menu. After fix: https://github.com/user-attachments/assets/19c259e0-1c8b-4304-bcdd-918d4e0d45cf
peteharverson
changed the title
Contributor
|
Pinging @elastic/kibana-accessibility (Project:Accessibility) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
7 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fix for: #195017
This PR fixes an issue with focus restoration, where opening a Flyout or Modal from the context action menu doesn't properly restore focus. Unfortunately, this isn't fixable on the Eui side at the moment, so to address this, we need to manually restore focus to the action button. It creates reusable helpers responsible for creating
focusTrapPropsfor flyouts and manually restoring focus for Modals, as this issue occurs whenever a Flyout or Modal is triggered from the context action menu.After fix:
Screen.Recording.2025-08-01.at.10.33.49.mov