From 51fbbd4be63fda0d6c014903383533c47c1d678d Mon Sep 17 00:00:00 2001 From: Fabian Todt Date: Thu, 19 Oct 2023 16:42:56 +0200 Subject: [PATCH 1/4] add viewStyle property for block metadata --- src/wp-includes/blocks.php | 3 ++ src/wp-includes/class-wp-block-type.php | 10 ++++++ src/wp-includes/class-wp-block.php | 6 ++++ .../class-wp-rest-block-types-controller.php | 11 +++++++ .../phpunit/data/blocks/notice/block-view.css | 1 + tests/phpunit/data/blocks/notice/block.json | 1 + tests/phpunit/tests/blocks/register.php | 33 +++++++++++++++++-- 7 files changed, 62 insertions(+), 3 deletions(-) create mode 100644 tests/phpunit/data/blocks/notice/block-view.css diff --git a/src/wp-includes/blocks.php b/src/wp-includes/blocks.php index 01cc2070ac779..8f297029eea99 100644 --- a/src/wp-includes/blocks.php +++ b/src/wp-includes/blocks.php @@ -64,6 +64,7 @@ function generate_block_asset_handle( $block_name, $field_name, $index = 0 ) { 'viewScript' => 'view-script', 'editorStyle' => 'editor-style', 'style' => 'style', + 'viewStyle' => 'view-style', ); $asset_handle = str_replace( '/', '-', $block_name ) . '-' . $field_mappings[ $field_name ]; @@ -326,6 +327,7 @@ function get_block_metadata_i18n_schema() { * @since 6.1.0 Added support for `render` field. * @since 6.3.0 Added `selectors` field. * @since 6.4.0 Added support for `blockHooks` field. + * @since 6.x.x Added support for `viewStyle` field. * * @param string $file_or_folder Path to the JSON file with metadata definition for * the block or path to the folder where the `block.json` file is located. @@ -468,6 +470,7 @@ function register_block_type_from_metadata( $file_or_folder, $args = array() ) { $style_fields = array( 'editorStyle' => 'editor_style_handles', 'style' => 'style_handles', + 'viewStyle' => 'view_style_handles', ); foreach ( $style_fields as $metadata_field_name => $settings_field_name ) { if ( ! empty( $metadata[ $metadata_field_name ] ) ) { diff --git a/src/wp-includes/class-wp-block-type.php b/src/wp-includes/class-wp-block-type.php index b8ffb92e559b2..1d2fda115ec05 100644 --- a/src/wp-includes/class-wp-block-type.php +++ b/src/wp-includes/class-wp-block-type.php @@ -225,6 +225,14 @@ class WP_Block_Type { */ public $style_handles = array(); + /** + * Block type front end only style handles. + * + * @since 6.x.x + * @var string[] + */ + public $view_style_handles = array(); + /** * Deprecated block type properties for script and style handles. * @@ -267,6 +275,7 @@ class WP_Block_Type { * Deprecated the `editor_script`, `script`, `view_script`, `editor_style`, and `style` properties. * @since 6.3.0 Added the `selectors` property. * @since 6.4.0 Added the `block_hooks` property. + * @since 6.x.x Added the `view_style_handles` property. * * @see register_block_type() * @@ -303,6 +312,7 @@ class WP_Block_Type { * @type string[] $view_script_handles Block type front end only script handles. * @type string[] $editor_style_handles Block type editor only style handles. * @type string[] $style_handles Block type front end and editor style handles. + * @type string[] $view_style_handles Block type front end only style handles. * } */ public function __construct( $block_type, $args = array() ) { diff --git a/src/wp-includes/class-wp-block.php b/src/wp-includes/class-wp-block.php index 65d3af6a12f1a..f7bf912f42bf9 100644 --- a/src/wp-includes/class-wp-block.php +++ b/src/wp-includes/class-wp-block.php @@ -280,6 +280,12 @@ public function render( $options = array() ) { } } + if ( ( ! empty( $this->block_type->view_style_handles ) ) ) { + foreach ( $this->block_type->view_style_handles as $view_style_handle ) { + wp_enqueue_style( $view_style_handle ); + } + } + /** * Filters the content of a single block. * diff --git a/src/wp-includes/rest-api/endpoints/class-wp-rest-block-types-controller.php b/src/wp-includes/rest-api/endpoints/class-wp-rest-block-types-controller.php index 852143d96ec35..7c0e0c54bf8cc 100644 --- a/src/wp-includes/rest-api/endpoints/class-wp-rest-block-types-controller.php +++ b/src/wp-includes/rest-api/endpoints/class-wp-rest-block-types-controller.php @@ -292,6 +292,7 @@ public function prepare_item_for_response( $item, $request ) { 'view_script_handles', 'editor_style_handles', 'style_handles', + 'view_style_handles', 'variations', 'block_hooks', ), @@ -602,6 +603,16 @@ public function get_item_schema() { 'context' => array( 'embed', 'view', 'edit' ), 'readonly' => true, ), + 'view_style_handles' => array( + 'description' => __( 'Public facing style handles.' ), + 'type' => array( 'array' ), + 'default' => array(), + 'items' => array( + 'type' => 'string', + ), + 'context' => array( 'embed', 'view', 'edit' ), + 'readonly' => true, + ), 'styles' => array( 'description' => __( 'Block style variations.' ), 'type' => 'array', diff --git a/tests/phpunit/data/blocks/notice/block-view.css b/tests/phpunit/data/blocks/notice/block-view.css new file mode 100644 index 0000000000000..5aefdf30e0c95 --- /dev/null +++ b/tests/phpunit/data/blocks/notice/block-view.css @@ -0,0 +1 @@ +/* Test front end only CSS file */ \ No newline at end of file diff --git a/tests/phpunit/data/blocks/notice/block.json b/tests/phpunit/data/blocks/notice/block.json index 909137252a1bc..8683f734574d4 100644 --- a/tests/phpunit/data/blocks/notice/block.json +++ b/tests/phpunit/data/blocks/notice/block.json @@ -69,5 +69,6 @@ "viewScript": [ "tests-notice-view-script", "tests-notice-view-script-2" ], "editorStyle": "tests-notice-editor-style", "style": [ "tests-notice-style", "tests-notice-style-2" ], + "viewStyle": [ "tests-notice-view-style" ], "render": "file:./render.php" } diff --git a/tests/phpunit/tests/blocks/register.php b/tests/phpunit/tests/blocks/register.php index 3e55206037e40..b438367ba4efe 100644 --- a/tests/phpunit/tests/blocks/register.php +++ b/tests/phpunit/tests/blocks/register.php @@ -156,6 +156,11 @@ public function test_generate_block_asset_handle() { 'unit-tests-my-block-style', generate_block_asset_handle( $block_name, 'style' ) ); + // @ticket 59673 + $this->assertSame( + 'unit-tests-my-block-view-style', + generate_block_asset_handle( $block_name, 'viewStyle' ) + ); } /** @@ -439,9 +444,10 @@ public function test_handles_passed_register_block_style_handles() { */ public function test_success_register_block_style_handle() { $metadata = array( - 'file' => DIR_TESTDATA . '/blocks/notice/block.json', - 'name' => 'unit-tests/test-block', - 'style' => 'file:./block.css', + 'file' => DIR_TESTDATA . '/blocks/notice/block.json', + 'name' => 'unit-tests/test-block', + 'style' => 'file:./block.css', + 'viewStyle' => 'file:./block-view.css', ); $result = register_block_style_handle( $metadata, 'style' ); @@ -454,6 +460,16 @@ public function test_success_register_block_style_handle() { wp_normalize_path( wp_styles()->get_data( 'unit-tests-test-block-style', 'path' ) ) ); + // Test viewStyle property + $result = register_block_style_handle( $metadata, 'viewStyle' ); + $this->assertSame( 'unit-tests-test-block-view-style', $result ); + + // @ticket 59673 + $this->assertSame( + wp_normalize_path( realpath( DIR_TESTDATA . '/blocks/notice/block-view.css' ) ), + wp_normalize_path( wp_styles()->get_data( 'unit-tests-test-block-view-style', 'path' ) ) + ); + // Test the behavior directly within the unit test $this->assertFalse( strpos( @@ -715,6 +731,11 @@ public function test_block_registers_with_metadata_fixture() { array( 'tests-notice-style', 'tests-notice-style-2' ), $result->style_handles ); + // @ticket 59673 + $this->assertSameSets( + array( 'tests-notice-view-style' ), + $result->view_style_handles + ); // @ticket 50328 $this->assertSame( @@ -722,6 +743,12 @@ public function test_block_registers_with_metadata_fixture() { wp_normalize_path( wp_styles()->get_data( 'unit-tests-test-block-style', 'path' ) ) ); + // @ticket 59673 + $this->assertSame( + wp_normalize_path( realpath( DIR_TESTDATA . '/blocks/notice/block-view.css' ) ), + wp_normalize_path( wp_styles()->get_data( 'unit-tests-test-block-view-style', 'path' ) ) + ); + // @ticket 53148 $this->assertIsCallable( $result->render_callback ); } From df8a60dfcb07a2ac1e96c277abbd715beef1b3d5 Mon Sep 17 00:00:00 2001 From: Fabian Todt Date: Thu, 19 Oct 2023 17:29:45 +0200 Subject: [PATCH 2/4] fix unit tests --- tests/phpunit/tests/blocks/register.php | 12 ++++++++---- .../tests/rest-api/rest-block-type-controller.php | 3 ++- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/tests/phpunit/tests/blocks/register.php b/tests/phpunit/tests/blocks/register.php index b438367ba4efe..59608aa42a125 100644 --- a/tests/phpunit/tests/blocks/register.php +++ b/tests/phpunit/tests/blocks/register.php @@ -159,7 +159,8 @@ public function test_generate_block_asset_handle() { // @ticket 59673 $this->assertSame( 'unit-tests-my-block-view-style', - generate_block_asset_handle( $block_name, 'viewStyle' ) + generate_block_asset_handle( $block_name, 'viewStyle' ), + 'asset handle for viewStyle is not generated correctly' ); } @@ -467,7 +468,8 @@ public function test_success_register_block_style_handle() { // @ticket 59673 $this->assertSame( wp_normalize_path( realpath( DIR_TESTDATA . '/blocks/notice/block-view.css' ) ), - wp_normalize_path( wp_styles()->get_data( 'unit-tests-test-block-view-style', 'path' ) ) + wp_normalize_path( wp_styles()->get_data( 'unit-tests-test-block-view-style', 'path' ) ), + 'viewStyle asset path is not correct' ); // Test the behavior directly within the unit test @@ -734,7 +736,8 @@ public function test_block_registers_with_metadata_fixture() { // @ticket 59673 $this->assertSameSets( array( 'tests-notice-view-style' ), - $result->view_style_handles + $result->view_style_handles, + 'parsed view_style_handles is not correct' ); // @ticket 50328 @@ -746,7 +749,8 @@ public function test_block_registers_with_metadata_fixture() { // @ticket 59673 $this->assertSame( wp_normalize_path( realpath( DIR_TESTDATA . '/blocks/notice/block-view.css' ) ), - wp_normalize_path( wp_styles()->get_data( 'unit-tests-test-block-view-style', 'path' ) ) + wp_normalize_path( wp_styles()->get_data( 'unit-tests-test-block-view-style', 'path' ) ), + 'viewStyle asset path is not correct' ); // @ticket 53148 diff --git a/tests/phpunit/tests/rest-api/rest-block-type-controller.php b/tests/phpunit/tests/rest-api/rest-block-type-controller.php index 2745b61195863..68a255476b9e6 100644 --- a/tests/phpunit/tests/rest-api/rest-block-type-controller.php +++ b/tests/phpunit/tests/rest-api/rest-block-type-controller.php @@ -553,7 +553,7 @@ public function test_get_item_schema() { $response = rest_get_server()->dispatch( $request ); $data = $response->get_data(); $properties = $data['schema']['properties']; - $this->assertCount( 30, $properties ); + $this->assertCount( 31, $properties ); $this->assertArrayHasKey( 'api_version', $properties ); $this->assertArrayHasKey( 'name', $properties ); $this->assertArrayHasKey( 'title', $properties ); @@ -578,6 +578,7 @@ public function test_get_item_schema() { $this->assertArrayHasKey( 'view_script_handles', $properties ); $this->assertArrayHasKey( 'editor_style_handles', $properties ); $this->assertArrayHasKey( 'style_handles', $properties ); + $this->assertArrayHasKey( 'view_style_handles', $properties, 'schema must contain view_style_handles' ); $this->assertArrayHasKey( 'is_dynamic', $properties ); // Deprecated properties. $this->assertArrayHasKey( 'editor_script', $properties ); From abed24dfc9195d5eb4044735fc85c279ba6d7ed6 Mon Sep 17 00:00:00 2001 From: Fabian Todt Date: Thu, 19 Oct 2023 17:37:23 +0200 Subject: [PATCH 3/4] fix code formatting --- src/wp-includes/blocks.php | 4 ++-- src/wp-includes/class-wp-block-type.php | 2 +- .../endpoints/class-wp-rest-block-types-controller.php | 2 +- tests/phpunit/tests/blocks/register.php | 2 +- 4 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/wp-includes/blocks.php b/src/wp-includes/blocks.php index 8f297029eea99..aba637b9f4b40 100644 --- a/src/wp-includes/blocks.php +++ b/src/wp-includes/blocks.php @@ -470,7 +470,7 @@ function register_block_type_from_metadata( $file_or_folder, $args = array() ) { $style_fields = array( 'editorStyle' => 'editor_style_handles', 'style' => 'style_handles', - 'viewStyle' => 'view_style_handles', + 'viewStyle' => 'view_style_handles', ); foreach ( $style_fields as $metadata_field_name => $settings_field_name ) { if ( ! empty( $metadata[ $metadata_field_name ] ) ) { @@ -1964,7 +1964,7 @@ function get_comments_pagination_arrow( $block, $pagination_type = 'next' ) { * @return string Filtered content without any HTML on the footnote content and with the sanitized id. */ function _wp_filter_post_meta_footnotes( $footnotes ) { - $footnotes_decoded = json_decode( $footnotes, true ); + $footnotes_decoded = json_decode( $footnotes, true ); if ( ! is_array( $footnotes_decoded ) ) { return ''; } diff --git a/src/wp-includes/class-wp-block-type.php b/src/wp-includes/class-wp-block-type.php index 1d2fda115ec05..cfa8466d68dd3 100644 --- a/src/wp-includes/class-wp-block-type.php +++ b/src/wp-includes/class-wp-block-type.php @@ -312,7 +312,7 @@ class WP_Block_Type { * @type string[] $view_script_handles Block type front end only script handles. * @type string[] $editor_style_handles Block type editor only style handles. * @type string[] $style_handles Block type front end and editor style handles. - * @type string[] $view_style_handles Block type front end only style handles. + * @type string[] $view_style_handles Block type front end only style handles. * } */ public function __construct( $block_type, $args = array() ) { diff --git a/src/wp-includes/rest-api/endpoints/class-wp-rest-block-types-controller.php b/src/wp-includes/rest-api/endpoints/class-wp-rest-block-types-controller.php index 7c0e0c54bf8cc..9e8ba9e9299e3 100644 --- a/src/wp-includes/rest-api/endpoints/class-wp-rest-block-types-controller.php +++ b/src/wp-includes/rest-api/endpoints/class-wp-rest-block-types-controller.php @@ -603,7 +603,7 @@ public function get_item_schema() { 'context' => array( 'embed', 'view', 'edit' ), 'readonly' => true, ), - 'view_style_handles' => array( + 'view_style_handles' => array( 'description' => __( 'Public facing style handles.' ), 'type' => array( 'array' ), 'default' => array(), diff --git a/tests/phpunit/tests/blocks/register.php b/tests/phpunit/tests/blocks/register.php index 59608aa42a125..535070c1f3998 100644 --- a/tests/phpunit/tests/blocks/register.php +++ b/tests/phpunit/tests/blocks/register.php @@ -462,7 +462,7 @@ public function test_success_register_block_style_handle() { ); // Test viewStyle property - $result = register_block_style_handle( $metadata, 'viewStyle' ); + $result = register_block_style_handle( $metadata, 'viewStyle' ); $this->assertSame( 'unit-tests-test-block-view-style', $result ); // @ticket 59673 From a59d005630b0a879fb29b0e7ec5afd0e57a469c5 Mon Sep 17 00:00:00 2001 From: Fabian Todt Date: Mon, 29 Jan 2024 08:47:18 +0100 Subject: [PATCH 4/4] Apply suggestions from code review MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Greg Ziółkowski --- src/wp-includes/blocks.php | 2 +- src/wp-includes/class-wp-block-type.php | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/wp-includes/blocks.php b/src/wp-includes/blocks.php index aba637b9f4b40..b7226afc96a88 100644 --- a/src/wp-includes/blocks.php +++ b/src/wp-includes/blocks.php @@ -327,7 +327,7 @@ function get_block_metadata_i18n_schema() { * @since 6.1.0 Added support for `render` field. * @since 6.3.0 Added `selectors` field. * @since 6.4.0 Added support for `blockHooks` field. - * @since 6.x.x Added support for `viewStyle` field. + * @since 6.5.0 Added support for `viewStyle` field. * * @param string $file_or_folder Path to the JSON file with metadata definition for * the block or path to the folder where the `block.json` file is located. diff --git a/src/wp-includes/class-wp-block-type.php b/src/wp-includes/class-wp-block-type.php index cfa8466d68dd3..b49406ba9103a 100644 --- a/src/wp-includes/class-wp-block-type.php +++ b/src/wp-includes/class-wp-block-type.php @@ -228,7 +228,7 @@ class WP_Block_Type { /** * Block type front end only style handles. * - * @since 6.x.x + * @since 6.5.0 * @var string[] */ public $view_style_handles = array(); @@ -275,7 +275,7 @@ class WP_Block_Type { * Deprecated the `editor_script`, `script`, `view_script`, `editor_style`, and `style` properties. * @since 6.3.0 Added the `selectors` property. * @since 6.4.0 Added the `block_hooks` property. - * @since 6.x.x Added the `view_style_handles` property. + * @since 6.5.0 Added the `view_style_handles` property. * * @see register_block_type() *