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

DOC-2498: Closing a nested modal dialog would lose focus from the editor. #3482

Open
wants to merge 1 commit into
base: feature/7.5/DOC-2498
Choose a base branch
from

Conversation

kemister85
Copy link
Contributor

Ticket: DOC-2498

Site: Staging branch

Changes:

Pre-checks:

  • Branch prefixed with feature/<version>/, hotfix/<version>/, staging/<version>/, or release/<version>/.

Review:

  • Documentation Team Lead has reviewed

@kemister85 kemister85 requested review from ShiridiGandham and MitchC1999 and removed request for a team October 22, 2024 05:04
@kemister85 kemister85 added this to the TinyMCE 7.5 milestone Oct 22, 2024
@kemister85 kemister85 added the upcoming release Documentation for features currently under development/QA label Oct 22, 2024
Copy link

@LewisAtTiny LewisAtTiny left a comment

Choose a reason for hiding this comment

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

LGTM, issues like these can be a little confusing to someone who's never experienced them before but I can imagine if a user experienced this issue they'd understand. Grammar and punctuation perfect!

Comment on lines +164 to +168
When closing dialogs in an inline editor, focus was unintentionally lost before the dialog was fully closed. This issue was linked to link:https://www.tiny.cloud/docs/tinymce/6/6.5.1-release-notes/#closing-a-dialog-would-scroll-down-the-document-in-safari-on-macos[Closing a dialog would scroll down the document in Safari on macOS^] which was fixed in {productname} 6.5.1, where dismissing the Search/Replace dialog by clicking outside of it in Safari on macOS caused the document to scroll unexpectedly.

As a consequence of this linked issue, the loss of focus led to the editor entirely losing its focus, resulting in the inline editor hiding its UI. This behavior created confusion, as the preceding dialog (e.g., table properties) appeared to close unexpectedly.

The implemented fix ensures that focus is only shifted away from the dialog if it is currently focused. As a result, the editor retains its UI when closing nested dialogs.
Copy link
Contributor

Choose a reason for hiding this comment

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

Great work on the docs as always. I have a few suggestions to make:

Based on my understanding, this issue was not exclusive to inline editors (the title of the JIRA ticket is slightly inaccurate). It still happens in classic mode, but the difference is that inline mode not only loses focus of the dialog, but also hides the UI since it is no longer in focus. So I think we can generalise it to include all editors.

Additionally, I would like to suggest that it's also not necessary to mention the linked issue because it may be more confusing that helpful. Personally I would just focus on the relevant part for the readers which is what the issue was, how it impacted them, and how it's solved.

Feel free to disagree or ask me to edit change my suggestions :)

Suggested change
When closing dialogs in an inline editor, focus was unintentionally lost before the dialog was fully closed. This issue was linked to link:https://www.tiny.cloud/docs/tinymce/6/6.5.1-release-notes/#closing-a-dialog-would-scroll-down-the-document-in-safari-on-macos[Closing a dialog would scroll down the document in Safari on macOS^] which was fixed in {productname} 6.5.1, where dismissing the Search/Replace dialog by clicking outside of it in Safari on macOS caused the document to scroll unexpectedly.
As a consequence of this linked issue, the loss of focus led to the editor entirely losing its focus, resulting in the inline editor hiding its UI. This behavior created confusion, as the preceding dialog (e.g., table properties) appeared to close unexpectedly.
The implemented fix ensures that focus is only shifted away from the dialog if it is currently focused. As a result, the editor retains its UI when closing nested dialogs.
Previously in {productname}, closing a nested dialog (such as the color picker dialog within the Table Properties dialog) would cause the editor to lose focus on the parent dialog and shift focus to the editor content in the background.
This issue impacted keyboard users, preventing them from navigating or closing the parent dialog since the focus was no longer on the dialog. Additionally, in inline mode editors, the dialog UI would disappear entirely when focus shifted to the editor area, giving the impression that the dialog had closed unexpectedly.
This issue has been resolved by ensuring focus returns to the parent dialog when a nested dialog is closed. As a result, keyboard users can now navigate and close dialogs as expected, and the dialog UI remains visible in inline mode editors.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
upcoming release Documentation for features currently under development/QA
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants