[WP6.1] Site editor clips body background style #45118
Merged
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
t-hamano
added
[Type] Bug
|
|
|
Size Change: +11 B (0%) Total Size: 1.26 MB
ℹ️ View Unchanged
|
t-hamano
changed the title
|
I have run the performance test twice and it failed. Is this due to this PR? |
ockham
added
the
Backport to WP Beta/RC
|
While I can easily reproduce this issue in WP 6.1 RC2, I still struggle to reproduce it in a local dev environment. I've tried the following: With
|
|
In order to test this, I ended up running an install of WP 6.1 RC2. I then did the following:
|
No, I'm pretty sure that's unrelated; they've been failing for PRs against (Ideally, we should fix that; but FWIW, it's not a blocker for merging this PR.) |
|
I'm strongly inclided to approve this PR based on this test so we can include it in WP 6.1 RC3, but it'd be great to have someone with better CSS skills have a quick look. Tentatively pinging @jasmussen @jameskoster 😊 |
|
Also cc/ @ellatrix @youknowriad because iframe 😬 |
|
At a glance, the CSS looks fairly benign, I don't think it should cause trouble. Is the Iframe component used in other places, such as embeds or previews? It'd be good to ensure those are well tested. There's a typo, though. Here's the code:
Here it is, less minified: So you can see there's a To be sure, I haven't had a chance to test this PR yet, but it seems like if the fix works with the broken CSS for body height, perhaps we don't need it? |
Thanks for noticing that, @jasmussen! This is obviously a typo 😅 And I updated this PR because I found out that we only need |
ockham
approved these changes
Oct 24, 2022
There was a problem hiding this comment.
Based on my testing and Joen's review, this is looking good.
Let's get it into WP 6.1 RC3 👍
|
Thank you for the fix @t-hamano! |
ockham
removed
the
Backport to WP Beta/RC
This was referenced Oct 25, 2022
markjaquith
pushed a commit
to markjaquith/WordPress
that referenced
this pull request
Oct 25, 2022
Package updates for bug and regression fixes: - @wordpress/block-directory: 3.15.10 - @wordpress/block-editor: 10.0.9 - @wordpress/block-library: 7.14.10 - @wordpress/customize-widgets: 3.14.10 - @wordpress/edit-post: 6.14.10 - @wordpress/edit-site: 4.14.12 - @wordpress/edit-widgets: 4.14.10 - @wordpress/editor: 12.16.9 - @wordpress/format-library: 3.15.9 - @wordpress/reusable-blocks: 3.15.9 - @wordpress/widgets: 2.15.9 Original PRs from Gutenberg repository: * [WordPress/gutenberg#45189 Gutenberg PR 45189] - Fix resizeable editor scrolling * [WordPress/gutenberg#45234 Gutenberg PR 45234] - Reset background-image property for outline button style * [WordPress/gutenberg#45161 Gutenberg PR 45161] - Table Block: Add a deprecation for the figcaption element class name * [WordPress/gutenberg#45159 Gutenberg PR 45159] - File Block: Add a deprecation for the button element class name * [WordPress/gutenberg#45169 Gutenberg PR 45169] - Video: Add a deprecation for the caption element * [WordPress/gutenberg#45166 Gutenberg PR 45166] - Embed: Add deprecation for the caption element * [WordPress/gutenberg#45173 Gutenberg PR 45173] - Gallery: Add a deprecation for captions in the gallery block * [WordPress/gutenberg#44854 Gutenberg PR 44854] - Embed Block: Add support for Tumblr Dashboard URLs * [WordPress/gutenberg#45074 Gutenberg PR 45074] - Post editor: Rename view to Preview * [WordPress/gutenberg#45163 Gutenberg PR 45163] - Featured Image Block: Add missing output escaping * [WordPress/gutenberg#45118 Gutenberg PR 45118] - [WP6.1] Site editor clips body background style Follow-up to [54257], [54335], [54383], [54483], [54486], [54490], and [54632]. Props czapla, cbravobernal, ndiego, annezazu, davidbaumwald, desrosj, mikeschroder, hellofromtonya, ocean90. See #56467. Built from https://develop.svn.wordpress.org/trunk@54693 git-svn-id: http://core.svn.wordpress.org/trunk@54245 1a063a9b-81f0-0310-95a4-ce76da25c4cd
github-actions bot
pushed a commit
to platformsh/wordpress-performance
that referenced
this pull request
Oct 25, 2022
Package updates for bug and regression fixes: - @wordpress/block-directory: 3.15.10 - @wordpress/block-editor: 10.0.9 - @wordpress/block-library: 7.14.10 - @wordpress/customize-widgets: 3.14.10 - @wordpress/edit-post: 6.14.10 - @wordpress/edit-site: 4.14.12 - @wordpress/edit-widgets: 4.14.10 - @wordpress/editor: 12.16.9 - @wordpress/format-library: 3.15.9 - @wordpress/reusable-blocks: 3.15.9 - @wordpress/widgets: 2.15.9 Original PRs from Gutenberg repository: * [WordPress/gutenberg#45189 Gutenberg PR 45189] - Fix resizeable editor scrolling * [WordPress/gutenberg#45234 Gutenberg PR 45234] - Reset background-image property for outline button style * [WordPress/gutenberg#45161 Gutenberg PR 45161] - Table Block: Add a deprecation for the figcaption element class name * [WordPress/gutenberg#45159 Gutenberg PR 45159] - File Block: Add a deprecation for the button element class name * [WordPress/gutenberg#45169 Gutenberg PR 45169] - Video: Add a deprecation for the caption element * [WordPress/gutenberg#45166 Gutenberg PR 45166] - Embed: Add deprecation for the caption element * [WordPress/gutenberg#45173 Gutenberg PR 45173] - Gallery: Add a deprecation for captions in the gallery block * [WordPress/gutenberg#44854 Gutenberg PR 44854] - Embed Block: Add support for Tumblr Dashboard URLs * [WordPress/gutenberg#45074 Gutenberg PR 45074] - Post editor: Rename view to Preview * [WordPress/gutenberg#45163 Gutenberg PR 45163] - Featured Image Block: Add missing output escaping * [WordPress/gutenberg#45118 Gutenberg PR 45118] - [WP6.1] Site editor clips body background style Follow-up to [54257], [54335], [54383], [54483], [54486], [54490], and [54632]. Props czapla, cbravobernal, ndiego, annezazu, davidbaumwald, desrosj, mikeschroder, hellofromtonya, ocean90. See #56467. Built from https://develop.svn.wordpress.org/trunk@54693 git-svn-id: https://core.svn.wordpress.org/trunk@54245 1a063a9b-81f0-0310-95a4-ce76da25c4cd
pento
pushed a commit
to WordPress/wordpress-develop
that referenced
this pull request
Oct 25, 2022
Package updates for bug and regression fixes since 6.1 RC 2: - @wordpress/block-directory: 3.15.10 - @wordpress/block-editor: 10.0.9 - @wordpress/block-library: 7.14.10 - @wordpress/customize-widgets: 3.14.10 - @wordpress/edit-post: 6.14.10 - @wordpress/edit-site: 4.14.12 - @wordpress/edit-widgets: 4.14.10 - @wordpress/editor: 12.16.9 - @wordpress/format-library: 3.15.9 - @wordpress/reusable-blocks: 3.15.9 - @wordpress/widgets: 2.15.9 Original PRs from Gutenberg repository: * [WordPress/gutenberg#45189 Gutenberg PR 45189] - Fix resizeable editor scrolling * [WordPress/gutenberg#45234 Gutenberg PR 45234] - Reset background-image property for outline button style * [WordPress/gutenberg#45161 Gutenberg PR 45161] - Table Block: Add a deprecation for the figcaption element class name * [WordPress/gutenberg#45159 Gutenberg PR 45159] - File Block: Add a deprecation for the button element class name * [WordPress/gutenberg#45169 Gutenberg PR 45169] - Video: Add a deprecation for the caption element * [WordPress/gutenberg#45166 Gutenberg PR 45166] - Embed: Add deprecation for the caption element * [WordPress/gutenberg#45173 Gutenberg PR 45173] - Gallery: Add a deprecation for captions in the gallery block * [WordPress/gutenberg#44854 Gutenberg PR 44854] - Embed Block: Add support for Tumblr Dashboard URLs * [WordPress/gutenberg#45074 Gutenberg PR 45074] - Post editor: Rename view to Preview * [WordPress/gutenberg#45163 Gutenberg PR 45163] - Featured Image Block: Add missing output escaping * [WordPress/gutenberg#45118 Gutenberg PR 45118] - [WP6.1] Site editor clips body background style Follow-up to [54257], [54335], [54383], [54483], [54486], [54490], and [54632]. Props czapla, cbravobernal, ndiego, annezazu, davidbaumwald, desrosj, mikeschroder, hellofromtonya, ocean90. Reviewed by desrosj, hellofromTonya, SergeyBiryukov. Merges [54693] to the 6.1 branch. See #56467. git-svn-id: https://develop.svn.wordpress.org/branches/6.1@54694 602fd350-edb4-49c9-b593-d223f7449a82
markjaquith
pushed a commit
to markjaquith/WordPress
that referenced
this pull request
Oct 25, 2022
Package updates for bug and regression fixes since 6.1 RC 2: - @wordpress/block-directory: 3.15.10 - @wordpress/block-editor: 10.0.9 - @wordpress/block-library: 7.14.10 - @wordpress/customize-widgets: 3.14.10 - @wordpress/edit-post: 6.14.10 - @wordpress/edit-site: 4.14.12 - @wordpress/edit-widgets: 4.14.10 - @wordpress/editor: 12.16.9 - @wordpress/format-library: 3.15.9 - @wordpress/reusable-blocks: 3.15.9 - @wordpress/widgets: 2.15.9 Original PRs from Gutenberg repository: * [WordPress/gutenberg#45189 Gutenberg PR 45189] - Fix resizeable editor scrolling * [WordPress/gutenberg#45234 Gutenberg PR 45234] - Reset background-image property for outline button style * [WordPress/gutenberg#45161 Gutenberg PR 45161] - Table Block: Add a deprecation for the figcaption element class name * [WordPress/gutenberg#45159 Gutenberg PR 45159] - File Block: Add a deprecation for the button element class name * [WordPress/gutenberg#45169 Gutenberg PR 45169] - Video: Add a deprecation for the caption element * [WordPress/gutenberg#45166 Gutenberg PR 45166] - Embed: Add deprecation for the caption element * [WordPress/gutenberg#45173 Gutenberg PR 45173] - Gallery: Add a deprecation for captions in the gallery block * [WordPress/gutenberg#44854 Gutenberg PR 44854] - Embed Block: Add support for Tumblr Dashboard URLs * [WordPress/gutenberg#45074 Gutenberg PR 45074] - Post editor: Rename view to Preview * [WordPress/gutenberg#45163 Gutenberg PR 45163] - Featured Image Block: Add missing output escaping * [WordPress/gutenberg#45118 Gutenberg PR 45118] - [WP6.1] Site editor clips body background style Follow-up to [54257], [54335], [54383], [54483], [54486], [54490], and [54632]. Props czapla, cbravobernal, ndiego, annezazu, davidbaumwald, desrosj, mikeschroder, hellofromtonya, ocean90. Reviewed by desrosj, hellofromTonya, SergeyBiryukov. Merges [54693] to the 6.1 branch. See #56467. Built from https://develop.svn.wordpress.org/branches/6.1@54694 git-svn-id: http://core.svn.wordpress.org/branches/6.1@54246 1a063a9b-81f0-0310-95a4-ce76da25c4cd
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.10 - @wordpress/block-editor: 10.0.9 - @wordpress/block-library: 7.14.10 - @wordpress/customize-widgets: 3.14.10 - @wordpress/edit-post: 6.14.10 - @wordpress/edit-site: 4.14.12 - @wordpress/edit-widgets: 4.14.10 - @wordpress/editor: 12.16.9 - @wordpress/format-library: 3.15.9 - @wordpress/reusable-blocks: 3.15.9 - @wordpress/widgets: 2.15.9 Original PRs from Gutenberg repository: * [WordPress/gutenberg#45189 Gutenberg PR 45189] - Fix resizeable editor scrolling * [WordPress/gutenberg#45234 Gutenberg PR 45234] - Reset background-image property for outline button style * [WordPress/gutenberg#45161 Gutenberg PR 45161] - Table Block: Add a deprecation for the figcaption element class name * [WordPress/gutenberg#45159 Gutenberg PR 45159] - File Block: Add a deprecation for the button element class name * [WordPress/gutenberg#45169 Gutenberg PR 45169] - Video: Add a deprecation for the caption element * [WordPress/gutenberg#45166 Gutenberg PR 45166] - Embed: Add deprecation for the caption element * [WordPress/gutenberg#45173 Gutenberg PR 45173] - Gallery: Add a deprecation for captions in the gallery block * [WordPress/gutenberg#44854 Gutenberg PR 44854] - Embed Block: Add support for Tumblr Dashboard URLs * [WordPress/gutenberg#45074 Gutenberg PR 45074] - Post editor: Rename view to Preview * [WordPress/gutenberg#45163 Gutenberg PR 45163] - Featured Image Block: Add missing output escaping * [WordPress/gutenberg#45118 Gutenberg PR 45118] - [WP6.1] Site editor clips body background style Follow-up to [54257], [54335], [54383], [54483], [54486], [54490], and [54632]. Props czapla, cbravobernal, ndiego, annezazu, davidbaumwald, desrosj, mikeschroder, hellofromtonya, ocean90. See #56467. git-svn-id: https://develop.svn.wordpress.org/trunk@54693 602fd350-edb4-49c9-b593-d223f7449a82
VenusPR
added a commit
to VenusPR/Wordpress_Richard
that referenced
this pull request
Mar 9, 2023
Package updates for bug and regression fixes: - @wordpress/block-directory: 3.15.10 - @wordpress/block-editor: 10.0.9 - @wordpress/block-library: 7.14.10 - @wordpress/customize-widgets: 3.14.10 - @wordpress/edit-post: 6.14.10 - @wordpress/edit-site: 4.14.12 - @wordpress/edit-widgets: 4.14.10 - @wordpress/editor: 12.16.9 - @wordpress/format-library: 3.15.9 - @wordpress/reusable-blocks: 3.15.9 - @wordpress/widgets: 2.15.9 Original PRs from Gutenberg repository: * [WordPress/gutenberg#45189 Gutenberg PR 45189] - Fix resizeable editor scrolling * [WordPress/gutenberg#45234 Gutenberg PR 45234] - Reset background-image property for outline button style * [WordPress/gutenberg#45161 Gutenberg PR 45161] - Table Block: Add a deprecation for the figcaption element class name * [WordPress/gutenberg#45159 Gutenberg PR 45159] - File Block: Add a deprecation for the button element class name * [WordPress/gutenberg#45169 Gutenberg PR 45169] - Video: Add a deprecation for the caption element * [WordPress/gutenberg#45166 Gutenberg PR 45166] - Embed: Add deprecation for the caption element * [WordPress/gutenberg#45173 Gutenberg PR 45173] - Gallery: Add a deprecation for captions in the gallery block * [WordPress/gutenberg#44854 Gutenberg PR 44854] - Embed Block: Add support for Tumblr Dashboard URLs * [WordPress/gutenberg#45074 Gutenberg PR 45074] - Post editor: Rename view to Preview * [WordPress/gutenberg#45163 Gutenberg PR 45163] - Featured Image Block: Add missing output escaping * [WordPress/gutenberg#45118 Gutenberg PR 45118] - [WP6.1] Site editor clips body background style Follow-up to [54257], [54335], [54383], [54483], [54486], [54490], and [54632]. Props czapla, cbravobernal, ndiego, annezazu, davidbaumwald, desrosj, mikeschroder, hellofromtonya, ocean90. See #56467. Built from https://develop.svn.wordpress.org/trunk@54693 git-svn-id: http://core.svn.wordpress.org/trunk@54245 1a063a9b-81f0-0310-95a4-ce76da25c4cd
VenusPR
added a commit
to VenusPR/Wordpress_Richard
that referenced
this pull request
Mar 9, 2023
Package updates for bug and regression fixes since 6.1 RC 2: - @wordpress/block-directory: 3.15.10 - @wordpress/block-editor: 10.0.9 - @wordpress/block-library: 7.14.10 - @wordpress/customize-widgets: 3.14.10 - @wordpress/edit-post: 6.14.10 - @wordpress/edit-site: 4.14.12 - @wordpress/edit-widgets: 4.14.10 - @wordpress/editor: 12.16.9 - @wordpress/format-library: 3.15.9 - @wordpress/reusable-blocks: 3.15.9 - @wordpress/widgets: 2.15.9 Original PRs from Gutenberg repository: * [WordPress/gutenberg#45189 Gutenberg PR 45189] - Fix resizeable editor scrolling * [WordPress/gutenberg#45234 Gutenberg PR 45234] - Reset background-image property for outline button style * [WordPress/gutenberg#45161 Gutenberg PR 45161] - Table Block: Add a deprecation for the figcaption element class name * [WordPress/gutenberg#45159 Gutenberg PR 45159] - File Block: Add a deprecation for the button element class name * [WordPress/gutenberg#45169 Gutenberg PR 45169] - Video: Add a deprecation for the caption element * [WordPress/gutenberg#45166 Gutenberg PR 45166] - Embed: Add deprecation for the caption element * [WordPress/gutenberg#45173 Gutenberg PR 45173] - Gallery: Add a deprecation for captions in the gallery block * [WordPress/gutenberg#44854 Gutenberg PR 44854] - Embed Block: Add support for Tumblr Dashboard URLs * [WordPress/gutenberg#45074 Gutenberg PR 45074] - Post editor: Rename view to Preview * [WordPress/gutenberg#45163 Gutenberg PR 45163] - Featured Image Block: Add missing output escaping * [WordPress/gutenberg#45118 Gutenberg PR 45118] - [WP6.1] Site editor clips body background style Follow-up to [54257], [54335], [54383], [54483], [54486], [54490], and [54632]. Props czapla, cbravobernal, ndiego, annezazu, davidbaumwald, desrosj, mikeschroder, hellofromtonya, ocean90. Reviewed by desrosj, hellofromTonya, SergeyBiryukov. Merges [54693] to the 6.1 branch. See #56467. Built from https://develop.svn.wordpress.org/branches/6.1@54694 git-svn-id: http://core.svn.wordpress.org/branches/6.1@54246 1a063a9b-81f0-0310-95a4-ce76da25c4cd
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.
Fix: #44374
What?
This PR fixes a problem with the site editor that is also occurring in WordPress RC2.
In a theme or theme variation, if a background color is set, it is not applied up to the actual height of the content and is looped vertically. As a result, if the background is a gradient, the background appears to be clipped in the middle.
Note: I will submit the same changes to the latest Gutenberg after this PR is merged.
Why?
Background on this issue is discussed in detail in this comment. The complication is that this problem cannot be reproduced in the usual way as long as Gutenberg plugin is enabled.
How?
Applied
height:autoto thehtmlandbodyof the iframe, withimportantto override the styles incommon.css.Testing Instructions
To test this PR (i.e., to simulate the status of WordPress core without Gutenberg), the following steps are required:
common.cssinto an iframe editor instance, add a dummy selector,.wp-block{}, towp-admin/css/common.cssin WordPress with wp-env running.htmlandbodyheight:100%that common.css is applying: