mirror of
git://develop.git.wordpress.org/
synced 2025-04-11 15:42:03 +02:00
Editor: Fix complex variation selectors when using selectors API.
Fixes a bug in the manipulation of selectors for block style variations that would result in an incorrect selector and fail to match the appropriate elements on the frontend. Props aaronrobertshaw, ramonopoly, joemcgill. Fixes #62471. git-svn-id: https://develop.svn.wordpress.org/trunk@59814 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
parent
108af60daf
commit
ac2eeb9868
@ -2850,8 +2850,14 @@ class WP_Theme_JSON {
|
||||
|
||||
// Combine selectors with style variation's selector and add to overall style variation declarations.
|
||||
foreach ( $variation_declarations as $current_selector => $new_declarations ) {
|
||||
// If current selector includes block classname, remove it but leave the whitespace in.
|
||||
$shortened_selector = str_replace( $block_metadata['selector'] . ' ', ' ', $current_selector );
|
||||
/*
|
||||
* Clean up any whitespace between comma separated selectors.
|
||||
* This prevents these spaces breaking compound selectors such as:
|
||||
* - `.wp-block-list:not(.wp-block-list .wp-block-list)`
|
||||
* - `.wp-block-image img, .wp-block-image.my-class img`
|
||||
*/
|
||||
$clean_current_selector = preg_replace( '/,\s+/', ',', $current_selector );
|
||||
$shortened_selector = str_replace( $block_metadata['selector'], '', $clean_current_selector );
|
||||
|
||||
// Prepend the variation selector to the current selector.
|
||||
$split_selectors = explode( ',', $shortened_selector );
|
||||
|
@ -4627,6 +4627,80 @@ class Tests_Theme_wpThemeJson extends WP_UnitTestCase {
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Tests that block style variation selectors are generated correctly
|
||||
* for block selectors of various structures.
|
||||
*
|
||||
* @ticket 62471
|
||||
*/
|
||||
public function test_get_styles_for_block_with_style_variations_and_custom_selectors() {
|
||||
register_block_type(
|
||||
'test/milk',
|
||||
array(
|
||||
'api_version' => 3,
|
||||
'selectors' => array(
|
||||
'root' => '.milk',
|
||||
'color' => '.wp-block-test-milk .liquid, .wp-block-test-milk:not(.spoiled), .wp-block-test-milk.in-bottle',
|
||||
),
|
||||
)
|
||||
);
|
||||
|
||||
register_block_style(
|
||||
'test/milk',
|
||||
array(
|
||||
'name' => 'chocolate',
|
||||
'label' => 'Chocolate',
|
||||
)
|
||||
);
|
||||
|
||||
$theme_json = new WP_Theme_JSON(
|
||||
array(
|
||||
'version' => WP_Theme_JSON::LATEST_SCHEMA,
|
||||
'styles' => array(
|
||||
'blocks' => array(
|
||||
'test/milk' => array(
|
||||
'color' => array(
|
||||
'background' => 'white',
|
||||
),
|
||||
'variations' => array(
|
||||
'chocolate' => array(
|
||||
'color' => array(
|
||||
'background' => '#35281E',
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
)
|
||||
);
|
||||
|
||||
$metadata = array(
|
||||
'name' => 'test/milk',
|
||||
'path' => array( 'styles', 'blocks', 'test/milk' ),
|
||||
'selector' => '.wp-block-test-milk',
|
||||
'selectors' => array(
|
||||
'color' => '.wp-block-test-milk .liquid, .wp-block-test-milk:not(.spoiled), .wp-block-test-milk.in-bottle',
|
||||
),
|
||||
'variations' => array(
|
||||
'chocolate' => array(
|
||||
'path' => array( 'styles', 'blocks', 'test/milk', 'variations', 'chocolate' ),
|
||||
'selector' => '.is-style-chocolate.wp-block-test-milk',
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
$actual_styles = $theme_json->get_styles_for_block( $metadata );
|
||||
$default_styles = ':root :where(.wp-block-test-milk .liquid, .wp-block-test-milk:not(.spoiled), .wp-block-test-milk.in-bottle){background-color: white;}';
|
||||
$variation_styles = ':root :where(.is-style-chocolate.wp-block-test-milk .liquid,.is-style-chocolate.wp-block-test-milk:not(.spoiled),.is-style-chocolate.wp-block-test-milk.in-bottle){background-color: #35281E;}';
|
||||
$expected = $default_styles . $variation_styles;
|
||||
|
||||
unregister_block_style( 'test/milk', 'chocolate' );
|
||||
unregister_block_type( 'test/milk' );
|
||||
|
||||
$this->assertSame( $expected, $actual_styles );
|
||||
}
|
||||
|
||||
public function test_block_style_variations() {
|
||||
wp_set_current_user( static::$administrator_id );
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user