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.

Sign up for GitHub

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

Global Styles: Add Global styles to inline block styles #39571

Closed
wants to merge 1 commit into from
Closed

Global Styles: Add Global styles to inline block styles #39571

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
12 changes: 11 additions & 1 deletion lib/compat/wordpress-6.0/class-wp-theme-json-gutenberg.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,17 @@ protected function get_block_classes( $style_nodes ) {
}

// 2. Generate the rules that use the general selector.
$block_rules .= static::to_ruleset( $selector, $declarations );
// If the block is not used on this page, return.
$general_selector_rules = static::to_ruleset( $selector, $declarations );
if ( 'styles' === $metadata['path'][0] && 'blocks' === $metadata['path'][1] ) {
$block_name = str_replace( 'core/', '', $metadata['path'][2] );
wp_add_inline_style(
Copy link
Member

Choose a reason for hiding this comment

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

It terms of approach, I think we want to tap into the existing API: it already has logic to decide whether to enqueue the block's CSS as a single stylesheet with them all or a separate one per block. Otherwise, we'll need to replicate that logic for the global styles.

In terms of implementation, WP_Theme_JSON has remained agnostic about WordPress APIs (get_stylesheet, wp_add_inline_style, etc), which was the WP_Theme_JSON_Resolver responsibility. I think it's benefitial to separate those concerns.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

it already has logic to decide whether to enqueue the block's CSS as a single stylesheet with them all or a separate one per block

Do you know where this is? I can't find it!

Copy link
Member

Choose a reason for hiding this comment

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

I don't! Looking for should_load_separate_block_assets can perhaps help to start the investigation.

Copy link
Member

@aristath aristath Apr 1, 2022 •
edited
Loading

Choose a reason for hiding this comment

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

We could maybe also try using the wp_enqueue_block_style() function 🤔
Otherwise yes, you can just look up where wp_should_load_separate_core_block_assets() is used to see the details of the current implementation 😉
If you need any assistance with this, don't hesitate to reach out

"wp-block-{$block_name}",
$general_selector_rules
);
} else {
$block_rules .= $general_selector_rules;
}

// 3. Generate the rules that use the duotone selector.
if ( isset( $metadata['duotone'] ) && ! empty( $declarations_duotone ) ) {
Expand Down
4 changes: 2 additions & 2 deletions lib/compat/wordpress-6.0/get-global-styles-and-settings.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,13 +76,13 @@ function gutenberg_get_global_styles( $path = array(), $context = array() ) {
function gutenberg_get_global_stylesheet( $types = array() ) {
// Return cached value if it can be used and exists.
// It's cached by theme to make sure that theme switching clears the cache.
$can_use_cached = (
$can_use_cached = false; /* (
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Just for testing...

( empty( $types ) ) &&
( ! defined( 'WP_DEBUG' ) || ! WP_DEBUG ) &&
( ! defined( 'SCRIPT_DEBUG' ) || ! SCRIPT_DEBUG ) &&
( ! defined( 'REST_REQUEST' ) || ! REST_REQUEST ) &&
! is_admin()
);
);*/
$transient_name = 'gutenberg_global_styles_' . get_stylesheet();
if ( $can_use_cached ) {
$cached = get_transient( $transient_name );
Expand Down