Profile Settings: Focus moves inappropriately

Issue Summary

Focus moves inappropriately when user dismiss the modal dialogs.

Steps to Reproduce

1. Navigate to "User Profile" link in header section and activate it.
2. Check that multiple options has appeared on the screen.
3. Select the "Profile" link and activate it.
4. Observe that "Profile Settings" page has been appeared on the page.
5. Navigate to the "Edit Profile" and "Update user preferences" button and activate it.
6. Observe that modal dialog has appeared on the page.
7. Check that focus is moving inappropriately on closing the modal dialog.

Screen Recording

Screen Recording 2023-04-28 at 3.36.10 PM.mov

Actual Results

When user dismiss the "Edit Profile" and "Update user preferences" modal dialogs screen reader and keyboard focus moves to "Skip to main content" link inappropriately instead of moving on triggering element. 

This illogical focus order might make the page difficult to understand for the keyboard and screen reader users.

Expected Results

Make sure that the focus returns to the element that triggered the content. Make sure that when the user dismisses the content, the focus returns onto the triggering “Edit Profile” and "Update User Preferences" links. This can be done with the “focus” method.

For similar examples, please refer https://developer.mozilla.org/en-US/docs/Web/API/HTMLOrForeignElement/focus 

Workaround

Currently there is no known workaround for this behavior. A workaround will be added here when available

Environment

MacBook Pro (16-inch, 2019)
macOS Ventura Version 13.3.1
Chrome - Version 112.0.5615.49 (Official Build) (x86_64)
Firefox- Version 112.0.1 (64-bit)
Safari- Version 16.4 (18615.1.26.11.23)
JAWS- Version 2022
NVDA- Version 2020.3
Voiceover - Version Latest