From 8de0395e813346e554286b4c82f278e8a65ac146 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= Date: Tue, 25 May 2021 13:43:30 +0200 Subject: [PATCH 1/3] Fix and test case for presets per block --- lib/class-wp-theme-json-gutenberg.php | 24 +++++++++++++++++++++++- phpunit/class-wp-theme-json-test.php | 27 +++++++++++++++++++++++++++ 2 files changed, 50 insertions(+), 1 deletion(-) diff --git a/lib/class-wp-theme-json-gutenberg.php b/lib/class-wp-theme-json-gutenberg.php index 5a7765ef62bedb..9a2c15d6a23491 100644 --- a/lib/class-wp-theme-json-gutenberg.php +++ b/lib/class-wp-theme-json-gutenberg.php @@ -619,6 +619,28 @@ private static function compute_style_properties( $styles ) { return $declarations; } + /** + * Function that appends a sub-selector to a existing one. + * + * Given the compounded $selector "h1, h2, h3" + * and the $to_append selector ".some-class" the result will be + * "h1.some-class, h2.some-class, h3.some-class". + * + * @param string $selector + * @param string $to_append + * + * @return string + */ + private static function append_to_selector( $selector, $to_append ) { + $new_selectors = []; + $selectors = explode( ',', $selector ); + foreach ( $selectors as $sel ) { + $new_selectors[] = $sel . $to_append; + } + + return implode( ',', $new_selectors ); + } + /** * Given a settings array, it returns the generated rulesets * for the preset classes. @@ -641,7 +663,7 @@ private static function compute_preset_classes( $settings, $selector ) { foreach ( $values as $value ) { foreach ( $preset['classes'] as $class ) { $stylesheet .= self::to_ruleset( - $selector . '.has-' . $value['slug'] . '-' . $class['class_suffix'], + self::append_to_selector( $selector, '.has-' . $value['slug'] . '-' . $class['class_suffix'] ), array( array( 'name' => $class['property_name'], diff --git a/phpunit/class-wp-theme-json-test.php b/phpunit/class-wp-theme-json-test.php index 58260c4b9045a9..e6aa47d796d8cd 100644 --- a/phpunit/class-wp-theme-json-test.php +++ b/phpunit/class-wp-theme-json-test.php @@ -174,6 +174,33 @@ function test_get_stylesheet() { ); } + function test_get_stylesheet_preset_classes_work_with_compounded_selectors() { + $theme_json = new WP_Theme_JSON_Gutenberg( + array( + 'version' => WP_Theme_JSON_Gutenberg::LATEST_SCHEMA, + 'settings' => array( + 'blocks' => array( + 'core/heading' => array( + 'color' => array( + 'palette' => array( + array( + 'slug' => 'white', + 'color' => '#fff', + ), + ), + ), + ), + ), + ), + ) + ); + + $this->assertEquals( + 'h1.has-white-color, h2.has-white-color, h3.has-white-color, h4.has-white-color, h5.has-white-color, h6.has-white-color {color: #fff !important;}h1.has-white-background-color, h2.has-white-background-color, h3.has-white-background-color, h4.has-white-background-color, h5.has-white-background-color, h6.has-white-background-color {background-color: #fff !important;}h1.has-white-border-color, h2.has-white-border-color, h3.has-white-border-color, h4.has-white-border-color, h5.has-white-border-color, h6.has-white-border-color {border-color: #fff !important;}', + $theme_json->get_stylesheet( 'block_styles' ) + ); + } + function test_get_stylesheet_preset_rules_come_after_block_rules() { $theme_json = new WP_Theme_JSON_Gutenberg( array( From d125169e22a07ea669f21fdfa4e347760add1222 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= Date: Wed, 26 May 2021 09:11:04 +0200 Subject: [PATCH 2/3] Fix linting issues --- lib/class-wp-theme-json-gutenberg.php | 6 +++--- phpunit/class-wp-theme-json-test.php | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/lib/class-wp-theme-json-gutenberg.php b/lib/class-wp-theme-json-gutenberg.php index 9a2c15d6a23491..f883bbe2e128eb 100644 --- a/lib/class-wp-theme-json-gutenberg.php +++ b/lib/class-wp-theme-json-gutenberg.php @@ -626,13 +626,13 @@ private static function compute_style_properties( $styles ) { * and the $to_append selector ".some-class" the result will be * "h1.some-class, h2.some-class, h3.some-class". * - * @param string $selector - * @param string $to_append + * @param string $selector Original selector. + * @param string $to_append Selector to append. * * @return string */ private static function append_to_selector( $selector, $to_append ) { - $new_selectors = []; + $new_selectors = array(); $selectors = explode( ',', $selector ); foreach ( $selectors as $sel ) { $new_selectors[] = $sel . $to_append; diff --git a/phpunit/class-wp-theme-json-test.php b/phpunit/class-wp-theme-json-test.php index e6aa47d796d8cd..147985e58621ee 100644 --- a/phpunit/class-wp-theme-json-test.php +++ b/phpunit/class-wp-theme-json-test.php @@ -177,7 +177,7 @@ function test_get_stylesheet() { function test_get_stylesheet_preset_classes_work_with_compounded_selectors() { $theme_json = new WP_Theme_JSON_Gutenberg( array( - 'version' => WP_Theme_JSON_Gutenberg::LATEST_SCHEMA, + 'version' => WP_Theme_JSON_Gutenberg::LATEST_SCHEMA, 'settings' => array( 'blocks' => array( 'core/heading' => array( From 72becc6516e1026a7ec54ece7e96903e54de945b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= Date: Wed, 26 May 2021 09:18:48 +0200 Subject: [PATCH 3/3] Fix spaces in tests --- phpunit/class-wp-theme-json-test.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/phpunit/class-wp-theme-json-test.php b/phpunit/class-wp-theme-json-test.php index 147985e58621ee..fa3a4931a561b2 100644 --- a/phpunit/class-wp-theme-json-test.php +++ b/phpunit/class-wp-theme-json-test.php @@ -196,7 +196,7 @@ function test_get_stylesheet_preset_classes_work_with_compounded_selectors() { ); $this->assertEquals( - 'h1.has-white-color, h2.has-white-color, h3.has-white-color, h4.has-white-color, h5.has-white-color, h6.has-white-color {color: #fff !important;}h1.has-white-background-color, h2.has-white-background-color, h3.has-white-background-color, h4.has-white-background-color, h5.has-white-background-color, h6.has-white-background-color {background-color: #fff !important;}h1.has-white-border-color, h2.has-white-border-color, h3.has-white-border-color, h4.has-white-border-color, h5.has-white-border-color, h6.has-white-border-color {border-color: #fff !important;}', + 'h1.has-white-color,h2.has-white-color,h3.has-white-color,h4.has-white-color,h5.has-white-color,h6.has-white-color{color: #fff !important;}h1.has-white-background-color,h2.has-white-background-color,h3.has-white-background-color,h4.has-white-background-color,h5.has-white-background-color,h6.has-white-background-color{background-color: #fff !important;}h1.has-white-border-color,h2.has-white-border-color,h3.has-white-border-color,h4.has-white-border-color,h5.has-white-border-color,h6.has-white-border-color{border-color: #fff !important;}', $theme_json->get_stylesheet( 'block_styles' ) ); }