From b643d7a4593669a89fc48fff9b92a5f4b8eac70f Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Thu, 18 Jan 2024 16:43:40 +1100 Subject: [PATCH 01/12] Make sure base global styles are loaded before block styles. --- src/wp-includes/default-filters.php | 4 +++- src/wp-includes/script-loader.php | 3 --- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/src/wp-includes/default-filters.php b/src/wp-includes/default-filters.php index 9cb447181aefd..ace1b76df0d02 100644 --- a/src/wp-includes/default-filters.php +++ b/src/wp-includes/default-filters.php @@ -596,9 +596,11 @@ add_filter( 'block_editor_settings_all', 'wp_add_editor_classic_theme_styles' ); // Global styles can be enqueued in both the header and the footer. See https://core.trac.wordpress.org/ticket/53494. -add_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles' ); +add_action( 'init', 'wp_enqueue_global_styles', 1 ); add_action( 'wp_footer', 'wp_enqueue_global_styles', 1 ); +add_action( 'wp_enqueue_scripts', 'wp_add_global_styles_for_blocks' ); + // Global styles custom CSS. add_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles_custom_css' ); diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php index 8886cb587b170..1649c86782ac6 100644 --- a/src/wp-includes/script-loader.php +++ b/src/wp-includes/script-loader.php @@ -2512,9 +2512,6 @@ function wp_enqueue_global_styles() { wp_register_style( 'global-styles', false ); wp_add_inline_style( 'global-styles', $stylesheet ); wp_enqueue_style( 'global-styles' ); - - // Add each block as an inline css. - wp_add_global_styles_for_blocks(); } /** From 83367d81c604eb2db5c310fb998e359c58bfdff8 Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Mon, 22 Jan 2024 15:54:25 +1100 Subject: [PATCH 02/12] Separate base and per-block global styles when single stylesheet is enabled. --- src/wp-includes/global-styles-and-settings.php | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/wp-includes/global-styles-and-settings.php b/src/wp-includes/global-styles-and-settings.php index acca33be1e844..18a420833065f 100644 --- a/src/wp-includes/global-styles-and-settings.php +++ b/src/wp-includes/global-styles-and-settings.php @@ -302,11 +302,15 @@ function wp_get_global_styles_custom_css() { function wp_add_global_styles_for_blocks() { $tree = WP_Theme_JSON_Resolver::get_merged_data(); $block_nodes = $tree->get_styles_block_nodes(); + + if ( ! wp_should_load_separate_core_block_assets() ) { + wp_register_style( 'global-styles-blocks', false ); + } foreach ( $block_nodes as $metadata ) { $block_css = $tree->get_styles_for_block( $metadata ); if ( ! wp_should_load_separate_core_block_assets() ) { - wp_add_inline_style( 'global-styles', $block_css ); + wp_add_inline_style( 'global-styles-blocks', $block_css ); continue; } @@ -336,6 +340,10 @@ function wp_add_global_styles_for_blocks() { } } } + + if ( ! wp_should_load_separate_core_block_assets() ) { + wp_enqueue_style( 'global-styles-blocks' ); + } } /** From 00dc2c3e7e81fde6d989fa1bf9447d231496b6a0 Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Mon, 22 Jan 2024 16:43:34 +1100 Subject: [PATCH 03/12] Separate base and per-block custom CSS and enqueue in different places. --- src/wp-includes/class-wp-theme-json.php | 39 +++++++++++ .../global-styles-and-settings.php | 70 +++++++++++++++++++ src/wp-includes/script-loader.php | 10 ++- 3 files changed, 118 insertions(+), 1 deletion(-) diff --git a/src/wp-includes/class-wp-theme-json.php b/src/wp-includes/class-wp-theme-json.php index 37f4d11ce9fb4..a3fe81439dcbf 100644 --- a/src/wp-includes/class-wp-theme-json.php +++ b/src/wp-includes/class-wp-theme-json.php @@ -1200,6 +1200,45 @@ public function get_custom_css() { return $stylesheet; } + /** + * Returns the global styles base custom CSS. + * + * @since 6.5.0 + * + * @return string The global styles base custom CSS. + */ + public function get_custom_base_css() { + return isset( $this->theme_json['styles']['css'] ) ? $this->theme_json['styles']['css'] : ''; + } + + + /** + * Returns the global styles per-block custom CSS. + * + * @since 6.5.0 + * + * @return string The global styles per-block custom CSS. + */ + public function get_custom_block_css() { + $stylesheet = ''; + + // Add the global styles block CSS. + if ( isset( $this->theme_json['styles']['blocks'] ) ) { + foreach ( $this->theme_json['styles']['blocks'] as $name => $node ) { + $custom_block_css = isset( $this->theme_json['styles']['blocks'][ $name ]['css'] ) + ? $this->theme_json['styles']['blocks'][ $name ]['css'] + : null; + if ( $custom_block_css ) { + $selector = static::$blocks_metadata[ $name ]['selector']; + $stylesheet .= $this->process_blocks_custom_css( $custom_block_css, $selector ); + } + } + } + + return $stylesheet; + + } + /** * Returns the page templates of the active theme. * diff --git a/src/wp-includes/global-styles-and-settings.php b/src/wp-includes/global-styles-and-settings.php index 18a420833065f..e1b6eb1da3a20 100644 --- a/src/wp-includes/global-styles-and-settings.php +++ b/src/wp-includes/global-styles-and-settings.php @@ -294,6 +294,74 @@ function wp_get_global_styles_custom_css() { return $stylesheet; } +/** + * Gets the global styles base custom CSS from theme.json. + * Logic should follow wp_get_global_styles_custom_css. + * + * @since 6.5.0 + * + * @return string The global base custom CSS. + */ +function wp_get_global_styles_base_custom_css() { + if ( ! wp_theme_has_theme_json() ) { + return ''; + } + + $can_use_cached = ! wp_is_development_mode( 'theme' ); + + $cache_key = 'wp_get_global_styles_base_custom_css'; + $cache_group = 'theme_json'; + if ( $can_use_cached ) { + $cached = wp_cache_get( $cache_key, $cache_group ); + if ( $cached ) { + return $cached; + } + } + + $tree = WP_Theme_JSON_Resolver::get_merged_data(); + $stylesheet = $tree->get_custom_base_css(); + + if ( $can_use_cached ) { + wp_cache_set( $cache_key, $stylesheet, $cache_group ); + } + + return $stylesheet; +} + +/** + * Gets the global styles per-block custom CSS from theme.json. + * Logic should follow wp_get_global_styles_custom_css. + * + * @since 6.5.0 + * + * @return string The global per-block custom CSS. + */ +function wp_get_global_styles_block_custom_css() { + if ( ! wp_theme_has_theme_json() ) { + return ''; + } + + $can_use_cached = ! wp_is_development_mode( 'theme' ); + + $cache_key = 'wp_get_global_styles_block_custom_css'; + $cache_group = 'theme_json'; + if ( $can_use_cached ) { + $cached = wp_cache_get( $cache_key, $cache_group ); + if ( $cached ) { + return $cached; + } + } + + $tree = WP_Theme_JSON_Resolver::get_merged_data(); + $stylesheet = $tree->get_custom_block_css(); + + if ( $can_use_cached ) { + wp_cache_set( $cache_key, $stylesheet, $cache_group ); + } + + return $stylesheet; +} + /** * Adds global style rules to the inline style for each block. * @@ -439,6 +507,8 @@ function wp_clean_theme_json_cache() { wp_cache_delete( 'wp_get_global_settings_custom', 'theme_json' ); wp_cache_delete( 'wp_get_global_settings_theme', 'theme_json' ); wp_cache_delete( 'wp_get_global_styles_custom_css', 'theme_json' ); + wp_cache_delete( 'wp_get_global_styles_base_custom_css', 'theme_json' ); + wp_cache_delete( 'wp_get_global_styles_block_custom_css', 'theme_json' ); wp_cache_delete( 'wp_get_theme_data_template_parts', 'theme_json' ); WP_Theme_JSON_Resolver::clean_cached_data(); } diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php index 1649c86782ac6..e47427241c6b7 100644 --- a/src/wp-includes/script-loader.php +++ b/src/wp-includes/script-loader.php @@ -2528,13 +2528,21 @@ function wp_enqueue_global_styles_custom_css() { remove_action( 'wp_head', 'wp_custom_css_cb', 101 ); $custom_css = wp_get_custom_css(); - $custom_css .= wp_get_global_styles_custom_css(); + $custom_css .= wp_get_global_styles_base_custom_css(); if ( ! empty( $custom_css ) ) { wp_add_inline_style( 'global-styles', $custom_css ); } + $block_custom_css .= wp_get_global_styles_block_custom_css(); + + if ( ! empty( $block_custom_css ) ) { + wp_register_style( 'global-styles-block-custom', false ); + wp_add_inline_style( 'global-styles-block-custom', $block_custom_css ); + wp_enqueue_style( 'global-styles-block-custom' ); + } } + /** * Checks if the editor scripts and styles for all registered block types * should be enqueued on the current screen. From 48ce988adf7d285d0049ef0875729687d1110598 Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Mon, 22 Jan 2024 16:48:04 +1100 Subject: [PATCH 04/12] Fix lint error. --- src/wp-includes/class-wp-theme-json.php | 1 - 1 file changed, 1 deletion(-) diff --git a/src/wp-includes/class-wp-theme-json.php b/src/wp-includes/class-wp-theme-json.php index a3fe81439dcbf..04a59690b737c 100644 --- a/src/wp-includes/class-wp-theme-json.php +++ b/src/wp-includes/class-wp-theme-json.php @@ -1236,7 +1236,6 @@ public function get_custom_block_css() { } return $stylesheet; - } /** From be210d60ef4ffec32f872dd159b605e7c4ca2a64 Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Mon, 22 Jan 2024 17:38:10 +1100 Subject: [PATCH 05/12] Fix undefined variable --- src/wp-includes/script-loader.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php index e47427241c6b7..8b30df3d24678 100644 --- a/src/wp-includes/script-loader.php +++ b/src/wp-includes/script-loader.php @@ -2533,7 +2533,7 @@ function wp_enqueue_global_styles_custom_css() { if ( ! empty( $custom_css ) ) { wp_add_inline_style( 'global-styles', $custom_css ); } - $block_custom_css .= wp_get_global_styles_block_custom_css(); + $block_custom_css = wp_get_global_styles_block_custom_css(); if ( ! empty( $block_custom_css ) ) { wp_register_style( 'global-styles-block-custom', false ); From aef490bb2e7a79198c7e365a2a1c4678260de30c Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Wed, 24 Jan 2024 16:27:33 +1100 Subject: [PATCH 06/12] Remove custom CSS changes and address review feedback --- src/wp-includes/class-wp-theme-json.php | 38 -------- src/wp-includes/default-filters.php | 2 + .../global-styles-and-settings.php | 89 ++----------------- src/wp-includes/script-loader.php | 34 +++++-- 4 files changed, 33 insertions(+), 130 deletions(-) diff --git a/src/wp-includes/class-wp-theme-json.php b/src/wp-includes/class-wp-theme-json.php index 04a59690b737c..37f4d11ce9fb4 100644 --- a/src/wp-includes/class-wp-theme-json.php +++ b/src/wp-includes/class-wp-theme-json.php @@ -1200,44 +1200,6 @@ public function get_custom_css() { return $stylesheet; } - /** - * Returns the global styles base custom CSS. - * - * @since 6.5.0 - * - * @return string The global styles base custom CSS. - */ - public function get_custom_base_css() { - return isset( $this->theme_json['styles']['css'] ) ? $this->theme_json['styles']['css'] : ''; - } - - - /** - * Returns the global styles per-block custom CSS. - * - * @since 6.5.0 - * - * @return string The global styles per-block custom CSS. - */ - public function get_custom_block_css() { - $stylesheet = ''; - - // Add the global styles block CSS. - if ( isset( $this->theme_json['styles']['blocks'] ) ) { - foreach ( $this->theme_json['styles']['blocks'] as $name => $node ) { - $custom_block_css = isset( $this->theme_json['styles']['blocks'][ $name ]['css'] ) - ? $this->theme_json['styles']['blocks'][ $name ]['css'] - : null; - if ( $custom_block_css ) { - $selector = static::$blocks_metadata[ $name ]['selector']; - $stylesheet .= $this->process_blocks_custom_css( $custom_block_css, $selector ); - } - } - } - - return $stylesheet; - } - /** * Returns the page templates of the active theme. * diff --git a/src/wp-includes/default-filters.php b/src/wp-includes/default-filters.php index ace1b76df0d02..3b589790f1b84 100644 --- a/src/wp-includes/default-filters.php +++ b/src/wp-includes/default-filters.php @@ -601,6 +601,8 @@ add_action( 'wp_enqueue_scripts', 'wp_add_global_styles_for_blocks' ); +add_action( 'wp_enqueue_scripts', 'wp_enqueue_block_global_styles' ); + // Global styles custom CSS. add_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles_custom_css' ); diff --git a/src/wp-includes/global-styles-and-settings.php b/src/wp-includes/global-styles-and-settings.php index e1b6eb1da3a20..f6c13146f40b7 100644 --- a/src/wp-includes/global-styles-and-settings.php +++ b/src/wp-includes/global-styles-and-settings.php @@ -54,7 +54,7 @@ function wp_get_global_settings( $path = array(), $context = array() ) { * is always fresh from the potential modifications done via hooks * that can use dynamic data (modify the stylesheet depending on some option, * settings depending on user permissions, etc.). - * See some of the existing hooks to modify theme.json behaviour: + * See some of the existing hooks to modify theme.json behavior: * https://make.wordpress.org/core/2022/10/10/filters-for-theme-json-data/ * * A different alternative considered was to invalidate the cache upon certain @@ -294,94 +294,21 @@ function wp_get_global_styles_custom_css() { return $stylesheet; } -/** - * Gets the global styles base custom CSS from theme.json. - * Logic should follow wp_get_global_styles_custom_css. - * - * @since 6.5.0 - * - * @return string The global base custom CSS. - */ -function wp_get_global_styles_base_custom_css() { - if ( ! wp_theme_has_theme_json() ) { - return ''; - } - - $can_use_cached = ! wp_is_development_mode( 'theme' ); - - $cache_key = 'wp_get_global_styles_base_custom_css'; - $cache_group = 'theme_json'; - if ( $can_use_cached ) { - $cached = wp_cache_get( $cache_key, $cache_group ); - if ( $cached ) { - return $cached; - } - } - - $tree = WP_Theme_JSON_Resolver::get_merged_data(); - $stylesheet = $tree->get_custom_base_css(); - - if ( $can_use_cached ) { - wp_cache_set( $cache_key, $stylesheet, $cache_group ); - } - - return $stylesheet; -} - -/** - * Gets the global styles per-block custom CSS from theme.json. - * Logic should follow wp_get_global_styles_custom_css. - * - * @since 6.5.0 - * - * @return string The global per-block custom CSS. - */ -function wp_get_global_styles_block_custom_css() { - if ( ! wp_theme_has_theme_json() ) { - return ''; - } - - $can_use_cached = ! wp_is_development_mode( 'theme' ); - - $cache_key = 'wp_get_global_styles_block_custom_css'; - $cache_group = 'theme_json'; - if ( $can_use_cached ) { - $cached = wp_cache_get( $cache_key, $cache_group ); - if ( $cached ) { - return $cached; - } - } - - $tree = WP_Theme_JSON_Resolver::get_merged_data(); - $stylesheet = $tree->get_custom_block_css(); - - if ( $can_use_cached ) { - wp_cache_set( $cache_key, $stylesheet, $cache_group ); - } - - return $stylesheet; -} - /** * Adds global style rules to the inline style for each block. * * @since 6.1.0 */ function wp_add_global_styles_for_blocks() { - $tree = WP_Theme_JSON_Resolver::get_merged_data(); - $block_nodes = $tree->get_styles_block_nodes(); - if ( ! wp_should_load_separate_core_block_assets() ) { - wp_register_style( 'global-styles-blocks', false ); + return; } + + $tree = WP_Theme_JSON_Resolver::get_merged_data(); + $block_nodes = $tree->get_styles_block_nodes(); foreach ( $block_nodes as $metadata ) { $block_css = $tree->get_styles_for_block( $metadata ); - if ( ! wp_should_load_separate_core_block_assets() ) { - wp_add_inline_style( 'global-styles-blocks', $block_css ); - continue; - } - $stylesheet_handle = 'global-styles'; if ( isset( $metadata['name'] ) ) { /* @@ -408,10 +335,6 @@ function wp_add_global_styles_for_blocks() { } } } - - if ( ! wp_should_load_separate_core_block_assets() ) { - wp_enqueue_style( 'global-styles-blocks' ); - } } /** @@ -507,8 +430,6 @@ function wp_clean_theme_json_cache() { wp_cache_delete( 'wp_get_global_settings_custom', 'theme_json' ); wp_cache_delete( 'wp_get_global_settings_theme', 'theme_json' ); wp_cache_delete( 'wp_get_global_styles_custom_css', 'theme_json' ); - wp_cache_delete( 'wp_get_global_styles_base_custom_css', 'theme_json' ); - wp_cache_delete( 'wp_get_global_styles_block_custom_css', 'theme_json' ); wp_cache_delete( 'wp_get_theme_data_template_parts', 'theme_json' ); WP_Theme_JSON_Resolver::clean_cached_data(); } diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php index 8b30df3d24678..224cd683bcccd 100644 --- a/src/wp-includes/script-loader.php +++ b/src/wp-includes/script-loader.php @@ -2514,6 +2514,31 @@ function wp_enqueue_global_styles() { wp_enqueue_style( 'global-styles' ); } +/** + * Enqueues block global styles when separate core block assets are disabled. + * + * @since 6.5.0 + */ +function wp_enqueue_block_global_styles() { + if ( wp_should_load_separate_core_block_assets() ) { + return; + } + + $tree = WP_Theme_JSON_Resolver::get_merged_data(); + $block_nodes = $tree->get_styles_block_nodes(); + + wp_register_style( 'global-styles-blocks', false ); + + foreach ( $block_nodes as $metadata ) { + $block_css = $tree->get_styles_for_block( $metadata ); + wp_add_inline_style( 'global-styles-blocks', $block_css ); + } + + wp_enqueue_style( 'global-styles-blocks' ); + + wp_enqueue_global_styles(); +} + /** * Enqueues the global styles custom css defined via theme.json. * @@ -2528,18 +2553,11 @@ function wp_enqueue_global_styles_custom_css() { remove_action( 'wp_head', 'wp_custom_css_cb', 101 ); $custom_css = wp_get_custom_css(); - $custom_css .= wp_get_global_styles_base_custom_css(); + $custom_css .= wp_get_global_styles_custom_css(); if ( ! empty( $custom_css ) ) { wp_add_inline_style( 'global-styles', $custom_css ); } - $block_custom_css = wp_get_global_styles_block_custom_css(); - - if ( ! empty( $block_custom_css ) ) { - wp_register_style( 'global-styles-block-custom', false ); - wp_add_inline_style( 'global-styles-block-custom', $block_custom_css ); - wp_enqueue_style( 'global-styles-block-custom' ); - } } From 0a7045a8b79ed9017d3691be1b6aa539da1bc83c Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Wed, 24 Jan 2024 16:33:33 +1100 Subject: [PATCH 07/12] Remove extra spaces --- src/wp-includes/global-styles-and-settings.php | 2 +- src/wp-includes/script-loader.php | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/wp-includes/global-styles-and-settings.php b/src/wp-includes/global-styles-and-settings.php index f6c13146f40b7..f3a5254f58b84 100644 --- a/src/wp-includes/global-styles-and-settings.php +++ b/src/wp-includes/global-styles-and-settings.php @@ -303,7 +303,7 @@ function wp_add_global_styles_for_blocks() { if ( ! wp_should_load_separate_core_block_assets() ) { return; } - + $tree = WP_Theme_JSON_Resolver::get_merged_data(); $block_nodes = $tree->get_styles_block_nodes(); foreach ( $block_nodes as $metadata ) { diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php index 224cd683bcccd..32ab57f584c68 100644 --- a/src/wp-includes/script-loader.php +++ b/src/wp-includes/script-loader.php @@ -2516,7 +2516,7 @@ function wp_enqueue_global_styles() { /** * Enqueues block global styles when separate core block assets are disabled. - * + * * @since 6.5.0 */ function wp_enqueue_block_global_styles() { From bef93115cde2f3e4b5c62d3497a38af98a01e5e7 Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Thu, 25 Jan 2024 17:07:03 +1100 Subject: [PATCH 08/12] Make sure global styles only load in the front end. --- src/wp-includes/script-loader.php | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php index 32ab57f584c68..72a674698f315 100644 --- a/src/wp-includes/script-loader.php +++ b/src/wp-includes/script-loader.php @@ -2478,6 +2478,10 @@ static function ( $node ) { * @since 5.8.0 */ function wp_enqueue_global_styles() { + if ( is_admin() ) { + return; + } + $separate_assets = wp_should_load_separate_core_block_assets(); $is_block_theme = wp_is_block_theme(); $is_classic_theme = ! $is_block_theme; From 90102932d09fd26cb5af79bd052a648ecf4031bf Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Mon, 29 Jan 2024 17:55:46 +1100 Subject: [PATCH 09/12] Remove unnecessary filter and function call. --- src/wp-includes/script-loader.php | 9 --------- 1 file changed, 9 deletions(-) diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php index 72a674698f315..e7caf5188f5f7 100644 --- a/src/wp-includes/script-loader.php +++ b/src/wp-includes/script-loader.php @@ -2500,13 +2500,6 @@ function wp_enqueue_global_styles() { return; } - /* - * If loading the CSS for each block separately, then load the theme.json CSS conditionally. - * This removes the CSS from the global-styles stylesheet and adds it to the inline CSS for each block. - * This filter must be registered before calling wp_get_global_stylesheet(); - */ - add_filter( 'wp_theme_json_get_style_nodes', 'wp_filter_out_block_nodes' ); - $stylesheet = wp_get_global_stylesheet(); if ( empty( $stylesheet ) ) { @@ -2539,8 +2532,6 @@ function wp_enqueue_block_global_styles() { } wp_enqueue_style( 'global-styles-blocks' ); - - wp_enqueue_global_styles(); } /** From 6d050e02abdc8584a305e27d917467432a4f4910 Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Tue, 30 Jan 2024 14:35:33 +1100 Subject: [PATCH 10/12] Split out tests for separate core block assets --- .../theme/wpAddGlobalStylesForBlocks.php | 67 +-------- .../theme/wpEnqueueBlockGlobalStyles.php | 133 ++++++++++++++++++ 2 files changed, 136 insertions(+), 64 deletions(-) create mode 100644 tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php diff --git a/tests/phpunit/tests/theme/wpAddGlobalStylesForBlocks.php b/tests/phpunit/tests/theme/wpAddGlobalStylesForBlocks.php index b009ac7233ceb..34f7d74f89911 100644 --- a/tests/phpunit/tests/theme/wpAddGlobalStylesForBlocks.php +++ b/tests/phpunit/tests/theme/wpAddGlobalStylesForBlocks.php @@ -21,6 +21,7 @@ class Tests_Theme_WpAddGlobalStylesForBlocks extends WP_Theme_UnitTestCase { public function set_up() { parent::set_up(); remove_action( 'wp_print_styles', 'print_emoji_styles' ); + add_filter( 'should_load_separate_core_block_assets', '__return_true' ); } public function tear_down() { @@ -32,6 +33,8 @@ public function tear_down() { $this->test_blocks = array(); } + remove_filter( 'should_load_separate_core_block_assets', '__return_true' ); + parent::tear_down(); } @@ -50,35 +53,11 @@ public function test_third_party_blocks_inline_styles_not_register_to_global_sty ); } - /** - * @ticket 56915 - */ - public function test_third_party_blocks_inline_styles_get_registered_to_global_styles() { - $this->set_up_third_party_block(); - - wp_register_style( 'global-styles', false, array(), true, true ); - - $this->assertNotContains( - '.wp-block-my-third-party-block{background-color: hotpink;}', - $this->get_global_styles(), - 'Third party block inline style should not be registered before running wp_add_global_styles_for_blocks()' - ); - - wp_add_global_styles_for_blocks(); - - $this->assertContains( - '.wp-block-my-third-party-block{background-color: hotpink;}', - $this->get_global_styles(), - 'Third party block inline style should be registered after running wp_add_global_styles_for_blocks()' - ); - } - /** * @ticket 56915 */ public function test_third_party_blocks_inline_styles_get_registered_to_global_styles_when_per_block() { $this->set_up_third_party_block(); - add_filter( 'should_load_separate_core_block_assets', '__return_true' ); wp_register_style( 'global-styles', false, array(), true, true ); @@ -102,7 +81,6 @@ public function test_third_party_blocks_inline_styles_get_registered_to_global_s */ public function test_third_party_blocks_inline_styles_get_rendered_when_per_block() { $this->set_up_third_party_block(); - add_filter( 'should_load_separate_core_block_assets', '__return_true' ); wp_register_style( 'global-styles', false, array(), true, true ); wp_enqueue_style( 'global-styles' ); @@ -122,34 +100,11 @@ public function test_third_party_blocks_inline_styles_get_rendered_when_per_bloc ); } - /** - * @ticket 56915 - */ - public function test_blocks_inline_styles_get_rendered() { - wp_register_style( 'global-styles', false, array(), true, true ); - wp_enqueue_style( 'global-styles' ); - wp_add_global_styles_for_blocks(); - - $actual = get_echo( 'wp_print_styles' ); - - $this->assertStringContainsString( - '.wp-block-my-third-party-block{background-color: hotpink;}', - $actual, - 'Third party block inline style should render' - ); - $this->assertStringContainsString( - '.wp-block-post-featured-image', - $actual, - 'Core block should render' - ); - } - /** * @ticket 57868 */ public function test_third_party_blocks_inline_styles_for_elements_get_rendered_when_per_block() { $this->set_up_third_party_block(); - add_filter( 'should_load_separate_core_block_assets', '__return_true' ); wp_register_style( 'global-styles', false, array(), true, true ); wp_enqueue_style( 'global-styles' ); @@ -163,22 +118,6 @@ public function test_third_party_blocks_inline_styles_for_elements_get_rendered_ ); } - /** - * @ticket 57868 - */ - public function test_third_party_blocks_inline_styles_for_elements_get_rendered() { - wp_register_style( 'global-styles', false, array(), true, true ); - wp_enqueue_style( 'global-styles' ); - wp_add_global_styles_for_blocks(); - - $actual = get_echo( 'wp_print_styles' ); - - $this->assertStringContainsString( - '.wp-block-my-third-party-block cite{color: white;}', - $actual - ); - } - /** * @ticket 57868 * diff --git a/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php b/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php new file mode 100644 index 0000000000000..9f0604113cb2b --- /dev/null +++ b/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php @@ -0,0 +1,133 @@ +test_blocks ) ) { + foreach ( $this->test_blocks as $test_block ) { + unregister_block_type( $test_block ); + } + $this->test_blocks = array(); + } + + parent::tear_down(); + } + + /** + * @ticket 56915 + * @ticket 60280 + */ + public function test_third_party_blocks_inline_styles_not_register_to_global_styles() { + switch_theme( 'block-theme' ); + + wp_enqueue_block_global_styles(); + + $this->assertNotContains( + '.wp-block-my-third-party-block{background-color: hotpink;}', + $this->get_global_styles_blocks() + ); + } + + /** + * @ticket 56915 + * @ticket 60280 + */ + public function test_third_party_blocks_inline_styles_get_registered_to_global_styles() { + $this->set_up_third_party_block(); + + + $this->assertNotContains( + '.wp-block-my-third-party-block{background-color: hotpink;}', + $this->get_global_styles_blocks(), + 'Third party block inline style should not be registered before running wp_enqueue_block_global_styles()' + ); + + wp_enqueue_block_global_styles(); + + $this->assertContains( + '.wp-block-my-third-party-block{background-color: hotpink;}', + $this->get_global_styles_blocks(), + 'Third party block inline style should be registered after running wp_enqueue_block_global_styles()' + ); + + } + + /** + * @ticket 56915 + * @ticket 60280 + */ + public function test_blocks_inline_styles_get_rendered() { + wp_enqueue_block_global_styles(); + + $actual = get_echo( 'wp_print_styles' ); + + $this->assertStringContainsString( + '.wp-block-my-third-party-block{background-color: hotpink;}', + $actual, + 'Third party block inline style should render' + ); + $this->assertStringContainsString( + '.wp-block-post-featured-image', + $actual, + 'Core block should render' + ); + } + + /** + * @ticket 57868 + * @ticket 60280 + */ + public function test_third_party_blocks_inline_styles_for_elements_get_rendered() { + wp_enqueue_block_global_styles(); + + $actual = get_echo( 'wp_print_styles' ); + + $this->assertStringContainsString( + '.wp-block-my-third-party-block cite{color: white;}', + $actual + ); + } + + + private function set_up_third_party_block() { + switch_theme( 'block-theme' ); + + $name = 'my/third-party-block'; + $settings = array( + 'icon' => 'text', + 'category' => 'common', + 'render_callback' => 'foo', + ); + register_block_type( $name, $settings ); + + $this->test_blocks[] = $name; + } + + private function get_global_styles_blocks() { + $actual = wp_styles()->get_data( 'global-styles-blocks', 'after' ); + return is_array( $actual ) ? $actual : array(); + } +} \ No newline at end of file From ca1698e28c4151263ce1f205c27c08d44360104f Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Tue, 30 Jan 2024 15:07:59 +1100 Subject: [PATCH 11/12] remove redundant test --- .../tests/theme/wpEnqueueBlockGlobalStyles.php | 15 --------------- 1 file changed, 15 deletions(-) diff --git a/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php b/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php index 9f0604113cb2b..efadbcb69c16f 100644 --- a/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php +++ b/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php @@ -36,21 +36,6 @@ public function tear_down() { parent::tear_down(); } - /** - * @ticket 56915 - * @ticket 60280 - */ - public function test_third_party_blocks_inline_styles_not_register_to_global_styles() { - switch_theme( 'block-theme' ); - - wp_enqueue_block_global_styles(); - - $this->assertNotContains( - '.wp-block-my-third-party-block{background-color: hotpink;}', - $this->get_global_styles_blocks() - ); - } - /** * @ticket 56915 * @ticket 60280 From 1226e21439fcb8433a8ecddc389a0a752b5a74fd Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Wed, 31 Jan 2024 14:32:27 +1100 Subject: [PATCH 12/12] Fix spacing --- .../theme/wpEnqueueBlockGlobalStyles.php | 118 +++++++++--------- 1 file changed, 58 insertions(+), 60 deletions(-) diff --git a/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php b/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php index efadbcb69c16f..3d05ef721a2e2 100644 --- a/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php +++ b/tests/phpunit/tests/theme/wpEnqueueBlockGlobalStyles.php @@ -11,58 +11,56 @@ */ class Tests_Theme_WpEnqueueBlockGlobalStyles extends WP_Theme_UnitTestCase { - - /** - * Test blocks to unregister at cleanup. - * - * @var array - */ - private $test_blocks = array(); - - public function set_up() { - parent::set_up(); - remove_action( 'wp_print_styles', 'print_emoji_styles' ); - } - - public function tear_down() { - // Unregister test blocks. - if ( ! empty( $this->test_blocks ) ) { - foreach ( $this->test_blocks as $test_block ) { - unregister_block_type( $test_block ); - } - $this->test_blocks = array(); - } - - parent::tear_down(); - } - - /** - * @ticket 56915 - * @ticket 60280 - */ - public function test_third_party_blocks_inline_styles_get_registered_to_global_styles() { - $this->set_up_third_party_block(); - - - $this->assertNotContains( - '.wp-block-my-third-party-block{background-color: hotpink;}', - $this->get_global_styles_blocks(), - 'Third party block inline style should not be registered before running wp_enqueue_block_global_styles()' - ); - - wp_enqueue_block_global_styles(); - - $this->assertContains( - '.wp-block-my-third-party-block{background-color: hotpink;}', - $this->get_global_styles_blocks(), - 'Third party block inline style should be registered after running wp_enqueue_block_global_styles()' - ); - - } - - /** + + /** + * Test blocks to unregister at cleanup. + * + * @var array + */ + private $test_blocks = array(); + + public function set_up() { + parent::set_up(); + remove_action( 'wp_print_styles', 'print_emoji_styles' ); + } + + public function tear_down() { + // Unregister test blocks. + if ( ! empty( $this->test_blocks ) ) { + foreach ( $this->test_blocks as $test_block ) { + unregister_block_type( $test_block ); + } + $this->test_blocks = array(); + } + + parent::tear_down(); + } + + /** * @ticket 56915 - * @ticket 60280 + * @ticket 60280 + */ + public function test_third_party_blocks_inline_styles_get_registered_to_global_styles() { + $this->set_up_third_party_block(); + + $this->assertNotContains( + '.wp-block-my-third-party-block{background-color: hotpink;}', + $this->get_global_styles_blocks(), + 'Third party block inline style should not be registered before running wp_enqueue_block_global_styles()' + ); + + wp_enqueue_block_global_styles(); + + $this->assertContains( + '.wp-block-my-third-party-block{background-color: hotpink;}', + $this->get_global_styles_blocks(), + 'Third party block inline style should be registered after running wp_enqueue_block_global_styles()' + ); + } + + /** + * @ticket 56915 + * @ticket 60280 */ public function test_blocks_inline_styles_get_rendered() { wp_enqueue_block_global_styles(); @@ -81,12 +79,12 @@ public function test_blocks_inline_styles_get_rendered() { ); } - /** + /** * @ticket 57868 - * @ticket 60280 + * @ticket 60280 */ public function test_third_party_blocks_inline_styles_for_elements_get_rendered() { - wp_enqueue_block_global_styles(); + wp_enqueue_block_global_styles(); $actual = get_echo( 'wp_print_styles' ); @@ -97,7 +95,7 @@ public function test_third_party_blocks_inline_styles_for_elements_get_rendered( } - private function set_up_third_party_block() { + private function set_up_third_party_block() { switch_theme( 'block-theme' ); $name = 'my/third-party-block'; @@ -111,8 +109,8 @@ private function set_up_third_party_block() { $this->test_blocks[] = $name; } - private function get_global_styles_blocks() { - $actual = wp_styles()->get_data( 'global-styles-blocks', 'after' ); - return is_array( $actual ) ? $actual : array(); - } -} \ No newline at end of file + private function get_global_styles_blocks() { + $actual = wp_styles()->get_data( 'global-styles-blocks', 'after' ); + return is_array( $actual ) ? $actual : array(); + } +}