From eebfaa1470f61d60b0093afb4209002d376f5567 Mon Sep 17 00:00:00 2001 From: MaggieCabrera Date: Tue, 9 Aug 2022 14:08:31 +0200 Subject: [PATCH 1/3] pseudoelements supports on button elements --- .../wordpress-6.1/class-wp-theme-json-6-1.php | 25 +++++++++++++++++-- 1 file changed, 23 insertions(+), 2 deletions(-) diff --git a/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php b/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php index a68e2dbc427167..0c04f91e4dac77 100644 --- a/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php +++ b/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php @@ -22,6 +22,7 @@ class WP_Theme_JSON_6_1 extends WP_Theme_JSON_6_0 { */ const VALID_ELEMENT_PSEUDO_SELECTORS = array( 'link' => array( ':hover', ':focus', ':active', ':visited' ), + 'button' => array( ':hover', ':focus', ':active', ':visited' ) ); /** @@ -481,9 +482,19 @@ protected static function get_style_nodes( $theme_json, $selectors = array() ) { foreach ( static::VALID_ELEMENT_PSEUDO_SELECTORS[ $element ] as $pseudo_selector ) { if ( isset( $theme_json['styles']['elements'][ $element ][ $pseudo_selector ] ) ) { + + $element_selector = []; + // This converts selectors like '.wp-element-button, .wp-block-button__link' + // to an array, so that the pseudo selector is added to both parts of the selector. + $el_selectors = explode( ',', static::ELEMENTS[ $element ] ); + foreach ( $el_selectors as $el_selector_item ) { + $element_selector[] = $el_selector_item . $pseudo_selector; + } + $element_selector = implode( ',', $element_selector ); + $nodes[] = array( 'path' => array( 'styles', 'elements', $element ), - 'selector' => static::ELEMENTS[ $element ] . $pseudo_selector, + 'selector' => $element_selector, ); } } @@ -566,9 +577,19 @@ private static function get_block_nodes( $theme_json, $selectors = array() ) { if ( array_key_exists( $element, static::VALID_ELEMENT_PSEUDO_SELECTORS ) ) { foreach ( static::VALID_ELEMENT_PSEUDO_SELECTORS[ $element ] as $pseudo_selector ) { if ( isset( $theme_json['styles']['blocks'][ $name ]['elements'][ $element ][ $pseudo_selector ] ) ) { + + $block_selector = []; + // This converts selectors like '.wp-element-button, .wp-block-button__link' + // to an array, so that the pseudo selector is added to both parts of the selector. + $bl_selectors = explode( ',', $selectors[ $name ]['elements'][ $element ] ); + foreach ( $bl_selectors as $bl_selector_item ) { + $block_selector[] = $bl_selector_item . $pseudo_selector; + } + $block_selector = implode( ',', $block_selector ); + $nodes[] = array( 'path' => array( 'styles', 'blocks', $name, 'elements', $element ), - 'selector' => $selectors[ $name ]['elements'][ $element ] . $pseudo_selector, + 'selector' => $block_selector, ); } } From 4bd65248c3f8a05d6b07ebbb969e9408c2560d11 Mon Sep 17 00:00:00 2001 From: MaggieCabrera Date: Thu, 11 Aug 2022 16:13:31 +0200 Subject: [PATCH 2/3] refactor into a utility function --- .../wordpress-6.1/class-wp-theme-json-6-1.php | 48 +++++++++++-------- 1 file changed, 27 insertions(+), 21 deletions(-) diff --git a/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php b/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php index 0c04f91e4dac77..edf3fe71894656 100644 --- a/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php +++ b/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php @@ -334,6 +334,29 @@ public static function remove_insecure_properties( $theme_json ) { ), ); + /* + * This converts selectors like '.wp-element-button, .wp-block-button__link' + * to an array, so that the block selector is added to both parts of the selector. + * + * @param string $element The string with all the element's selectors + * @param string $selector The string we want to append to the selectors + * @param string $position The position we wand to append the selector in + * @return string element selector. + */ + private static function appendToSelector( $element, $selector, $position = 0 ) { + $element_selector = array(); + $el_selectors = explode( ',', $element ); + foreach ( $el_selectors as $el_selector_item ) { + if($position == 0) { + $element_selector[] = $selector . $el_selector_item; + } else { + $element_selector[] = $el_selector_item . $selector; + } + } + $element_selector = implode( ',', $element_selector ); + return $element_selector; + } + /** * Returns the metadata for each block. * @@ -417,14 +440,9 @@ protected static function get_blocks_metadata() { break; } - // This converts selectors like '.wp-element-button, .wp-block-button__link' - // to an array, so that the block selector is added to both parts of the selector. - $el_selectors = explode( ',', $el_selector ); - foreach ( $el_selectors as $el_selector_item ) { - $element_selector[] = $selector . ' ' . $el_selector_item; - } + $element_selector = static::appendToSelector($el_selector, $selector . ' ', 0); } - static::$blocks_metadata[ $block_name ]['elements'][ $el_name ] = implode( ',', $element_selector ); + static::$blocks_metadata[ $block_name ]['elements'][ $el_name ] = $element_selector; } } @@ -484,13 +502,7 @@ protected static function get_style_nodes( $theme_json, $selectors = array() ) { if ( isset( $theme_json['styles']['elements'][ $element ][ $pseudo_selector ] ) ) { $element_selector = []; - // This converts selectors like '.wp-element-button, .wp-block-button__link' - // to an array, so that the pseudo selector is added to both parts of the selector. - $el_selectors = explode( ',', static::ELEMENTS[ $element ] ); - foreach ( $el_selectors as $el_selector_item ) { - $element_selector[] = $el_selector_item . $pseudo_selector; - } - $element_selector = implode( ',', $element_selector ); + $element_selector = static::appendToSelector(static::ELEMENTS[ $element ], $pseudo_selector, 1); $nodes[] = array( 'path' => array( 'styles', 'elements', $element ), @@ -579,13 +591,7 @@ private static function get_block_nodes( $theme_json, $selectors = array() ) { if ( isset( $theme_json['styles']['blocks'][ $name ]['elements'][ $element ][ $pseudo_selector ] ) ) { $block_selector = []; - // This converts selectors like '.wp-element-button, .wp-block-button__link' - // to an array, so that the pseudo selector is added to both parts of the selector. - $bl_selectors = explode( ',', $selectors[ $name ]['elements'][ $element ] ); - foreach ( $bl_selectors as $bl_selector_item ) { - $block_selector[] = $bl_selector_item . $pseudo_selector; - } - $block_selector = implode( ',', $block_selector ); + $block_selector = static::appendToSelector($selectors[ $name ]['elements'][ $element ], $pseudo_selector, 1); $nodes[] = array( 'path' => array( 'styles', 'blocks', $name, 'elements', $element ), From 40969081f72b85063a0d3d1ee4a7911d40b08401 Mon Sep 17 00:00:00 2001 From: MaggieCabrera Date: Thu, 11 Aug 2022 16:17:20 +0200 Subject: [PATCH 3/3] linting --- .../wordpress-6.1/class-wp-theme-json-6-1.php | 28 +++++++++---------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php b/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php index edf3fe71894656..07ca4bf40becb8 100644 --- a/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php +++ b/lib/compat/wordpress-6.1/class-wp-theme-json-6-1.php @@ -21,8 +21,8 @@ class WP_Theme_JSON_6_1 extends WP_Theme_JSON_6_0 { * Note: this will effect both top level and block level elements. */ const VALID_ELEMENT_PSEUDO_SELECTORS = array( - 'link' => array( ':hover', ':focus', ':active', ':visited' ), - 'button' => array( ':hover', ':focus', ':active', ':visited' ) + 'link' => array( ':hover', ':focus', ':active', ':visited' ), + 'button' => array( ':hover', ':focus', ':active', ':visited' ), ); /** @@ -334,20 +334,20 @@ public static function remove_insecure_properties( $theme_json ) { ), ); - /* + /** * This converts selectors like '.wp-element-button, .wp-block-button__link' * to an array, so that the block selector is added to both parts of the selector. - * - * @param string $element The string with all the element's selectors - * @param string $selector The string we want to append to the selectors - * @param string $position The position we wand to append the selector in + * + * @param string $element The string with all the element's selectors. + * @param string $selector The string we want to append to the selectors. + * @param string $position The position we wand to append the selector in. * @return string element selector. */ private static function appendToSelector( $element, $selector, $position = 0 ) { $element_selector = array(); - $el_selectors = explode( ',', $element ); + $el_selectors = explode( ',', $element ); foreach ( $el_selectors as $el_selector_item ) { - if($position == 0) { + if ( 0 === $position ) { $element_selector[] = $selector . $el_selector_item; } else { $element_selector[] = $el_selector_item . $selector; @@ -440,7 +440,7 @@ protected static function get_blocks_metadata() { break; } - $element_selector = static::appendToSelector($el_selector, $selector . ' ', 0); + $element_selector = static::appendToSelector( $el_selector, $selector . ' ', 0 ); } static::$blocks_metadata[ $block_name ]['elements'][ $el_name ] = $element_selector; } @@ -501,8 +501,8 @@ protected static function get_style_nodes( $theme_json, $selectors = array() ) { if ( isset( $theme_json['styles']['elements'][ $element ][ $pseudo_selector ] ) ) { - $element_selector = []; - $element_selector = static::appendToSelector(static::ELEMENTS[ $element ], $pseudo_selector, 1); + $element_selector = array(); + $element_selector = static::appendToSelector( static::ELEMENTS[ $element ], $pseudo_selector, 1 ); $nodes[] = array( 'path' => array( 'styles', 'elements', $element ), @@ -590,8 +590,8 @@ private static function get_block_nodes( $theme_json, $selectors = array() ) { foreach ( static::VALID_ELEMENT_PSEUDO_SELECTORS[ $element ] as $pseudo_selector ) { if ( isset( $theme_json['styles']['blocks'][ $name ]['elements'][ $element ][ $pseudo_selector ] ) ) { - $block_selector = []; - $block_selector = static::appendToSelector($selectors[ $name ]['elements'][ $element ], $pseudo_selector, 1); + $block_selector = array(); + $block_selector = static::appendToSelector( $selectors[ $name ]['elements'][ $element ], $pseudo_selector, 1 ); $nodes[] = array( 'path' => array( 'styles', 'blocks', $name, 'elements', $element ),