Remove invisible overlay over metaboxes while saving #64619
+0
−11
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
An invisible element is placed on top of metaboxes in the block editor, preventing clicks while the post is saving. While this might make sense in theory, in reality, it results in flaky playwright tests which rely on access to elements in that element. It's also inconsistently used, as blocks themselves do not do this same thing. Removing this makes playwright tests less flaky, provides a more consistent user experience. Applying invisible divs preventing clicks are not a reliable way to doing this anyway, as you can still use the tab key to navigate into that area and make changes, for example.
|
Size Change: -57 B (0%) Total Size: 1.77 MB
ℹ️ View Unchanged
|
This comment was marked as outdated.
This comment was marked as outdated.
johnstonphilip
added
CSS Styling
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?
This PR removes the use of an invisible element to prevent clicks inside metaboxes during a save.
Why?
While the existing approach might make sense in theory, in reality, it results in flaky playwright tests which rely on access to elements in that element.
It's also inconsistently used, as blocks themselves do not do this same thing.
This approach is not a reliable way of doing this anyway, as you can still use the tab key to navigate into that area and make changes, for example.
How?
This PR simply removes the CSS which puts the empty element on top of the metabox.
Testing Instructions
trunkload a post in the UI and enable Custom Fields in the Post Editor's Preferencesis-loadingclass applied to theedit-post-meta-boxes-areaelements.try/remove-is-loading-invisible-overlay, notice that div is no longer there.Testing Instructions for Keyboard
Notice you can tab into the metaboxes on either branch, highlighting that this is not needed or reliable, and can be removed.
Screenshots or screencast