Style Book: Clear Global Styles navigation history when selecting a block #46391
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
noisysocks
added
[Type] Bug
|
Size Change: +149 B (0%) Total Size: 1.32 MB
ℹ️ View Unchanged
|
ramonjd
approved these changes
Dec 12, 2022
noisysocks
deleted the
update/clear-navigator-history-when-selecting-block-in-style-book
branch
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?
Follows #45960.
Clears out the Global Styles navigation history when selecting a block in Style Book, so that pressing the back button after selecting a block in Style Book goes back to the root instead of to wherever you were previously.
Why?
Addressing this feedback from @javierarce in #45960 (comment):
How?
To clear the history we simply call
navigator.goBack()until we're at the root. We can tell how many times we need to do this by counting the number of/s in the path. For example if we're at/typography/headingsthen we need to go back twice.One gotcha is that block names can contain
/i.e./blocks/core/paragraph/typography. To work around this I've updated Global Styles to URI encode the block name i.e./blocks/core%2Fparagraph/typography. It makes sense to do this anyway since these paths approximate a URL.An alternative approach is to add something like
navigator.clearHistory()to the Navigator API. I'm not sure how widely useful this would be though so thought I'd start with an approach that requires minimal changes to@wordpress/components.I did have to make one minimal change to
@wordpress/componentswhich is to updatenavigator.goToandnavigator.goBackto use thesetState( prevState => ... )pattern so that multiple calls to these functions can be made in one render cycle.I also fixed a small bug I noticed which is that if you select Buttons in Style Book then both Button and Buttons appear selected. This was because I was using
path.startsWith()to determine if the block is selected andcore/buttonsstarts withcore/button🙂Testing Instructions
An E2E test for this is included.
To test manually:
Testing Instructions for Keyboard