[Mobile] Fix regressions with wrapper props and font size customization #56985
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
…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
geriux
added
[Type] Bug
|
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
|
fluiddot
approved these changes
Dec 13, 2023
packages/block-library/src/paragraph/test/__snapshots__/edit.native.js.snap
Show resolved
Hide resolved
geriux
removed
the
Mobile App - Automation
|
@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! 🚀 |
4 tasks
4 tasks
artemiomorales
pushed a commit
that referenced
this pull request
Jan 4, 2024
…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
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.
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 thewrapperPropsas a prop. It also removes the usage ofgetWrapperPropsin favor ofmergeWrapperPropsthat 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
getGlobalStylesintegration 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
normalizeFontSizesfunction used in the Global styles context util to not include thedefaultfont 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