WordPress-C
/
WordPress
mirror of https://github.com/WordPress/WordPress.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Editor: Fix block custom CSS pseudo element selectors in global styles. 

Fixes a regression introduced in [58241] where selectors with pseudo elements are wrapped within `:where()` causing malformed CSS and the CSS rule(s) not being applied.

When processing custom CSS for blocks, this changeset:

* Strips the pseudo-elements from the original nested selector, performs the required wrapping in `:root :where`, then re-appends the pseudo-element selector with its leading combinators if present.
* Removes empty CSS rules.

It includes the PHP changes.

Reference:
* PHP changes from [https://github.com/WordPress/gutenberg/pull/63980 Gutenberg PR 63980].

Follow-up to [58241], [56812], [55216].

Props aaronrobertshaw, wongjn, harlet7, dballari, ramonopoly, andrewserong, aristath, hellofromTonya.
Fixes #61769.
Built from https://develop.svn.wordpress.org/trunk@58896


git-svn-id: http://core.svn.wordpress.org/trunk@58292 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
hellofromTonya 2024-08-14 18:57:19 +00:00
parent 87ec4292ae
commit 713e76f16b
2 changed files with 25 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
wp-includes/class-wp-theme-json.php
View File

@ -1448,9 +1448,16 @@ class WP_Theme_JSON {
protected function process_blocks_custom_css( $css, $selector ) {
$processed_css = '';
if ( empty( $css ) ) {
return $processed_css;
}
// Split CSS nested rules.
$parts = explode( '&', $css );
foreach ( $parts as $part ) {
if ( empty( $part ) ) {
continue;
}
$is_root_css = ( ! str_contains( $part, '{' ) );
if ( $is_root_css ) {
// If the part doesn't contain braces, it applies to the root level.
@ -1463,11 +1470,25 @@ class WP_Theme_JSON {
}
$nested_selector = $part[0];
$css_value = $part[1];
$part_selector = str_starts_with( $nested_selector, ' ' )
/*
* Handle pseudo elements such as ::before, ::after etc. Regex will also
* capture any leading combinator such as >, +, or ~, as well as spaces.
* This allows pseudo elements as descendants e.g. `.parent ::before`.
*/
$matches = array();
$has_pseudo_element = preg_match( '/([>+~\s]*::[a-zA-Z-]+)/', $nested_selector, $matches );
$pseudo_part = $has_pseudo_element ? $matches[1] : '';
$nested_selector = $has_pseudo_element ? str_replace( $pseudo_part, '', $nested_selector ) : $nested_selector;
// Finalize selector and re-append pseudo element if required.
$part_selector = str_starts_with( $nested_selector, ' ' )
? static::scope_selector( $selector, $nested_selector )
: static::append_to_selector( $selector, $nested_selector );
$final_selector = ":root :where($part_selector)";
$processed_css .= $final_selector . '{' . trim( $css_value ) . '}';}
$final_selector = ":root :where($part_selector)$pseudo_part";
$processed_css .= $final_selector . '{' . trim( $css_value ) . '}';
}
}
return $processed_css;
}

2
wp-includes/version.php
View File

@ -16,7 +16,7 @@
*
* @global string $wp_version
*/
$wp_version = '6.7-alpha-58895';
$wp_version = '6.7-alpha-58896';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.