-
Notifications
You must be signed in to change notification settings - Fork 4.3k
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
[Mobile] Fix regressions with wrapper props and font size customization #56985
Conversation
…nges from its web counterpart
…ith missing block props, as well as refactoring the getEditWrapperProps logic to use the same approach as its web counterpart
…Font Size selector
Size Change: 0 B Total Size: 1.71 MB ℹ️ View Unchanged
|
Flaky tests detected in 2897bd3. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/7197989166
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM 🎊 ! Thanks @geriux for addressing the issue 🏅 !
I added some comments but none should be considered blockers for merging the PR.
packages/block-library/src/paragraph/test/__snapshots__/edit.native.js.snap
Show resolved
Hide resolved
@geriux I already approved the PR but since you made recent changes in the integration tests, I wanted to let you know that it's ready to be merged from my side. |
Thank you for the review and feedback! 🚀 |
…on (#56985) * Mobile - Hooks - Use createBlockListBlockFilter * Mobile - Typography - Refactor the code to incorporate the latest changes from its web counterpart * Mobile - BlockList: Apply editor.BlockListBlock filter to fix issue with missing block props, as well as refactoring the getEditWrapperProps logic to use the same approach as its web counterpart * Mobile - Test helpers - Add more global styles data: font sizes and line height * Mobile - Font Size Picker - Improvde the accessibility label for the Font Size selector * Mobile - Paragraph tests - Add test for font size and line height customization * Mobile - Safe guard from an undefined wrapperProps value * Mobile - Fix having the default font sizes when there are theme font sizes available * Mobile - Global styles context test - Remove default font sizes * Mobile - Paragraph tests - Update tests to use modal helpers * Mobile - Paragraph tests - Adds test to check if the available font sizes are the ones expected with no duplicates * Update Changelog
Related PRs:
What?
This PR fixes a regression to recent refactors in the following PRs:
Which affected the Font size customization in the mobile editor. It also broke the wrapper props to set styles to blocks.
Why?
To fix the areas in the editor that weren't working as well as updating the native variants with their web counterparts.
How?
Adds the usage of createBlockListBlockFilter with the features we currently support.
Refactors the code in the Typography hook to use some of the changes the web editor recently introduced.
It adds the
'editor.BlockListBlock'
filter to the Block List block component to get thewrapperProps
as a prop. It also removes the usage ofgetWrapperProps
in favor ofmergeWrapperProps
that the web editor uses, I ended up copying the function instead of using the same one to prevent possible breakages in the future but we could try to share the same one.This caching of props that I'm removing was introduced in #22144 I checked that the re-renders are still the same after removing it.
Updated the
getGlobalStyles
integration test helper to include font size and line height values with as global styles, so we can test the integration with the Font size and Line height picker.The accessibility label for the Font Size option wasn't set correctly, the value it had was just "Custom" with no indication of what it was so I changed it here.
Introduced two integration tests for the Paragraph block to test setting a Font Size and Line Height value.
Changed the
normalizeFontSizes
function used in the Global styles context util to not include thedefault
font sizes if the theme and custom font sizes exist from the Theme. Because if not you'd get duplicated font sizes and the default values should show up if there aren't any other font sizes available.Testing Instructions
Font size customization
Line height customization
Block style customization
Inheritance of block styles
Testing Instructions for Keyboard
N/A
Screenshots or screencast
AfterChanges.mp4