From 864cd6c6e71adf14a4f744d9f5cda03a185e46aa Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= <583546+oandregal@users.noreply.github.com> Date: Fri, 11 Feb 2022 16:50:55 +0100 Subject: [PATCH 1/8] Layout block styles: fix enqueuing logic --- lib/block-supports/layout.php | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/lib/block-supports/layout.php b/lib/block-supports/layout.php index e96b5822989360..dfcfc5b0b56277 100644 --- a/lib/block-supports/layout.php +++ b/lib/block-supports/layout.php @@ -166,11 +166,21 @@ function gutenberg_render_layout_support_flag( $block_content, $block ) { 1 ); - // Ideally styles should be loaded in the head, but blocks may be parsed - // after that, so loading in the footer for now. + // Styles should be loaded in the head for block themes + // and classic themes by default. + // + // Only for classic themes that opt into loading separate block assets + // we should load the styles in the body. + // // See https://core.trac.wordpress.org/ticket/53494. + $separate_assets = wp_should_load_separate_core_block_assets(); + $is_classic_theme = ! wp_is_block_theme(); + $action_hook_name = 'wp_enqueue_scripts'; + if ( $is_classic_theme && $separate_assets ) { + $action_hook_name = 'wp_footer'; + } add_action( - 'wp_footer', + $action_hook_name, function () use ( $style ) { echo ''; } From 431c97986829d2d259f4bb5551bc335ed82e7221 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= <583546+oandregal@users.noreply.github.com> Date: Fri, 11 Feb 2022 17:37:00 +0100 Subject: [PATCH 2/8] Element block styles: fix enqueuing logic --- lib/block-supports/elements.php | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/lib/block-supports/elements.php b/lib/block-supports/elements.php index f3b7891f107d60..e431423e2111c3 100644 --- a/lib/block-supports/elements.php +++ b/lib/block-supports/elements.php @@ -65,11 +65,21 @@ function gutenberg_render_elements_support( $block_content, $block ) { $content = substr_replace( $block_content, ' class="' . $class_name . '"', $first_element_offset + strlen( $first_element ) - 1, 0 ); } - // Ideally styles should be loaded in the head, but blocks may be parsed - // after that, so loading in the footer for now. + // Styles should be loaded in the head for block themes + // and classic themes by default. + // + // Only for classic themes that opt into loading separate block assets + // we should load the styles in the body. + // // See https://core.trac.wordpress.org/ticket/53494. + $separate_assets = wp_should_load_separate_core_block_assets(); + $is_classic_theme = ! wp_is_block_theme(); + $action_hook_name = 'wp_enqueue_scripts'; + if ( $is_classic_theme && $separate_assets ) { + $action_hook_name = 'wp_footer'; + } add_action( - 'wp_footer', + $action_hook_name, function () use ( $style ) { echo $style; } From 07d321a189fb0d27f09767e347080b3dc853ef8b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= <583546+oandregal@users.noreply.github.com> Date: Fri, 11 Feb 2022 18:34:12 +0100 Subject: [PATCH 3/8] Fix linting issues --- lib/block-supports/layout.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/block-supports/layout.php b/lib/block-supports/layout.php index dfcfc5b0b56277..bbc249bc2f4d19 100644 --- a/lib/block-supports/layout.php +++ b/lib/block-supports/layout.php @@ -176,7 +176,7 @@ function gutenberg_render_layout_support_flag( $block_content, $block ) { $separate_assets = wp_should_load_separate_core_block_assets(); $is_classic_theme = ! wp_is_block_theme(); $action_hook_name = 'wp_enqueue_scripts'; - if ( $is_classic_theme && $separate_assets ) { + if ( $is_classic_theme && $separate_assets ) { $action_hook_name = 'wp_footer'; } add_action( From 8cbc00ecf49d632428d01003edb96f344e3526c0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= <583546+oandregal@users.noreply.github.com> Date: Wed, 16 Feb 2022 10:19:25 +0100 Subject: [PATCH 4/8] Extract to wp_enqueue_block_support --- lib/block-supports/elements.php | 20 +------------- lib/block-supports/layout.php | 22 ++-------------- .../wp-enqueue-block-support.php | 26 +++++++++++++++++++ lib/load.php | 1 + 4 files changed, 30 insertions(+), 39 deletions(-) create mode 100644 lib/compat/wordpress-5.9/wp-enqueue-block-support.php diff --git a/lib/block-supports/elements.php b/lib/block-supports/elements.php index e431423e2111c3..9829bd6495a27f 100644 --- a/lib/block-supports/elements.php +++ b/lib/block-supports/elements.php @@ -65,25 +65,7 @@ function gutenberg_render_elements_support( $block_content, $block ) { $content = substr_replace( $block_content, ' class="' . $class_name . '"', $first_element_offset + strlen( $first_element ) - 1, 0 ); } - // Styles should be loaded in the head for block themes - // and classic themes by default. - // - // Only for classic themes that opt into loading separate block assets - // we should load the styles in the body. - // - // See https://core.trac.wordpress.org/ticket/53494. - $separate_assets = wp_should_load_separate_core_block_assets(); - $is_classic_theme = ! wp_is_block_theme(); - $action_hook_name = 'wp_enqueue_scripts'; - if ( $is_classic_theme && $separate_assets ) { - $action_hook_name = 'wp_footer'; - } - add_action( - $action_hook_name, - function () use ( $style ) { - echo $style; - } - ); + wp_enqueue_block_support( $style ); return $content; } diff --git a/lib/block-supports/layout.php b/lib/block-supports/layout.php index bbc249bc2f4d19..c7703886c99b94 100644 --- a/lib/block-supports/layout.php +++ b/lib/block-supports/layout.php @@ -156,7 +156,7 @@ function gutenberg_render_layout_support_flag( $block_content, $block ) { // Regex for CSS value borrowed from `safecss_filter_attr`, and used here // because we only want to match against the value, not the CSS attribute. $gap_value = preg_match( '%[\\\(&=}]|/\*%', $gap_value ) ? null : $gap_value; - $style = gutenberg_get_layout_style( ".wp-container-$id", $used_layout, $has_block_gap_support, $gap_value ); + $style = ''; // This assumes the hook only applies to blocks with a single wrapper. // I think this is a reasonable limitation for that particular hook. $content = preg_replace( @@ -166,25 +166,7 @@ function gutenberg_render_layout_support_flag( $block_content, $block ) { 1 ); - // Styles should be loaded in the head for block themes - // and classic themes by default. - // - // Only for classic themes that opt into loading separate block assets - // we should load the styles in the body. - // - // See https://core.trac.wordpress.org/ticket/53494. - $separate_assets = wp_should_load_separate_core_block_assets(); - $is_classic_theme = ! wp_is_block_theme(); - $action_hook_name = 'wp_enqueue_scripts'; - if ( $is_classic_theme && $separate_assets ) { - $action_hook_name = 'wp_footer'; - } - add_action( - $action_hook_name, - function () use ( $style ) { - echo ''; - } - ); + wp_enqueue_block_support( $style ); return $content; } diff --git a/lib/compat/wordpress-5.9/wp-enqueue-block-support.php b/lib/compat/wordpress-5.9/wp-enqueue-block-support.php new file mode 100644 index 00000000000000..eb777ea7b44fe9 --- /dev/null +++ b/lib/compat/wordpress-5.9/wp-enqueue-block-support.php @@ -0,0 +1,26 @@ + Date: Wed, 16 Feb 2022 10:29:18 +0100 Subject: [PATCH 5/8] Fix lint issues --- lib/compat/wordpress-5.9/wp-enqueue-block-support.php | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/lib/compat/wordpress-5.9/wp-enqueue-block-support.php b/lib/compat/wordpress-5.9/wp-enqueue-block-support.php index eb777ea7b44fe9..5cba7a4e021497 100644 --- a/lib/compat/wordpress-5.9/wp-enqueue-block-support.php +++ b/lib/compat/wordpress-5.9/wp-enqueue-block-support.php @@ -1,4 +1,9 @@ or . */ function wp_enqueue_block_support( $style ) { $action_hook_name = 'wp_footer'; @@ -23,4 +30,4 @@ function () use ( $style ) { } ); } -} \ No newline at end of file +} From 37dcaa34088ec3cfa51a6d1e05e8c78bdb937d5b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= <583546+oandregal@users.noreply.github.com> Date: Wed, 16 Feb 2022 11:45:31 +0100 Subject: [PATCH 6/8] Move function to blocks.php --- lib/block-supports/elements.php | 2 +- lib/block-supports/layout.php | 2 +- lib/blocks.php | 24 ++++++++++++++ .../wp-enqueue-block-support.php | 33 ------------------- lib/load.php | 1 - 5 files changed, 26 insertions(+), 36 deletions(-) delete mode 100644 lib/compat/wordpress-5.9/wp-enqueue-block-support.php diff --git a/lib/block-supports/elements.php b/lib/block-supports/elements.php index 9829bd6495a27f..2061fd6e0ed8a0 100644 --- a/lib/block-supports/elements.php +++ b/lib/block-supports/elements.php @@ -65,7 +65,7 @@ function gutenberg_render_elements_support( $block_content, $block ) { $content = substr_replace( $block_content, ' class="' . $class_name . '"', $first_element_offset + strlen( $first_element ) - 1, 0 ); } - wp_enqueue_block_support( $style ); + gutenberg_enqueue_block_support( $style ); return $content; } diff --git a/lib/block-supports/layout.php b/lib/block-supports/layout.php index c7703886c99b94..16e45efb1851df 100644 --- a/lib/block-supports/layout.php +++ b/lib/block-supports/layout.php @@ -166,7 +166,7 @@ function gutenberg_render_layout_support_flag( $block_content, $block ) { 1 ); - wp_enqueue_block_support( $style ); + gutenberg_enqueue_block_support( $style ); return $content; } diff --git a/lib/blocks.php b/lib/blocks.php index 8a61b1ff8a4a48..397e524e3530d5 100644 --- a/lib/blocks.php +++ b/lib/blocks.php @@ -590,3 +590,27 @@ function gutenberg_multiple_block_styles( $metadata ) { return $metadata; } add_filter( 'block_type_metadata', 'gutenberg_multiple_block_styles' ); + +/** + * Styles should be loaded in the head for block themes. + * + * For classic ones we need to enqueue them to the body + * because the wp_head action (and wp_enqueue_scripts) + * happens before the render_block. + * + * See https://core.trac.wordpress.org/ticket/53494. + * + * @param string $style HTML content to load in the or . + */ +function gutenberg_enqueue_block_support( $style ) { + $action_hook_name = 'wp_footer'; + if ( wp_is_block_theme() ) { + $action_hook_name = 'wp_enqueue_scripts'; + } + add_action( + $action_hook_name, + function () use ( $style ) { + echo $style; + } + ); +} diff --git a/lib/compat/wordpress-5.9/wp-enqueue-block-support.php b/lib/compat/wordpress-5.9/wp-enqueue-block-support.php deleted file mode 100644 index 5cba7a4e021497..00000000000000 --- a/lib/compat/wordpress-5.9/wp-enqueue-block-support.php +++ /dev/null @@ -1,33 +0,0 @@ - or . - */ - function wp_enqueue_block_support( $style ) { - $action_hook_name = 'wp_footer'; - if ( wp_is_block_theme() ) { - $action_hook_name = 'wp_enqueue_scripts'; - } - - add_action( - $action_hook_name, - function () use ( $style ) { - echo $style; - } - ); - } -} diff --git a/lib/load.php b/lib/load.php index 1e06f4819807e0..8c309c2848b543 100644 --- a/lib/load.php +++ b/lib/load.php @@ -116,7 +116,6 @@ function gutenberg_is_experiment_enabled( $name ) { require __DIR__ . '/global-styles.php'; require __DIR__ . '/pwa.php'; -require __DIR__ . '/compat/wordpress-5.9/wp-enqueue-block-support.php'; require __DIR__ . '/block-supports/elements.php'; require __DIR__ . '/block-supports/colors.php'; require __DIR__ . '/block-supports/typography.php'; From 3ed7cd07e6cf9211745d012f7cad43d8c9a00853 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= <583546+oandregal@users.noreply.github.com> Date: Wed, 16 Feb 2022 12:41:38 +0100 Subject: [PATCH 7/8] Do not require consumers to pass the \n"; + $style = ".$class_name a{" . $link_color_declaration . ';}'; // Like the layout hook this assumes the hook only applies to blocks with a single wrapper. // Retrieve the opening tag of the first HTML element. diff --git a/lib/block-supports/layout.php b/lib/block-supports/layout.php index 16e45efb1851df..867df818c5828b 100644 --- a/lib/block-supports/layout.php +++ b/lib/block-supports/layout.php @@ -156,7 +156,7 @@ function gutenberg_render_layout_support_flag( $block_content, $block ) { // Regex for CSS value borrowed from `safecss_filter_attr`, and used here // because we only want to match against the value, not the CSS attribute. $gap_value = preg_match( '%[\\\(&=}]|/\*%', $gap_value ) ? null : $gap_value; - $style = ''; + $style = gutenberg_get_layout_style( ".wp-container-$id", $used_layout, $has_block_gap_support, $gap_value ); // This assumes the hook only applies to blocks with a single wrapper. // I think this is a reasonable limitation for that particular hook. $content = preg_replace( diff --git a/lib/blocks.php b/lib/blocks.php index 397e524e3530d5..1fa7bfef9abf4e 100644 --- a/lib/blocks.php +++ b/lib/blocks.php @@ -610,7 +610,7 @@ function gutenberg_enqueue_block_support( $style ) { add_action( $action_hook_name, function () use ( $style ) { - echo $style; + echo "\n"; } ); } From c43b9353e0a9f7a0d611522945e01f6dfe7fd312 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= <583546+oandregal@users.noreply.github.com> Date: Wed, 16 Feb 2022 12:49:45 +0100 Subject: [PATCH 8/8] Update comment --- lib/blocks.php | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/lib/blocks.php b/lib/blocks.php index 1fa7bfef9abf4e..a9289f1cd9616a 100644 --- a/lib/blocks.php +++ b/lib/blocks.php @@ -592,15 +592,17 @@ function gutenberg_multiple_block_styles( $metadata ) { add_filter( 'block_type_metadata', 'gutenberg_multiple_block_styles' ); /** - * Styles should be loaded in the head for block themes. + * This function takes care of adding inline styles + * in the proper place, depending on the theme in use. * - * For classic ones we need to enqueue them to the body + * For block themes, it's loaded in the head. + * For classic ones, it's loaded in the body * because the wp_head action (and wp_enqueue_scripts) * happens before the render_block. * * See https://core.trac.wordpress.org/ticket/53494. * - * @param string $style HTML content to load in the or . + * @param string $style String containing the CSS styles to be added. */ function gutenberg_enqueue_block_support( $style ) { $action_hook_name = 'wp_footer';