Skip to content
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

Avoid copying global style presets via the styles compatibility hook #52640

Merged
merged 3 commits into from
Jul 17, 2023
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions packages/block-editor/src/components/block-list/layout.js
Original file line number Diff line number Diff line change
@@ -32,15 +32,15 @@ export function LayoutStyle( { layout = {}, css, ...props } ) {

if ( layoutType ) {
if ( css ) {
return <style>{ css }</style>;
return <style data-global-style="preset">{ css }</style>;
}
const layoutStyle = layoutType.getLayoutStyle?.( {
hasBlockGapSupport,
layout,
...props,
} );
if ( layoutStyle ) {
return <style>{ layoutStyle }</style>;
return <style data-global-style="preset">{ layoutStyle }</style>;
}
}
return null;
4 changes: 3 additions & 1 deletion packages/block-editor/src/components/editor-styles/index.js
Original file line number Diff line number Diff line change
@@ -96,7 +96,9 @@ export default function EditorStyles( { styles } ) {
but this could be any element. */ }
<style ref={ useDarkThemeBodyClassName( stylesArray ) } />
{ transformedStyles.map( ( css, index ) => (
<style key={ index }>{ css }</style>
<style data-global-style="preset" key={ index }>
{ css }
</style>
) ) }
<SVG
xmlns="http://www.w3.org/2000/svg"
Original file line number Diff line number Diff line change
@@ -45,6 +45,11 @@ export function useCompatibilityStyles() {
return accumulator;
}

// Don't try to add global style presets; they're directly rendered in iframe.
if ( ownerNode.dataset.globalStyle === 'preset' ) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Alternatively we could only accept stylesheets with an ID, which is any stylesheet added through the WP dependency system. What do you think?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That should work as well, and no need to maintain the "markers" concept. I'll update the code.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great. This compat layer was anyway only intended to be for styles added through the WP dependency system.

return accumulator;
}

function matchFromRules( _cssRules ) {
return Array.from( _cssRules ).find(
( {