From abb8410835f6c9f23a91ca2c384b1c664544bd16 Mon Sep 17 00:00:00 2001 From: Weston Ruter Date: Wed, 12 Jul 2023 10:30:56 -0700 Subject: [PATCH 1/2] Add filter to turn off Interactivity API for a block --- lib/experimental/blocks.php | 21 +++++++++++++++++++ .../interactivity-api/scripts.php | 2 +- packages/block-library/src/file/index.php | 4 ++-- .../block-library/src/navigation/index.php | 8 ++++--- 4 files changed, 29 insertions(+), 6 deletions(-) diff --git a/lib/experimental/blocks.php b/lib/experimental/blocks.php index a33d2f6b980123..fafeba00e3b3f6 100644 --- a/lib/experimental/blocks.php +++ b/lib/experimental/blocks.php @@ -5,6 +5,27 @@ * @package gutenberg */ +/** + * Checks whether the experimental Interactivity API should be used for a block. + * + * Note: This function is located here instead of in interactivity-api/blocks.php because it has to be available earler. + * + * @param string $block_name Block name. + * @return bool Whether Interactivity API is used for block. + */ +function gutenberg_should_block_use_interactivity_api( $block_name ) { + + /** + * Filters whether the experimental Interactivity API should be used for a block. + * + * @since 6.3.0 + * + * @param bool $enabled Whether Interactivity API is used for block. + * @param string $block_name Block name. + */ + return (bool) apply_filters( 'gutenberg_should_block_use_interactivity_api', true, $block_name ); +} + if ( ! function_exists( 'wp_enqueue_block_view_script' ) ) { /** * Enqueues a frontend script for a specific block. diff --git a/lib/experimental/interactivity-api/scripts.php b/lib/experimental/interactivity-api/scripts.php index e95bf518c75f73..e974e4cfb40f84 100644 --- a/lib/experimental/interactivity-api/scripts.php +++ b/lib/experimental/interactivity-api/scripts.php @@ -18,7 +18,7 @@ function gutenberg_interactivity_move_interactive_scripts_to_the_footer() { // Move all the view scripts of the interactive blocks to the footer. $registered_blocks = \WP_Block_Type_Registry::get_instance()->get_all_registered(); foreach ( array_values( $registered_blocks ) as $block ) { - if ( isset( $block->supports['interactivity'] ) && $block->supports['interactivity'] ) { + if ( isset( $block->supports['interactivity'] ) && $block->supports['interactivity'] && gutenberg_should_block_use_interactivity_api( $block->name ) ) { foreach ( $block->view_script_handles as $handle ) { wp_script_add_data( $handle, 'group', 1 ); } diff --git a/packages/block-library/src/file/index.php b/packages/block-library/src/file/index.php index 172bb5d836343d..79e1ff598ea361 100644 --- a/packages/block-library/src/file/index.php +++ b/packages/block-library/src/file/index.php @@ -5,7 +5,7 @@ * @package WordPress */ -if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { +if ( gutenberg_should_block_use_interactivity_api( 'core/file' ) ) { /** * Replaces view script for the File block with version using Interactivity API. * @@ -71,7 +71,7 @@ static function ( $matches ) { ); // If it uses the Interactivity API, add the directives. - if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN && $should_load_view_script ) { + if ( gutenberg_should_block_use_interactivity_api( 'core/file' ) && $should_load_view_script ) { $processor = new WP_HTML_Tag_Processor( $content ); $processor->next_tag(); $processor->set_attribute( 'data-wp-interactive', '' ); diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index cfdd20100af812..e298f2edba9904 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -65,6 +65,9 @@ function block_core_navigation_sort_menu_items_by_parent_id( $menu_items ) { return $menu_items_by_parent_id; } +} + +if ( gutenberg_should_block_use_interactivity_api( 'core/navigation' ) ) { /** * Add Interactivity API directives to the navigation-submenu and page-list blocks markup using the Tag Processor @@ -156,7 +159,6 @@ function gutenberg_block_core_navigation_update_interactive_view_script( $metada } - /** * Build an array with CSS classes and inline styles defining the colors * which will be applied to the navigation markup in the front-end. @@ -685,7 +687,7 @@ function render_block_core_navigation( $attributes, $content, $block ) { } // Add directives to the submenu if needed. - if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN && $has_submenus && $should_load_view_script ) { + if ( gutenberg_should_block_use_interactivity_api( 'core/navigation' ) && $has_submenus && $should_load_view_script ) { $w = new WP_HTML_Tag_Processor( $inner_blocks_html ); $inner_blocks_html = block_core_navigation_add_directives_to_submenu( $w, $attributes ); } @@ -733,7 +735,7 @@ function render_block_core_navigation( $attributes, $content, $block ) { $responsive_container_directives = ''; $responsive_dialog_directives = ''; $close_button_directives = ''; - if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN && $should_load_view_script ) { + if ( gutenberg_should_block_use_interactivity_api( 'core/navigation' ) && $should_load_view_script ) { $nav_element_directives = ' data-wp-interactive data-wp-context=\'{ "core": { "navigation": { "overlayOpenedBy": {}, "type": "overlay", "roleAttribute": "" } } }\' From d33578c64c450906e4a4bc648bea053a665893bb Mon Sep 17 00:00:00 2001 From: Weston Ruter Date: Wed, 12 Jul 2023 12:53:35 -0700 Subject: [PATCH 2/2] Dynamically opt-in to interactivity support in File and Navigation blocks Co-authored-by: Luis Herranz --- docs/reference-guides/core-blocks.md | 4 ++-- lib/experimental/interactivity-api/scripts.php | 2 +- packages/block-library/src/file/block.json | 3 +-- packages/block-library/src/file/index.php | 3 ++- packages/block-library/src/navigation/block.json | 3 +-- packages/block-library/src/navigation/index.php | 3 ++- 6 files changed, 9 insertions(+), 9 deletions(-) diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md index d0033da9632cba..d0a6ca7d356b2f 100644 --- a/docs/reference-guides/core-blocks.md +++ b/docs/reference-guides/core-blocks.md @@ -266,7 +266,7 @@ Add a link to a downloadable file. ([Source](https://github.com/WordPress/gutenb - **Name:** core/file - **Category:** media -- **Supports:** align, anchor, color (background, gradients, link, ~~text~~), interactivity +- **Supports:** align, anchor, color (background, gradients, link, ~~text~~) - **Attributes:** displayPreview, downloadButtonText, fileId, fileName, href, id, previewHeight, showDownloadButton, textLinkHref, textLinkTarget ## Footnotes @@ -421,7 +421,7 @@ A collection of blocks that allow visitors to get around your site. ([Source](ht - **Name:** core/navigation - **Category:** theme -- **Supports:** align (full, wide), inserter, interactivity, layout (allowSizingOnChildren, default, ~~allowInheriting~~, ~~allowSwitching~~, ~~allowVerticalAlignment~~), spacing (blockGap, units), typography (fontSize, lineHeight), ~~html~~ +- **Supports:** align (full, wide), inserter, layout (allowSizingOnChildren, default, ~~allowInheriting~~, ~~allowSwitching~~, ~~allowVerticalAlignment~~), spacing (blockGap, units), typography (fontSize, lineHeight), ~~html~~ - **Attributes:** __unstableLocation, backgroundColor, customBackgroundColor, customOverlayBackgroundColor, customOverlayTextColor, customTextColor, hasIcon, icon, maxNestingLevel, openSubmenusOnClick, overlayBackgroundColor, overlayMenu, overlayTextColor, ref, rgbBackgroundColor, rgbTextColor, showSubmenuIcon, templateLock, textColor ## Custom Link diff --git a/lib/experimental/interactivity-api/scripts.php b/lib/experimental/interactivity-api/scripts.php index e974e4cfb40f84..e95bf518c75f73 100644 --- a/lib/experimental/interactivity-api/scripts.php +++ b/lib/experimental/interactivity-api/scripts.php @@ -18,7 +18,7 @@ function gutenberg_interactivity_move_interactive_scripts_to_the_footer() { // Move all the view scripts of the interactive blocks to the footer. $registered_blocks = \WP_Block_Type_Registry::get_instance()->get_all_registered(); foreach ( array_values( $registered_blocks ) as $block ) { - if ( isset( $block->supports['interactivity'] ) && $block->supports['interactivity'] && gutenberg_should_block_use_interactivity_api( $block->name ) ) { + if ( isset( $block->supports['interactivity'] ) && $block->supports['interactivity'] ) { foreach ( $block->view_script_handles as $handle ) { wp_script_add_data( $handle, 'group', 1 ); } diff --git a/packages/block-library/src/file/block.json b/packages/block-library/src/file/block.json index 6096ba36d2a670..12edc20630d1ed 100644 --- a/packages/block-library/src/file/block.json +++ b/packages/block-library/src/file/block.json @@ -65,8 +65,7 @@ "background": true, "link": true } - }, - "interactivity": true + } }, "viewScript": "file:./view.min.js", "editorStyle": "wp-block-file-editor", diff --git a/packages/block-library/src/file/index.php b/packages/block-library/src/file/index.php index 79e1ff598ea361..621f07b5b88eec 100644 --- a/packages/block-library/src/file/index.php +++ b/packages/block-library/src/file/index.php @@ -15,7 +15,8 @@ */ function gutenberg_block_core_file_update_interactive_view_script( $metadata ) { if ( 'core/file' === $metadata['name'] ) { - $metadata['viewScript'] = array( 'file:./view-interactivity.min.js' ); + $metadata['viewScript'] = array( 'file:./view-interactivity.min.js' ); + $metadata['supports']['interactivity'] = true; } return $metadata; } diff --git a/packages/block-library/src/navigation/block.json b/packages/block-library/src/navigation/block.json index 0fbb2f5ed2b919..e45d0535367786 100644 --- a/packages/block-library/src/navigation/block.json +++ b/packages/block-library/src/navigation/block.json @@ -131,8 +131,7 @@ } } } - }, - "interactivity": true + } }, "viewScript": [ "file:./view.min.js", "file:./view-modal.min.js" ], "editorStyle": "wp-block-navigation-editor", diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index e298f2edba9904..79988c3ee350bb 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -151,7 +151,8 @@ function block_core_navigation_add_directives_to_submenu( $w, $block_attributes */ function gutenberg_block_core_navigation_update_interactive_view_script( $metadata ) { if ( 'core/navigation' === $metadata['name'] ) { - $metadata['viewScript'] = array( 'file:./view-interactivity.min.js' ); + $metadata['viewScript'] = array( 'file:./view-interactivity.min.js' ); + $metadata['supports']['interactivity'] = true; } return $metadata; }