wp-env, instead, navigate to the plugins/ folder in your local WordPress installation using the terminal and run the following command.
@@ -351,9 +351,10 @@ To enable this starting year functionality, you will need one attribute to store
### Updating block.json
-Block attributes are generally specified in the [`block.json`](https://developer.wordpress.org/block-editor/getting-started/fundamentals/block-json/#data-storage-in-the-block-with-attributes) file. So open up the file and add the following section after the `example` in line 9.
+Block attributes are generally specified in the [`block.json`](https://developer.wordpress.org/block-editor/getting-started/fundamentals/block-json/#data-storage-in-the-block-with-attributes) file. So open up the file and add the following section after the `example` property.
```json
+"example": {},
"attributes": {
"showStartingYear": {
"type": "boolean"
@@ -483,7 +484,7 @@ export default function Edit( { attributes, setAttributes } ) {
'Starting year',
'copyright-date-block'
) }
- value={ startingYear }
+ value={ startingYear || '' }
onChange={ ( value ) =>
setAttributes( { startingYear: value } )
}
@@ -496,6 +497,10 @@ export default function Edit( { attributes, setAttributes } ) {
}
```
+
+ You may have noticed that the
+
Save the file and refresh the Editor. Confirm that a text field now exists in the Settings panel. Add a starting year and confirm that when you update the page, the value is saved.
@@ -522,7 +527,7 @@ export default function Edit( { attributes, setAttributes } ) {
value property has a value of startingYear || ''. The symbol || is called the Logical OR (logical disjunction) operator. This prevents warnings in React when the startingYear is empty. See Controlled and uncontrolled components for details.
+
-
@@ -475,7 +477,8 @@ private static function get_responsive_container_markup( $attributes, $inner_blo
$open_button_directives,
$responsive_container_directives,
$responsive_dialog_directives,
- $close_button_directives
+ $close_button_directives,
+ $responsive_container_content_directives
);
}
diff --git a/lib/experimental/fonts/font-library/class-wp-font-family-utils.php b/lib/experimental/fonts/font-library/class-wp-font-family-utils.php
index 7d954e79e96a3c..35e6856e50aad8 100644
--- a/lib/experimental/fonts/font-library/class-wp-font-family-utils.php
+++ b/lib/experimental/fonts/font-library/class-wp-font-family-utils.php
@@ -76,21 +76,6 @@ public static function merge_fonts_data( $font1, $font2 ) {
return $merged_font;
}
- /**
- * Returns whether the given file has a font MIME type.
- *
- * @since 6.5.0
- *
- * @param string $filepath The file to check.
- * @return bool True if the file has a font MIME type, false otherwise.
- */
- public static function has_font_mime_type( $filepath ) {
- $allowed_mime_types = WP_Font_Library::get_expected_font_mime_types_per_php_version();
- $filetype = wp_check_filetype( $filepath, $allowed_mime_types );
-
- return in_array( $filetype['type'], $allowed_mime_types, true );
- }
-
/**
* Format font family to make it valid CSS.
*
diff --git a/lib/experimental/fonts/font-library/class-wp-font-family.php b/lib/experimental/fonts/font-library/class-wp-font-family.php
index 58d4f476e834d1..a4204dfe1fa2c7 100644
--- a/lib/experimental/fonts/font-library/class-wp-font-family.php
+++ b/lib/experimental/fonts/font-library/class-wp-font-family.php
@@ -202,11 +202,6 @@ private function get_upload_overrides( $filename ) {
* False if the download failed.
*/
private function download_asset( $url, $filename ) {
- // Checks if the file to be downloaded has a font mime type.
- if ( ! WP_Font_Family_Utils::has_font_mime_type( $filename ) ) {
- return false;
- }
-
// Include file with download_url() if function doesn't exist.
if ( ! function_exists( 'download_url' ) ) {
require_once ABSPATH . 'wp-admin/includes/file.php';
@@ -263,12 +258,6 @@ private function move_font_face_asset( $font_face, $file ) {
// because it is no longer needed.
unset( $new_font_face['uploadedFile'] );
- // If the filename has no font mime type, don't move the file and
- // return the font face definition without src to be ignored later.
- if ( ! WP_Font_Family_Utils::has_font_mime_type( $filename ) ) {
- return $new_font_face;
- }
-
// Move the uploaded font asset from the temp folder to the fonts directory.
if ( ! function_exists( 'wp_handle_upload' ) ) {
require_once ABSPATH . 'wp-admin/includes/file.php';
diff --git a/lib/experimental/interactivity-api/class-wp-directive-processor.php b/lib/experimental/interactivity-api/class-wp-directive-processor.php
index cf55a048bb9fa5..bb70068aa9482b 100644
--- a/lib/experimental/interactivity-api/class-wp-directive-processor.php
+++ b/lib/experimental/interactivity-api/class-wp-directive-processor.php
@@ -13,47 +13,42 @@
/**
* This processor is built on top of the HTML Tag Processor and augments its
* capabilities to process the Interactivity API directives.
- *
- * IMPORTANT DISCLAIMER: This code is highly experimental and its only purpose
- * is to provide a way to test the server-side rendering of the Interactivity
- * API. Most of this code will be discarded once the HTML Processor is
- * available. Please restrain from investing unnecessary time and effort trying
- * to improve this code.
*/
class WP_Directive_Processor extends Gutenberg_HTML_Tag_Processor_6_5 {
+ /**
+ * String containing the current root block.
+ *
+ * @var string
+ */
+ public static $root_block = null;
/**
- * An array of root blocks.
+ * Array containing the direct children of interactive blocks.
*
* @var array
*/
- public static $root_block = null;
+ public static $children_of_interactive_block = array();
/**
- * Add a root block to the variable.
+ * Sets the current root block.
*
* @param array $block The block to add.
- *
- * @return void
*/
public static function mark_root_block( $block ) {
self::$root_block = md5( serialize( $block ) );
}
/**
- * Remove a root block to the variable.
- *
- * @return void
+ * Resets the root block.
*/
public static function unmark_root_block() {
self::$root_block = null;
}
/**
- * Check if block is a root block.
+ * Checks if block is a root block.
*
* @param array $block The block to check.
- *
* @return bool True if block is a root block, false otherwise.
*/
public static function is_marked_as_root_block( $block ) {
@@ -61,17 +56,36 @@ public static function is_marked_as_root_block( $block ) {
}
/**
- * Check if a root block has already been defined.
+ * Checks if a root block has already been defined.
*
- * @return bool True if block is a root block, false otherwise.
+ * @return bool True if there is a root block, false otherwise.
*/
public static function has_root_block() {
return isset( self::$root_block );
}
+ /**
+ * Stores a reference to a direct children of an interactive block to be able
+ * to identify it later.
+ *
+ * @param array $block The block to add.
+ */
+ public static function mark_children_of_interactive_block( $block ) {
+ self::$children_of_interactive_block[] = md5( serialize( $block ) );
+ }
/**
- * Find the matching closing tag for an opening tag.
+ * Checks if block is marked as children of an interactive block.
+ *
+ * @param array $block The block to check.
+ * @return bool True if block is a children of an interactive block, false otherwise.
+ */
+ public static function is_marked_as_children_of_interactive_block( $block ) {
+ return in_array( md5( serialize( $block ) ), self::$children_of_interactive_block, true );
+ }
+
+ /**
+ * Finds the matching closing tag for an opening tag.
*
* When called while on an open tag, traverse the HTML until we find the
* matching closing tag, respecting any in-between content, including nested
@@ -111,76 +125,7 @@ public function next_balanced_closer() {
}
/**
- * Traverses the HTML searching for Interactivity API directives and processing
- * them.
- *
- * @param WP_Directive_Processor $tags An instance of the WP_Directive_Processor.
- * @param string $prefix Attribute prefix.
- * @param string[] $directives Directives.
- *
- * @return WP_Directive_Processor The modified instance of the
- * WP_Directive_Processor.
- */
- public function process_rendered_html( $tags, $prefix, $directives ) {
- $context = new WP_Directive_Context();
- $tag_stack = array();
-
- while ( $tags->next_tag( array( 'tag_closers' => 'visit' ) ) ) {
- $tag_name = $tags->get_tag();
-
- // Is this a tag that closes the latest opening tag?
- if ( $tags->is_tag_closer() ) {
- if ( 0 === count( $tag_stack ) ) {
- continue;
- }
-
- list( $latest_opening_tag_name, $attributes ) = end( $tag_stack );
- if ( $latest_opening_tag_name === $tag_name ) {
- array_pop( $tag_stack );
-
- // If the matching opening tag didn't have any directives, we move on.
- if ( 0 === count( $attributes ) ) {
- continue;
- }
- }
- } else {
- $attributes = array();
- foreach ( $tags->get_attribute_names_with_prefix( $prefix ) as $name ) {
- /*
- * Removes the part after the double hyphen before looking for
- * the directive processor inside `$directives`, e.g., "wp-bind"
- * from "wp-bind--src" and "wp-context" from "wp-context" etc...
- */
- list( $type ) = WP_Directive_Processor::parse_attribute_name( $name );
- if ( array_key_exists( $type, $directives ) ) {
- $attributes[] = $type;
- }
- }
-
- /*
- * If this is an open tag, and if it either has directives, or if
- * we're inside a tag that does, take note of this tag and its
- * directives so we can call its directive processor once we
- * encounter the matching closing tag.
- */
- if (
- ! WP_Directive_Processor::is_html_void_element( $tags->get_tag() ) &&
- ( 0 !== count( $attributes ) || 0 !== count( $tag_stack ) )
- ) {
- $tag_stack[] = array( $tag_name, $attributes );
- }
- }
-
- foreach ( $attributes as $attribute ) {
- call_user_func( $directives[ $attribute ], $tags, $context );
- }
- }
-
- return $tags;
- }
-
- /**
- * Return the content between two balanced tags.
+ * Returns the content between two balanced tags.
*
* When called on an opening tag, return the HTML content found between that
* opening tag and its matching closing tag.
@@ -206,14 +151,13 @@ public function get_inner_html() {
}
/**
- * Set the content between two balanced tags.
+ * Sets the content between two balanced tags.
*
* When called on an opening tag, set the HTML content found between that
* opening tag and its matching closing tag.
*
* @param string $new_html The string to replace the content between the
* matching tags with.
- *
* @return bool Whether the content was successfully replaced.
*/
public function set_inner_html( $new_html ) {
@@ -237,7 +181,7 @@ public function set_inner_html( $new_html ) {
}
/**
- * Return a pair of bookmarks for the current opening tag and the matching
+ * Returns a pair of bookmarks for the current opening tag and the matching
* closing tag.
*
* @return array|false A pair of bookmarks, or false if there's no matching
@@ -267,12 +211,12 @@ public function get_balanced_tag_bookmarks() {
}
/**
- * Whether a given HTML element is void (e.g.
). + * Checks whether a given HTML element is void (e.g.
). + * + * @see https://html.spec.whatwg.org/#elements-2 * * @param string $tag_name The element in question. * @return bool True if the element is void. - * - * @see https://html.spec.whatwg.org/#elements-2 */ public static function is_html_void_element( $tag_name ) { switch ( $tag_name ) { @@ -297,7 +241,7 @@ public static function is_html_void_element( $tag_name ) { } /** - * Extract and return the directive type and the the part after the double + * Extracts and return the directive type and the the part after the double * hyphen from an attribute name (if present), in an array format. * * Examples: @@ -307,7 +251,7 @@ public static function is_html_void_element( $tag_name ) { * 'wp-thing--and--thang' => array( 'wp-thing', 'and--thang' ) * * @param string $name The attribute name. - * @return array The resulting array + * @return array The resulting array. */ public static function parse_attribute_name( $name ) { return explode( '--', $name, 2 ); diff --git a/lib/experimental/interactivity-api/directive-processing.php b/lib/experimental/interactivity-api/directive-processing.php index 064fc8ea62cbb2..075d31d577634c 100644 --- a/lib/experimental/interactivity-api/directive-processing.php +++ b/lib/experimental/interactivity-api/directive-processing.php @@ -1,16 +1,16 @@ 'gutenberg_interactivity_process_wp_bind', - 'data-wp-context' => 'gutenberg_interactivity_process_wp_context', - 'data-wp-class' => 'gutenberg_interactivity_process_wp_class', - 'data-wp-style' => 'gutenberg_interactivity_process_wp_style', - 'data-wp-text' => 'gutenberg_interactivity_process_wp_text', - ); - $tags = new WP_Directive_Processor( $block_content ); - $tags = $tags->process_rendered_html( $tags, 'data-wp-', $directives ); - return $tags->get_updated_html(); + // Parse our own block delimiters for interactive and non-interactive blocks. + $parsed_blocks = parse_blocks( $block_content ); + $context = new WP_Directive_Context(); + $processed_content = ''; + + foreach ( $parsed_blocks as $parsed_block ) { + if ( 'core/interactivity-wrapper' === $parsed_block['blockName'] ) { + $processed_content .= gutenberg_process_interactive_block( $parsed_block, $context ); + } elseif ( 'core/non-interactivity-wrapper' === $parsed_block['blockName'] ) { + $processed_content .= gutenberg_process_non_interactive_block( $parsed_block, $context ); + } else { + $processed_content .= $parsed_block['innerHTML']; + } + } + return $processed_content; + } + + return $block_content; +} +add_filter( 'render_block', 'gutenberg_process_directives_in_root_blocks', 20, 2 ); +/** + * Marks the block as a children of an interactive block. + * + * @param array $parsed_block The parsed block. + * @param array $source_block The source block. + * @param WP_Block $parent_block The parent block. + */ +function gutenberg_mark_chidren_of_interactive_block( $parsed_block, $source_block, $parent_block ) { + if ( + isset( $parent_block ) && + isset( $parent_block->block_type->supports['interactivity'] ) && + $parent_block->block_type->supports['interactivity'] + ) { + WP_Directive_Processor::mark_children_of_interactive_block( $source_block ); } + return $parsed_block; +} +add_filter( 'render_block_data', 'gutenberg_mark_chidren_of_interactive_block', 100, 3 ); +/** + * Adds a comment delimiter to mark if the block is interactive or not. + * + * @param string $block_content The block content. + * @param array $block The full block, including name and attributes. + * @param WP_Block $block_instance The block instance. + */ +function gutenberg_mark_block_interactivity( $block_content, $block, $block_instance ) { + if ( + isset( $block_instance->block_type->supports['interactivity'] ) && + $block_instance->block_type->supports['interactivity'] + ) { + // Wraps the interactive block with a comment delimiter to be able to + // process it later. + return get_comment_delimited_block_content( + 'core/interactivity-wrapper', + array(), + $block_content + ); + } elseif ( WP_Directive_Processor::is_marked_as_children_of_interactive_block( $block ) ) { + // Wraps the non-interactive block with a comment delimiter to be able to + // skip it later. + return get_comment_delimited_block_content( + 'core/non-interactivity-wrapper', + array(), + $block_content + ); + } return $block_content; } -add_filter( 'render_block', 'gutenberg_process_directives_in_root_blocks', 10, 2 ); +add_filter( 'render_block', 'gutenberg_mark_block_interactivity', 10, 3 ); + +/** + * Traverses the HTML of an interactive block, searching for Interactivity API + * directives and processing them. For the inner blocks, it calls the + * corresponding function depending on the wrapper type. + * + * @param array $interactive_block The interactive block to process. + * @param WP_Directive_Context $context The context to use when processing. + * + * @return string The processed HTML. + */ +function gutenberg_process_interactive_block( $interactive_block, $context ) { + $block_index = 0; + $content = ''; + $interactive_inner_blocks = array(); + + foreach ( $interactive_block['innerContent'] as $inner_content ) { + if ( is_string( $inner_content ) ) { + $content .= $inner_content; + } else { + // This is an inner block. It may be an interactive block or a + // non-interactive block. + $content .= ' {
@@ -172,7 +172,7 @@ export default function AddFilter( { filters, view, onChangeView } ) {
] ) => (
{
+ function DropdownMenuRadioItemCustom(
+ { checked, name, value, hideOnClick, onChange, onClick, ...props },
+ ref
+ ) {
const onClickHandler = ( e ) => {
onClick?.( e );
onChange?.( { ...e, target: { ...e.target, value } } );
@@ -39,7 +42,7 @@ export const DropdownMenuRadioItemCustom = forwardRef(
role="menuitemradio"
name={ name }
aria-checked={ checked }
- hideOnClick={ false }
+ hideOnClick={ !! hideOnClick }
prefix={
checked ? (
@@ -150,7 +150,7 @@ export default function FilterSummary( { filter, view, onChangeView } ) {
( [ operator, { label, key } ] ) => (
{
diff --git a/packages/dataviews/src/view-actions.js b/packages/dataviews/src/view-actions.js
index 458032d68ac70c..9130f72694b289 100644
--- a/packages/dataviews/src/view-actions.js
+++ b/packages/dataviews/src/view-actions.js
@@ -54,6 +54,7 @@ function ViewTypeMenu( { view, onChangeView, supportedLayouts } ) {
value={ availableView.type }
name="view-actions-available-view"
checked={ availableView.type === view.type }
+ hideOnClick={ true }
onChange={ ( e ) => {
onChangeView( {
...view,
diff --git a/packages/dataviews/src/view-table.js b/packages/dataviews/src/view-table.js
index 200da945a101a1..6ca851c5d5690d 100644
--- a/packages/dataviews/src/view-table.js
+++ b/packages/dataviews/src/view-table.js
@@ -167,7 +167,7 @@ function HeaderMenu( { field, view, onChangeView } ) {
return (
{
@@ -222,7 +222,7 @@ function HeaderMenu( { field, view, onChangeView } ) {
] ) => (
{
- await searchForPattern( name );
- const patternElement = await page.waitForXPath(
- `//div[@role = 'option']//div[contains(text(), '${ name }')]`,
- { timeout: 5000, visible: available, hidden: ! available }
- );
- const patternExists = !! patternElement;
- await toggleGlobalBlockInserter();
- return patternExists;
-};
-
-const TEST_PATTERNS = [
- [ 'Test: Single heading', true ],
- [ 'Test: Single paragraph', false ],
- [ 'Test: Paragraph inside group', false ],
-];
-
-describe( 'Allowed Patterns', () => {
- beforeAll( async () => {
- await activatePlugin( 'gutenberg-test-allowed-patterns' );
- await createNewPost();
- } );
- afterAll( async () => {
- await deactivatePlugin( 'gutenberg-test-allowed-patterns' );
- } );
-
- describe( 'Disable blocks plugin disabled', () => {
- for ( const [ patternName ] of TEST_PATTERNS ) {
- it( `should show test pattern "${ patternName }"`, async () => {
- expect( await checkPatternExistence( patternName, true ) ).toBe(
- true
- );
- } );
- }
- } );
-
- describe( 'Disable blocks plugin enabled', () => {
- beforeAll( async () => {
- await activatePlugin(
- 'gutenberg-test-allowed-patterns-disable-blocks'
- );
- await createNewPost();
- } );
- afterAll( async () => {
- await deactivatePlugin(
- 'gutenberg-test-allowed-patterns-disable-blocks'
- );
- } );
-
- for ( const [ patternName, shouldBeAvailable ] of TEST_PATTERNS ) {
- it( `should${
- shouldBeAvailable ? '' : ' not'
- } show test "pattern ${ patternName }"`, async () => {
- expect(
- await checkPatternExistence(
- patternName,
- shouldBeAvailable
- )
- ).toBe( shouldBeAvailable );
- } );
- }
- } );
-} );
diff --git a/packages/edit-site/src/components/global-styles/font-library-modal/confirm-delete-dialog.js b/packages/edit-site/src/components/global-styles/font-library-modal/confirm-delete-dialog.js
index 259b6900dd16d5..b87a921bd35e59 100644
--- a/packages/edit-site/src/components/global-styles/font-library-modal/confirm-delete-dialog.js
+++ b/packages/edit-site/src/components/global-styles/font-library-modal/confirm-delete-dialog.js
@@ -13,8 +13,8 @@ function ConfirmDeleteDialog( {
return (
@@ -22,7 +22,7 @@ function ConfirmDeleteDialog( {
sprintf(
/* translators: %s: Name of the font. */
__(
- 'Would you like to remove %s and all its variants and assets?'
+ 'Are you sure you want to delete "%s" font and all its variants and assets?'
),
font.name
) }
diff --git a/packages/style-engine/docs/using-the-style-engine-with-block-supports.md b/packages/style-engine/docs/using-the-style-engine-with-block-supports.md
index 42350a17ffcd6d..27d80df189cf3d 100644
--- a/packages/style-engine/docs/using-the-style-engine-with-block-supports.md
+++ b/packages/style-engine/docs/using-the-style-engine-with-block-supports.md
@@ -231,4 +231,4 @@ array(
*/
```
-Read more about [global styles](https://developer.wordpress.org/block-editor/explanations/architecture/styles/#global-styles) and [preset CSS custom properties](https://developer.wordpress.org/block-editor/how-to-guides/themes/theme-json/#css-custom-properties-presets-custom) and [theme supports](https://developer.wordpress.org/block-editor/how-to-guides/themes/theme-support/).
+Read more about [global styles](https://developer.wordpress.org/block-editor/explanations/architecture/styles/#global-styles) and [preset CSS custom properties](https://developer.wordpress.org/block-editor/how-to-guides/themes/global-settings-and-styles.md#css-custom-properties-presets-custom) and [theme supports](https://developer.wordpress.org/block-editor/how-to-guides/themes/theme-support/).
diff --git a/phpunit/experimental/interactivity-api/directive-processing-test.php b/phpunit/experimental/interactivity-api/directive-processing-test.php
index 46ef0284df15d9..99218f69a8fb79 100644
--- a/phpunit/experimental/interactivity-api/directive-processing-test.php
+++ b/phpunit/experimental/interactivity-api/directive-processing-test.php
@@ -4,81 +4,97 @@
*
* @package Gutenberg
* @subpackage Interactivity API
- *
- * @phpcs:disable Generic.Files.OneObjectStructurePerFile.MultipleFound
*/
+class Tests_Process_Directives extends WP_UnitTestCase {
+ public function set_up() {
+ parent::set_up();
-class Helper_Class {
- // phpcs:ignore VariableAnalysis.CodeAnalysis.VariableAnalysis.UnusedVariable
- public function process_foo_test( $tags, $context ) {
- }
-
- public function increment( $store ) {
- return $store['state']['count'] + $store['context']['count'];
- }
-
- public static function static_increment( $store ) {
- return $store['state']['count'] + $store['context']['count'];
- }
-}
+ register_block_type(
+ 'test/context-level-1',
+ array(
+ 'render_callback' => function ( $attributes, $content ) {
+ return '
). + * Checks whether a given HTML element is void (e.g.
). + * + * @see https://html.spec.whatwg.org/#elements-2 * * @param string $tag_name The element in question. * @return bool True if the element is void. - * - * @see https://html.spec.whatwg.org/#elements-2 */ public static function is_html_void_element( $tag_name ) { switch ( $tag_name ) { @@ -297,7 +241,7 @@ public static function is_html_void_element( $tag_name ) { } /** - * Extract and return the directive type and the the part after the double + * Extracts and return the directive type and the the part after the double * hyphen from an attribute name (if present), in an array format. * * Examples: @@ -307,7 +251,7 @@ public static function is_html_void_element( $tag_name ) { * 'wp-thing--and--thang' => array( 'wp-thing', 'and--thang' ) * * @param string $name The attribute name. - * @return array The resulting array + * @return array The resulting array. */ public static function parse_attribute_name( $name ) { return explode( '--', $name, 2 ); diff --git a/lib/experimental/interactivity-api/directive-processing.php b/lib/experimental/interactivity-api/directive-processing.php index 064fc8ea62cbb2..075d31d577634c 100644 --- a/lib/experimental/interactivity-api/directive-processing.php +++ b/lib/experimental/interactivity-api/directive-processing.php @@ -1,16 +1,16 @@ 'gutenberg_interactivity_process_wp_bind', - 'data-wp-context' => 'gutenberg_interactivity_process_wp_context', - 'data-wp-class' => 'gutenberg_interactivity_process_wp_class', - 'data-wp-style' => 'gutenberg_interactivity_process_wp_style', - 'data-wp-text' => 'gutenberg_interactivity_process_wp_text', - ); - $tags = new WP_Directive_Processor( $block_content ); - $tags = $tags->process_rendered_html( $tags, 'data-wp-', $directives ); - return $tags->get_updated_html(); + // Parse our own block delimiters for interactive and non-interactive blocks. + $parsed_blocks = parse_blocks( $block_content ); + $context = new WP_Directive_Context(); + $processed_content = ''; + + foreach ( $parsed_blocks as $parsed_block ) { + if ( 'core/interactivity-wrapper' === $parsed_block['blockName'] ) { + $processed_content .= gutenberg_process_interactive_block( $parsed_block, $context ); + } elseif ( 'core/non-interactivity-wrapper' === $parsed_block['blockName'] ) { + $processed_content .= gutenberg_process_non_interactive_block( $parsed_block, $context ); + } else { + $processed_content .= $parsed_block['innerHTML']; + } + } + return $processed_content; + } + + return $block_content; +} +add_filter( 'render_block', 'gutenberg_process_directives_in_root_blocks', 20, 2 ); +/** + * Marks the block as a children of an interactive block. + * + * @param array $parsed_block The parsed block. + * @param array $source_block The source block. + * @param WP_Block $parent_block The parent block. + */ +function gutenberg_mark_chidren_of_interactive_block( $parsed_block, $source_block, $parent_block ) { + if ( + isset( $parent_block ) && + isset( $parent_block->block_type->supports['interactivity'] ) && + $parent_block->block_type->supports['interactivity'] + ) { + WP_Directive_Processor::mark_children_of_interactive_block( $source_block ); } + return $parsed_block; +} +add_filter( 'render_block_data', 'gutenberg_mark_chidren_of_interactive_block', 100, 3 ); +/** + * Adds a comment delimiter to mark if the block is interactive or not. + * + * @param string $block_content The block content. + * @param array $block The full block, including name and attributes. + * @param WP_Block $block_instance The block instance. + */ +function gutenberg_mark_block_interactivity( $block_content, $block, $block_instance ) { + if ( + isset( $block_instance->block_type->supports['interactivity'] ) && + $block_instance->block_type->supports['interactivity'] + ) { + // Wraps the interactive block with a comment delimiter to be able to + // process it later. + return get_comment_delimited_block_content( + 'core/interactivity-wrapper', + array(), + $block_content + ); + } elseif ( WP_Directive_Processor::is_marked_as_children_of_interactive_block( $block ) ) { + // Wraps the non-interactive block with a comment delimiter to be able to + // skip it later. + return get_comment_delimited_block_content( + 'core/non-interactivity-wrapper', + array(), + $block_content + ); + } return $block_content; } -add_filter( 'render_block', 'gutenberg_process_directives_in_root_blocks', 10, 2 ); +add_filter( 'render_block', 'gutenberg_mark_block_interactivity', 10, 3 ); + +/** + * Traverses the HTML of an interactive block, searching for Interactivity API + * directives and processing them. For the inner blocks, it calls the + * corresponding function depending on the wrapper type. + * + * @param array $interactive_block The interactive block to process. + * @param WP_Directive_Context $context The context to use when processing. + * + * @return string The processed HTML. + */ +function gutenberg_process_interactive_block( $interactive_block, $context ) { + $block_index = 0; + $content = ''; + $interactive_inner_blocks = array(); + + foreach ( $interactive_block['innerContent'] as $inner_content ) { + if ( is_string( $inner_content ) ) { + $content .= $inner_content; + } else { + // This is an inner block. It may be an interactive block or a + // non-interactive block. + $content .= '
' . $content . '
';
+ },
+ 'supports' => array(
+ 'interactivity' => true,
+ ),
+ )
+ );
-function gutenberg_test_process_directives_helper_increment( $store ) {
- return $store['state']['count'] + $store['context']['count'];
-}
+ register_block_type(
+ 'test/context-level-2',
+ array(
+ 'render_callback' => function ( $attributes, $content ) {
+ return '' . $content . '
';
+ },
+ 'supports' => array(
+ 'interactivity' => true,
+ ),
+ )
+ );
-/**
- * Tests for the gutenberg_interactivity_process_rendered_html function.
- *
- * @group interactivity-api
- * @covers gutenberg_interactivity_process_rendered_html
- */
-class Tests_Process_Directives extends WP_UnitTestCase {
- public function test_correctly_call_attribute_directive_processor_on_closing_tag() {
-
- // PHPUnit cannot stub functions, only classes.
- $test_helper = $this->createMock( Helper_Class::class );
-
- $test_helper->expects( $this->exactly( 2 ) )
- ->method( 'process_foo_test' )
- ->with(
- $this->callback(
- function ( $p ) {
- return 'DIV' === $p->get_tag() && (
- // Either this is a closing tag...
- $p->is_tag_closer() ||
- // ...or it is an open tag, and has the directive attribute set.
- ( ! $p->is_tag_closer() && 'abc' === $p->get_attribute( 'foo-test' ) )
- );
- }
- )
- );
-
- $directives = array(
- 'foo-test' => array( $test_helper, 'process_foo_test' ),
+ register_block_type(
+ 'test/context-read-only',
+ array(
+ 'render_callback' => function () {
+ return '';
+ },
+ 'supports' => array(
+ 'interactivity' => true,
+ ),
+ )
);
- $markup = 'Example: ![]()
This is a test>
';
- $tags = new WP_Directive_Processor( $markup );
- $tags->process_rendered_html( $tags, 'foo-', $directives );
- }
+ register_block_type(
+ 'test/non-interactive-with-directive',
+ array(
+ 'render_callback' => function () {
+ return '';
+ },
+ )
+ );
- public function test_directives_with_double_hyphen_processed_correctly() {
- $test_helper = $this->createMock( Helper_Class::class );
- $test_helper->expects( $this->atLeastOnce() )
- ->method( 'process_foo_test' );
+ register_block_type(
+ 'test/context-level-with-manual-inner-block-rendering',
+ array(
+ 'render_callback' => function ( $attributes, $content, $block ) {
+ $inner_blocks_html = '';
+ foreach ( $block->inner_blocks as $inner_block ) {
+ $inner_blocks_html .= $inner_block->render();
+ }
+ return 'Here is a nested div
' . $inner_blocks_html . '
';
+ },
+ 'supports' => array(
+ 'interactivity' => true,
+ ),
+ )
+ );
- $directives = array(
- 'foo-test' => array( $test_helper, 'process_foo_test' ),
+ register_block_type(
+ 'test/directives-ordering',
+ array(
+ 'render_callback' => function () {
+ return '';
+ },
+ 'supports' => array(
+ 'interactivity' => true,
+ ),
+ )
);
+ }
- $markup = '';
- $tags = new WP_Directive_Processor( $markup );
- $tags->process_rendered_html( $tags, 'foo-', $directives );
+ public function tear_down() {
+ unregister_block_type( 'test/context-level-1' );
+ unregister_block_type( 'test/context-level-2' );
+ unregister_block_type( 'test/context-read-only' );
+ unregister_block_type( 'test/non-interactive-with-directive' );
+ unregister_block_type( 'test/context-level-with-manual-inner-block-rendering' );
+ unregister_block_type( 'test/directives-ordering' );
+ parent::tear_down();
}
public function test_interactivity_process_directives_in_root_blocks() {
-
$block_content =
'' .
'Welcome to WordPress. This is your first post. Edit or delete it, then start writing!
' . @@ -87,15 +103,11 @@ public function test_interactivity_process_directives_in_root_blocks() { 'Welcome to WordPress.
' . ''; - $parsed_block = parse_blocks( $block_content )[0]; - - $source_block = $parsed_block; - - $rendered_content = render_block( $parsed_block ); - + $parsed_block = parse_blocks( $block_content )[0]; + $source_block = $parsed_block; + $rendered_content = render_block( $parsed_block ); $parsed_block_second = parse_blocks( $block_content )[1]; - - $fake_parent_block = array(); + $fake_parent_block = array(); // Test that root block is intially emtpy. $this->assertEmpty( WP_Directive_Processor::$root_block ); @@ -117,16 +129,103 @@ public function test_interactivity_process_directives_in_root_blocks() { gutenberg_process_directives_in_root_blocks( $rendered_content, $parsed_block ); $this->assertEmpty( WP_Directive_Processor::$root_block ); } -} + public function test_directive_processing_of_interactive_block() { + $post_content = ''; + $rendered_blocks = do_blocks( $post_content ); + $p = new WP_HTML_Tag_Processor( $rendered_blocks ); + $p->next_tag( array( 'class_name' => 'level-1-input-1' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-1', $value ); + $p->next_tag( array( 'class_name' => 'level-1-input-2' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-1', $value ); + } + + public function test_directive_processing_two_interactive_blocks_at_same_level() { + $post_content = ''; + $rendered_blocks = do_blocks( $post_content ); + $p = new WP_HTML_Tag_Processor( $rendered_blocks ); + $p->next_tag( array( 'class_name' => 'level-1-input-1' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-1', $value ); + $p->next_tag( array( 'class_name' => 'level-1-input-2' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-1', $value ); + $p->next_tag( array( 'class_name' => 'level-2-input-1' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-2', $value ); + } + + public function test_directives_are_processed_at_tag_end() { + $post_content = ''; + $rendered_blocks = do_blocks( $post_content ); + $p = new WP_HTML_Tag_Processor( $rendered_blocks ); + $p->next_tag( array( 'class_name' => 'level-1-input-1' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-1', $value ); + $p->next_tag( array( 'class_name' => 'level-2-input-1' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-2', $value ); + $p->next_tag( array( 'class_name' => 'read-only-input-1' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-1', $value ); + $p->next_tag( array( 'class_name' => 'level-1-input-2' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-1', $value ); + } + + public function test_non_interactive_children_of_interactive_is_rendered() { + $post_content = 'Welcome
'; + $rendered_blocks = do_blocks( $post_content ); + $p = new WP_HTML_Tag_Processor( $rendered_blocks ); + $p->next_tag( array( 'class_name' => 'level-1-input-1' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-1', $value ); + $p->next_tag( array( 'class_name' => 'read-only-input-1' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-1', $value ); + $p->next_tag(); + $this->assertSame( 'P', $p->get_tag() ); + $p->next_tag( array( 'class_name' => 'level-1-input-2' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'level-1', $value ); + } + + public function test_non_interactive_blocks_are_not_processed() { + $post_content = ''; + $rendered_blocks = do_blocks( $post_content ); + $p = new WP_HTML_Tag_Processor( $rendered_blocks ); + $p->next_tag( array( 'class_name' => 'non-interactive-with-directive' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( null, $value ); + } + + public function test_non_interactive_blocks_with_manual_inner_block_rendering_are_not_processed() { + $post_content = ''; + $rendered_blocks = do_blocks( $post_content ); + $p = new WP_HTML_Tag_Processor( $rendered_blocks ); + $p->next_tag( array( 'class_name' => 'non-interactive-with-directive' ) ); + $value = $p->get_attribute( 'value' ); + $this->assertSame( null, $value ); + } + + public function test_directives_ordering() { + $post_content = ''; + $rendered_blocks = do_blocks( $post_content ); + $p = new WP_HTML_Tag_Processor( $rendered_blocks ); + $p->next_tag(); + + $value = $p->get_attribute( 'class' ); + $this->assertSame( 'other-class some-class', $value ); + + $value = $p->get_attribute( 'value' ); + $this->assertSame( 'some-value', $value ); + + $value = $p->get_attribute( 'style' ); + $this->assertSame( 'display: none;', $value ); + } -/** - * Tests for the gutenberg_interactivity_evaluate_reference function. - * - * @group interactivity-api - * @covers gutenberg_interactivity_evaluate_reference - */ -class Tests_Utils_Evaluate extends WP_UnitTestCase { public function test_evaluate_function_should_access_state() { // Init a simple store. wp_store( @@ -142,6 +241,7 @@ public function test_evaluate_function_should_access_state() { ), ) ); + $this->assertSame( 1, gutenberg_interactivity_evaluate_reference( 'state.core.number' ) ); $this->assertTrue( gutenberg_interactivity_evaluate_reference( 'state.core.bool' ) ); $this->assertSame( 'hi', gutenberg_interactivity_evaluate_reference( 'state.core.nested.string' ) ); @@ -158,10 +258,12 @@ public function test_evaluate_function_should_access_passed_context() { ), ), ); + $this->assertSame( 2, gutenberg_interactivity_evaluate_reference( 'context.local.number', $context ) ); $this->assertFalse( gutenberg_interactivity_evaluate_reference( 'context.local.bool', $context ) ); $this->assertTrue( gutenberg_interactivity_evaluate_reference( '!context.local.bool', $context ) ); $this->assertSame( 'bye', gutenberg_interactivity_evaluate_reference( 'context.local.nested.string', $context ) ); + // Previously defined state is also accessible. $this->assertSame( 1, gutenberg_interactivity_evaluate_reference( 'state.core.number' ) ); $this->assertTrue( gutenberg_interactivity_evaluate_reference( 'state.core.bool' ) ); @@ -174,7 +276,6 @@ public function test_evaluate_function_should_return_null_for_unresolved_paths() public function test_evaluate_function_should_execute_anonymous_functions() { $context = new WP_Directive_Context( array( 'count' => 2 ) ); - $helper = new Helper_Class(); wp_store( array( @@ -182,14 +283,13 @@ public function test_evaluate_function_should_execute_anonymous_functions() { 'count' => 3, ), 'selectors' => array( - 'anonymous_function' => function ( $store ) { + 'anonymous_function' => function ( $store ) { return $store['state']['count'] + $store['context']['count']; }, // Other types of callables should not be executed. - 'function_name' => 'gutenberg_test_process_directives_helper_increment', - 'class_method' => array( $helper, 'increment' ), - 'class_static_method' => 'Helper_Class::static_increment', - 'class_static_method_as_array' => array( 'Helper_Class', 'static_increment' ), + 'function_name' => 'gutenberg_test_process_directives_helper_increment', + 'class_method' => array( $this, 'increment' ), + 'class_static_method' => array( 'Tests_Process_Directives', 'static_increment' ), ), ) ); @@ -200,16 +300,12 @@ public function test_evaluate_function_should_execute_anonymous_functions() { gutenberg_interactivity_evaluate_reference( 'selectors.function_name', $context->get_context() ) ); $this->assertSame( - array( $helper, 'increment' ), + array( $this, 'increment' ), gutenberg_interactivity_evaluate_reference( 'selectors.class_method', $context->get_context() ) ); $this->assertSame( - 'Helper_Class::static_increment', + array( 'Tests_Process_Directives', 'static_increment' ), gutenberg_interactivity_evaluate_reference( 'selectors.class_static_method', $context->get_context() ) ); - $this->assertSame( - array( 'Helper_Class', 'static_increment' ), - gutenberg_interactivity_evaluate_reference( 'selectors.class_static_method_as_array', $context->get_context() ) - ); } } diff --git a/phpunit/experimental/interactivity-api/directives/wp-style-test.php b/phpunit/experimental/interactivity-api/directives/wp-style-test.php index 8942559b2fe89f..51468bd8a28141 100644 --- a/phpunit/experimental/interactivity-api/directives/wp-style-test.php +++ b/phpunit/experimental/interactivity-api/directives/wp-style-test.php @@ -14,16 +14,16 @@ */ class Tests_Directives_WpStyle extends WP_UnitTestCase { public function test_directive_adds_style() { - $markup = 'Test
';
+ $markup = 'Test
';
$tags = new WP_HTML_Tag_Processor( $markup );
$tags->next_tag();
- $context_before = new WP_Directive_Context( array( 'myblock' => array( 'color' => 'green' ) ) );
+ $context_before = new WP_Directive_Context( array( 'color' => 'green' ) );
$context = $context_before;
gutenberg_interactivity_process_wp_style( $tags, $context );
$this->assertSame(
- 'Test
',
+ 'Test
',
$tags->get_updated_html()
);
$this->assertStringContainsString( 'color: green;', $tags->get_attribute( 'style' ) );
@@ -31,11 +31,11 @@ public function test_directive_adds_style() {
}
public function test_directive_ignores_empty_style() {
- $markup = 'Test
';
+ $markup = 'Test
';
$tags = new WP_HTML_Tag_Processor( $markup );
$tags->next_tag();
- $context_before = new WP_Directive_Context( array( 'myblock' => array( 'color' => 'green' ) ) );
+ $context_before = new WP_Directive_Context( array( 'color' => 'green' ) );
$context = $context_before;
gutenberg_interactivity_process_wp_style( $tags, $context );
@@ -43,4 +43,21 @@ public function test_directive_ignores_empty_style() {
$this->assertStringNotContainsString( 'color: green;', $tags->get_attribute( 'style' ) );
$this->assertSame( $context_before->get_context(), $context->get_context(), 'data-wp-style directive changed context' );
}
+
+ public function test_directive_works_without_style_attribute() {
+ $markup = 'Test
';
+ $tags = new WP_HTML_Tag_Processor( $markup );
+ $tags->next_tag();
+
+ $context_before = new WP_Directive_Context( array( 'color' => 'green' ) );
+ $context = $context_before;
+ gutenberg_interactivity_process_wp_style( $tags, $context );
+
+ $this->assertSame(
+ 'Test
',
+ $tags->get_updated_html()
+ );
+ $this->assertSame( 'color: green;', $tags->get_attribute( 'style' ) );
+ $this->assertSame( $context_before->get_context(), $context->get_context(), 'data-wp-style directive changed context' );
+ }
}
diff --git a/phpunit/tests/fonts/font-library/wpFontFamilyUtils/hasFontMimeType.php b/phpunit/tests/fonts/font-library/wpFontFamilyUtils/hasFontMimeType.php
deleted file mode 100644
index e30c199612b8a9..00000000000000
--- a/phpunit/tests/fonts/font-library/wpFontFamilyUtils/hasFontMimeType.php
+++ /dev/null
@@ -1,61 +0,0 @@
-assertTrue( WP_Font_Family_Utils::has_font_mime_type( $font_file ) );
- }
-
- /**
- * Data provider.
- *
- * @return array[]
- */
- public function data_should_succeed_when_has_mime_type() {
- return array(
- 'ttf' => array( '/temp/piazzolla_400_italic.ttf' ),
- 'otf' => array( '/temp/piazzolla_400_italic.otf' ),
- 'woff' => array( '/temp/piazzolla_400_italic.woff' ),
- 'woff2' => array( '/temp/piazzolla_400_italic.woff2' ),
- );
- }
-
- /**
- * @dataProvider data_should_fail_when_mime_not_supported
- *
- * @param string $font_file Font file path.
- */
- public function test_should_fail_when_mime_not_supported( $font_file ) {
- $this->assertFalse( WP_Font_Family_Utils::has_font_mime_type( $font_file ) );
- }
-
- /**
- * Data provider.
- *
- * @return array[]
- */
- public function data_should_fail_when_mime_not_supported() {
- return array(
- 'exe' => array( '/temp/test.exe' ),
- 'md' => array( '/temp/license.md' ),
- 'php' => array( '/temp/test.php' ),
- 'txt' => array( '/temp/test.txt' ),
- 'zip' => array( '/temp/lato.zip' ),
- );
- }
-}
diff --git a/test/e2e/specs/editor/blocks/navigation-frontend-interactivity.spec.js b/test/e2e/specs/editor/blocks/navigation-frontend-interactivity.spec.js
index ac6094c3d3eac3..1d54f25b1a7cc9 100644
--- a/test/e2e/specs/editor/blocks/navigation-frontend-interactivity.spec.js
+++ b/test/e2e/specs/editor/blocks/navigation-frontend-interactivity.spec.js
@@ -112,7 +112,11 @@ test.describe( 'Navigation block - Frontend interactivity', () => {
// Test: overlay menu focuses on first element after opening
await expect( overlayMenuFirstElement ).toBeFocused();
- // Not Tested: overlay menu traps focus
+ // Test: overlay menu traps focus
+ await pageUtils.pressKeys( 'Tab', { times: 2, delay: 50 } );
+ await expect( closeMenuButton ).toBeFocused();
+ await pageUtils.pressKeys( 'Shift+Tab', { times: 2, delay: 50 } );
+ await expect( overlayMenuFirstElement ).toBeFocused();
// Test: overlay menu closes on click on close menu button
await closeMenuButton.click();
diff --git a/test/e2e/specs/editor/various/allowed-patterns.spec.js b/test/e2e/specs/editor/various/allowed-patterns.spec.js
new file mode 100644
index 00000000000000..78407217442de5
--- /dev/null
+++ b/test/e2e/specs/editor/various/allowed-patterns.spec.js
@@ -0,0 +1,79 @@
+/**
+ * WordPress dependencies
+ */
+const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' );
+
+test.describe( 'Allowed Patterns', () => {
+ test.beforeAll( async ( { requestUtils } ) => {
+ await requestUtils.activatePlugin( 'gutenberg-test-allowed-patterns' );
+ } );
+
+ test.afterAll( async ( { requestUtils } ) => {
+ await Promise.all( [
+ requestUtils.deactivatePlugin( 'gutenberg-test-allowed-patterns' ),
+ requestUtils.deactivatePlugin(
+ 'gutenberg-test-allowed-patterns-disable-blocks'
+ ),
+ ] );
+ } );
+
+ test( 'should show all patterns when blocks are not disabled', async ( {
+ admin,
+ page,
+ } ) => {
+ await admin.createNewPost();
+ await page
+ .getByRole( 'toolbar', { name: 'Document tools' } )
+ .getByRole( 'button', { name: 'Toggle block inserter' } )
+ .click();
+
+ await page
+ .getByRole( 'region', {
+ name: 'Block Library',
+ } )
+ .getByRole( 'searchbox', {
+ name: 'Search for blocks and patterns',
+ } )
+ .fill( 'Test:' );
+
+ await expect(
+ page
+ .getByRole( 'listbox', { name: 'Block patterns' } )
+ .getByRole( 'option' )
+ ).toHaveText( [
+ 'Test: Single heading',
+ 'Test: Single paragraph',
+ 'Test: Paragraph inside group',
+ ] );
+ } );
+
+ test( 'should show only allowed patterns when blocks are disabled', async ( {
+ admin,
+ page,
+ requestUtils,
+ } ) => {
+ await requestUtils.activatePlugin(
+ 'gutenberg-test-allowed-patterns-disable-blocks'
+ );
+ await admin.createNewPost();
+ await page
+ .getByRole( 'toolbar', { name: 'Document tools' } )
+ .getByRole( 'button', { name: 'Toggle block inserter' } )
+ .click();
+
+ await page
+ .getByRole( 'region', {
+ name: 'Block Library',
+ } )
+ .getByRole( 'searchbox', {
+ name: 'Search for blocks and patterns',
+ } )
+ .fill( 'Test:' );
+
+ await expect(
+ page
+ .getByRole( 'listbox', { name: 'Block patterns' } )
+ .getByRole( 'option' )
+ ).toHaveText( [ 'Test: Single heading' ] );
+ } );
+} );