Legacy Group inner block wrapper should work with constrained layout. #44660
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
tellthemachines
requested review from
jeremyfelt,
youknowriad and
andrewserong
tellthemachines
added
[Type] Bug
|
Oh, great catch! I'll take this for a spin later on today. At first glance, do we also need to update the server-side equivalent, too? gutenberg/lib/block-supports/layout.php Line 432 in e5e9986 |
aaah yes, you're right! |
|
Size Change: +2.25 kB (0%) Total Size: 1.27 MB
ℹ️ View Unchanged
|
andrewserong
approved these changes
Oct 4, 2022
There was a problem hiding this comment.
Thanks for fixing this up!
✅ Confirmed that flex, default, and constrained layouts do not render an inner container on blocks-based themes, in the editor and on the site frontend
✅ Confirmed that with this change, in Classic themes, the wp-block-group__inner-container is now injected for both the default and the constrained layout type in both the editor and on the site frontend:
LGTM! ✨
tellthemachines
commented
Oct 4, 2022
| .is-layout-flow.block-editor-block-list__block:not(.is-selected) > & { | ||
| .is-layout-flow.block-editor-block-list__block:not(.is-selected) > &, | ||
| .is-layout-constrained.block-editor-block-list__block:not(.is-selected) .block-editor-block-list__layout > &, | ||
| .is-layout-flow.block-editor-block-list__block:not(.is-selected) .block-editor-block-list__layout > & { |
There was a problem hiding this comment.
I had to add these styles so that empty Group blocks in classic themes, where the block has an inner wrapper, also show the non-selected state. Cc @jasmussen in case you have better ideas on how to address this!
There was a problem hiding this comment.
I'm unable to test at the moment, but the main change to consider would be adding a > between the selectors so it only targets the direct descendant, and not any nested groups. Not sure if necessary in practice since the group would by definition be empty and not have anything inside to inherit. 🤔
Though to finish the thought, this would be the alternative:
.is-layout-constrained.block-editor-block-list__block:not(.is-selected) > .block-editor-block-list__layout > &,
.is-layout-flow.block-editor-block-list__block:not(.is-selected) > .block-editor-block-list__layout > & {
And the way to test would be to add an empty group inside a group. As noted, probably no difference to spot.
There was a problem hiding this comment.
Good point, as it is it could potentially make a placeholder appear in any child block with only an inserter. I'll update it, thanks!
|
This may be more of a question or confusion from my side: If I open the code editor mode of the block editor, or if I copy and the paste the block markup into my code editor, |
Thanks for raising this @carolinan — this is a slightly unusual feature, but the additional group wrapper is intentionally not serialised to the database, but is instead generated dynamically in the editor JS and at render time on the server. It provides a layer of backwards compatibility, and ensures that if a user were to switch from a Classic theme to a blocks-based theme, the post content for these particular group blocks would not need to be migrated, and things would continue to work as-is, without the inner container element. |
|
Thanks @tellthemachines! |
ockham
pushed a commit
that referenced
this pull request
Oct 10, 2022
…#44660) * Legacy Group inner block wrapper should work with constrained layout. * Also restore wrapper on the front end. * Allow Group blocks with inner wrapper to show placeholder * More specific CSS selectors.
|
I just cherry-picked this PR to the wp/6.1 branch to get it included in the next release: 8c0c1a5 |
ockham
removed
the
Backport to WP 6.7 Beta/RC
This was referenced Oct 11, 2022
pento
pushed a commit
to WordPress/wordpress-develop
that referenced
this pull request
Oct 11, 2022
Package updates for bug and regression fixes: @wordpress/block-directory: 3.15.6 @wordpress/block-editor: 10.0.6 @wordpress/block-library: 7.14.6 @wordpress/components: 21.0.5 @wordpress/customize-widgets: 3.14.6 @wordpress/edit-post: 6.14.6 @wordpress/edit-site: 4.14.8 @wordpress/edit-widgets: 4.14.6 @wordpress/editor: 12.16.6 @wordpress/format-library: 3.15.6 @wordpress/interface: 4.16.5 @wordpress/list-reusable-blocks: 3.15.5 @wordpress/nux: 5.15.5 @wordpress/preferences: 2.9.5 @wordpress/reusable-blocks: 3.15.6 @wordpress/server-side-render: 3.15.5 @wordpress/widgets: 2.15.6 References: * [WordPress/gutenberg#43181 Gutenberg PR 43181] - Merge inner blocks if wrappers are equal * [WordPress/gutenberg#44098 Gutenberg PR 44098] - Fix content blocks with nested blocks always appear as top level * [WordPress/gutenberg#44150 Gutenberg PR 44150] - Refresh selection styles * [WordPress/gutenberg#44415 Gutenberg PR 44415] - Removes `__unstableMaxPages` attribute from Page List and Nav blocks * [WordPress/gutenberg#44463 Gutenberg PR 44463] - Follow discussion settings in the comments block edit * [WordPress/gutenberg#44584 Gutenberg PR 44584] - Avoid querying block templates during installation * [WordPress/gutenberg#44637 Gutenberg PR 44637] - Resizable editor: Fix height setting bug * [WordPress/gutenberg#44640 Gutenberg PR 44640] - Only include theme.css if the theme declares support for wp-block-styles * [WordPress/gutenberg#44650 Gutenberg PR 44650] - Fix empty links being created for the author's name comment * [WordPress/gutenberg#44652 Gutenberg PR 44652] - Block Editor: Fix block search for non-Latin characters * [WordPress/gutenberg#44660 Gutenberg PR 44660] - Legacy Group inner block wrapper should work with constrained layout * [WordPress/gutenberg#44676 Gutenberg PR 44676] - Hide list items from content area of content locked blocks * [WordPress/gutenberg#44718 Gutenberg PR 44718] - Margin visualizer: Apply negative value to margins with `calc()` * [WordPress/gutenberg#44721 Gutenberg PR 44721] - Remove anchor support from the navigation block * [WordPress/gutenberg#44731 Gutenberg PR 44731] - Buttons: Add specificity for the editor Follow-up to [54257], [54335], and [54383]. Props bernhard-reiter, czapla, annezazu, cbravobernal, ndiego, bjorsch, nendeb55. See #56467. git-svn-id: https://develop.svn.wordpress.org/trunk@54483 602fd350-edb4-49c9-b593-d223f7449a82
markjaquith
pushed a commit
to markjaquith/WordPress
that referenced
this pull request
Oct 11, 2022
Package updates for bug and regression fixes: @wordpress/block-directory: 3.15.6 @wordpress/block-editor: 10.0.6 @wordpress/block-library: 7.14.6 @wordpress/components: 21.0.5 @wordpress/customize-widgets: 3.14.6 @wordpress/edit-post: 6.14.6 @wordpress/edit-site: 4.14.8 @wordpress/edit-widgets: 4.14.6 @wordpress/editor: 12.16.6 @wordpress/format-library: 3.15.6 @wordpress/interface: 4.16.5 @wordpress/list-reusable-blocks: 3.15.5 @wordpress/nux: 5.15.5 @wordpress/preferences: 2.9.5 @wordpress/reusable-blocks: 3.15.6 @wordpress/server-side-render: 3.15.5 @wordpress/widgets: 2.15.6 References: * [WordPress/gutenberg#43181 Gutenberg PR 43181] - Merge inner blocks if wrappers are equal * [WordPress/gutenberg#44098 Gutenberg PR 44098] - Fix content blocks with nested blocks always appear as top level * [WordPress/gutenberg#44150 Gutenberg PR 44150] - Refresh selection styles * [WordPress/gutenberg#44415 Gutenberg PR 44415] - Removes `__unstableMaxPages` attribute from Page List and Nav blocks * [WordPress/gutenberg#44463 Gutenberg PR 44463] - Follow discussion settings in the comments block edit * [WordPress/gutenberg#44584 Gutenberg PR 44584] - Avoid querying block templates during installation * [WordPress/gutenberg#44637 Gutenberg PR 44637] - Resizable editor: Fix height setting bug * [WordPress/gutenberg#44640 Gutenberg PR 44640] - Only include theme.css if the theme declares support for wp-block-styles * [WordPress/gutenberg#44650 Gutenberg PR 44650] - Fix empty links being created for the author's name comment * [WordPress/gutenberg#44652 Gutenberg PR 44652] - Block Editor: Fix block search for non-Latin characters * [WordPress/gutenberg#44660 Gutenberg PR 44660] - Legacy Group inner block wrapper should work with constrained layout * [WordPress/gutenberg#44676 Gutenberg PR 44676] - Hide list items from content area of content locked blocks * [WordPress/gutenberg#44718 Gutenberg PR 44718] - Margin visualizer: Apply negative value to margins with `calc()` * [WordPress/gutenberg#44721 Gutenberg PR 44721] - Remove anchor support from the navigation block * [WordPress/gutenberg#44731 Gutenberg PR 44731] - Buttons: Add specificity for the editor Follow-up to [54257], [54335], and [54383]. Props bernhard-reiter, czapla, annezazu, cbravobernal, ndiego, bjorsch, nendeb55. See #56467. Built from https://develop.svn.wordpress.org/trunk@54483 git-svn-id: http://core.svn.wordpress.org/trunk@54042 1a063a9b-81f0-0310-95a4-ce76da25c4cd
github-actions bot
pushed a commit
to platformsh/wordpress-performance
that referenced
this pull request
Oct 11, 2022
Package updates for bug and regression fixes: @wordpress/block-directory: 3.15.6 @wordpress/block-editor: 10.0.6 @wordpress/block-library: 7.14.6 @wordpress/components: 21.0.5 @wordpress/customize-widgets: 3.14.6 @wordpress/edit-post: 6.14.6 @wordpress/edit-site: 4.14.8 @wordpress/edit-widgets: 4.14.6 @wordpress/editor: 12.16.6 @wordpress/format-library: 3.15.6 @wordpress/interface: 4.16.5 @wordpress/list-reusable-blocks: 3.15.5 @wordpress/nux: 5.15.5 @wordpress/preferences: 2.9.5 @wordpress/reusable-blocks: 3.15.6 @wordpress/server-side-render: 3.15.5 @wordpress/widgets: 2.15.6 References: * [WordPress/gutenberg#43181 Gutenberg PR 43181] - Merge inner blocks if wrappers are equal * [WordPress/gutenberg#44098 Gutenberg PR 44098] - Fix content blocks with nested blocks always appear as top level * [WordPress/gutenberg#44150 Gutenberg PR 44150] - Refresh selection styles * [WordPress/gutenberg#44415 Gutenberg PR 44415] - Removes `__unstableMaxPages` attribute from Page List and Nav blocks * [WordPress/gutenberg#44463 Gutenberg PR 44463] - Follow discussion settings in the comments block edit * [WordPress/gutenberg#44584 Gutenberg PR 44584] - Avoid querying block templates during installation * [WordPress/gutenberg#44637 Gutenberg PR 44637] - Resizable editor: Fix height setting bug * [WordPress/gutenberg#44640 Gutenberg PR 44640] - Only include theme.css if the theme declares support for wp-block-styles * [WordPress/gutenberg#44650 Gutenberg PR 44650] - Fix empty links being created for the author's name comment * [WordPress/gutenberg#44652 Gutenberg PR 44652] - Block Editor: Fix block search for non-Latin characters * [WordPress/gutenberg#44660 Gutenberg PR 44660] - Legacy Group inner block wrapper should work with constrained layout * [WordPress/gutenberg#44676 Gutenberg PR 44676] - Hide list items from content area of content locked blocks * [WordPress/gutenberg#44718 Gutenberg PR 44718] - Margin visualizer: Apply negative value to margins with `calc()` * [WordPress/gutenberg#44721 Gutenberg PR 44721] - Remove anchor support from the navigation block * [WordPress/gutenberg#44731 Gutenberg PR 44731] - Buttons: Add specificity for the editor Follow-up to [54257], [54335], and [54383]. Props bernhard-reiter, czapla, annezazu, cbravobernal, ndiego, bjorsch, nendeb55. See #56467. Built from https://develop.svn.wordpress.org/trunk@54483 git-svn-id: https://core.svn.wordpress.org/trunk@54042 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This was referenced Oct 17, 2022
ootwch
pushed a commit
to ootwch/wordpress-develop
that referenced
this pull request
Nov 4, 2022
Package updates for bug and regression fixes: @wordpress/block-directory: 3.15.6 @wordpress/block-editor: 10.0.6 @wordpress/block-library: 7.14.6 @wordpress/components: 21.0.5 @wordpress/customize-widgets: 3.14.6 @wordpress/edit-post: 6.14.6 @wordpress/edit-site: 4.14.8 @wordpress/edit-widgets: 4.14.6 @wordpress/editor: 12.16.6 @wordpress/format-library: 3.15.6 @wordpress/interface: 4.16.5 @wordpress/list-reusable-blocks: 3.15.5 @wordpress/nux: 5.15.5 @wordpress/preferences: 2.9.5 @wordpress/reusable-blocks: 3.15.6 @wordpress/server-side-render: 3.15.5 @wordpress/widgets: 2.15.6 References: * [WordPress/gutenberg#43181 Gutenberg PR 43181] - Merge inner blocks if wrappers are equal * [WordPress/gutenberg#44098 Gutenberg PR 44098] - Fix content blocks with nested blocks always appear as top level * [WordPress/gutenberg#44150 Gutenberg PR 44150] - Refresh selection styles * [WordPress/gutenberg#44415 Gutenberg PR 44415] - Removes `__unstableMaxPages` attribute from Page List and Nav blocks * [WordPress/gutenberg#44463 Gutenberg PR 44463] - Follow discussion settings in the comments block edit * [WordPress/gutenberg#44584 Gutenberg PR 44584] - Avoid querying block templates during installation * [WordPress/gutenberg#44637 Gutenberg PR 44637] - Resizable editor: Fix height setting bug * [WordPress/gutenberg#44640 Gutenberg PR 44640] - Only include theme.css if the theme declares support for wp-block-styles * [WordPress/gutenberg#44650 Gutenberg PR 44650] - Fix empty links being created for the author's name comment * [WordPress/gutenberg#44652 Gutenberg PR 44652] - Block Editor: Fix block search for non-Latin characters * [WordPress/gutenberg#44660 Gutenberg PR 44660] - Legacy Group inner block wrapper should work with constrained layout * [WordPress/gutenberg#44676 Gutenberg PR 44676] - Hide list items from content area of content locked blocks * [WordPress/gutenberg#44718 Gutenberg PR 44718] - Margin visualizer: Apply negative value to margins with `calc()` * [WordPress/gutenberg#44721 Gutenberg PR 44721] - Remove anchor support from the navigation block * [WordPress/gutenberg#44731 Gutenberg PR 44731] - Buttons: Add specificity for the editor Follow-up to [54257], [54335], and [54383]. Props bernhard-reiter, czapla, annezazu, cbravobernal, ndiego, bjorsch, nendeb55. See #56467. git-svn-id: https://develop.svn.wordpress.org/trunk@54483 602fd350-edb4-49c9-b593-d223f7449a82
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.
Why?
Fixes #44636.
How?
The condition to render the Group inner block wrapper should include constrained layout Groups as these are the new default type.
Testing Instructions
Screenshots or screencast