Fix tabbing from first or last block in site editor #42036
Merged
Conversation
This file contains 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
talldan
added
[Type] Bug
|
Size Change: +1 B (0%) Total Size: 1.25 MB
ℹ️ View Unchanged
|
talldan
force-pushed
the
fix/tabbing-from-first-or-last-block-in-site-editor
branch
from
4440fe0 to
6528693
Compare
aaronrobertshaw
approved these changes
Jul 8, 2022
There was a problem hiding this comment.
Thanks for fixing this @talldan 👍
As simple as the fix is, it looks like it fits with the logic of isFormElement and resolves the issue.
✅ Could replicate the original issue
✅ All E2Es pass locally
✅ Manual tests were successful following PR instructions
✅ Problem is resolved when using this branch
LGTM 🚢
|
Thanks @talldan ! |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
What?
Fixes #41811
Shift tabbing from the first block to the toolbar and tabbing from the last block to the inspector both seem to be broken in the site editor. This PR restores the expected behavior.
Why?
From what I can tell this is a side effect of the iframed editor content. The WritingFlow component implements div elements before and after the editor content that are part of the tab order. In the post editor these are focused when tabbing beyond the first/last block boundaries and some logic transfers focus to the toolbar or inspector.
In the site editor, these are outside of the iframe and can't be found by the
tabbableutility. That results inundefinedbeing passed toisFormElement, which threw an error, and resulted in the code after that point that handles toolbar/inspector navigation not executing.How?
The fix seems as simple as making
isFormElementreturnfalsewhen passedundefined. This seems ok as it matches what other similar utilities in the@wordpress/dompackage do.Testing Instructions
E2E tests have been added
Screenshots or screencast
My screencast app was quarantined as malware. 😭