vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-08-11 12:20:22 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Editor: disable default style engine optimisation.

Browse Source 
Stops style engine from combining CSS selectors by default so that rule order is preserved.

Props ramonopoly, rajinsharwar, timdix, costdev, audrasjb, SergeyBiryukov, JeffPaul, mukesh27.
Fixes #58811.


git-svn-id: https://develop.svn.wordpress.org/trunk@56574 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Isabel Brison
2023-09-14 04:54:22 +00:00
parent f43aaaf741
commit 1a168a199e
6 changed files with 36 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/wp-includes/script-loader.php
+1 -1
View File
@@ -3053,7 +3053,7 @@ function wp_enqueue_block_support_styles( $style, $priority = 10 ) {
* Default empty array.
*
* @type bool $optimize Whether to optimize the CSS output, e.g., combine rules.
* Default true.
* Default false.
* @type bool $prettify Whether to add new lines and indents to output.
* Default to whether the `SCRIPT_DEBUG` constant is defined.
* }
src/wp-includes/style-engine.php
+2 -2
View File
@@ -130,7 +130,7 @@ function wp_style_engine_get_styles( $block_styles, $options = array() ) {
* e.g. 'block-supports' or 'global-styles'. Default 'block-supports'.
* When set, the style engine will attempt to store the CSS rules.
* @type bool $optimize Whether to optimize the CSS output, e.g. combine rules.
* Default true.
* Default false.
* @type bool $prettify Whether to add new lines and indents to output.
* Defaults to whether the `SCRIPT_DEBUG` constant is defined.
* }
@@ -178,7 +178,7 @@ function wp_style_engine_get_stylesheet_from_css_rules( $css_rules, $options = a
* Optional. An array of options. Default empty array.
*
* @type bool $optimize Whether to optimize the CSS output, e.g. combine rules.
* Default true.
* Default false.
* @type bool $prettify Whether to add new lines and indents to output.
* Defaults to whether the `SCRIPT_DEBUG` constant is defined.
* }
src/wp-includes/style-engine/class-wp-style-engine-processor.php
+3 -2
View File
@@ -85,12 +85,13 @@ class WP_Style_Engine_Processor {
* Gets the CSS rules as a string.
*
* @since 6.1.0
* @since 6.4.0 The Optimization is no longer the default.
*
* @param array $options {
* Optional. An array of options. Default empty array.
*
* @type bool $optimize Whether to optimize the CSS output, e.g. combine rules.
* Default true.
* Default false.
* @type bool $prettify Whether to add new lines and indents to output.
* Defaults to whether the `SCRIPT_DEBUG` constant is defined.
* }
@@ -98,7 +99,7 @@ class WP_Style_Engine_Processor {
*/
public function get_css( $options = array() ) {
$defaults = array(
'optimize' => true,
'optimize' => false,
'prettify' => defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG,
);
$options = wp_parse_args( $options, $defaults );
src/wp-includes/style-engine/class-wp-style-engine.php
+1 -1
View File
@@ -624,7 +624,7 @@ final class WP_Style_Engine {
* e.g. 'block-supports' or 'global-styles'. Default 'block-supports'.
* When set, the style engine will attempt to store the CSS rules.
* @type bool $optimize Whether to optimize the CSS output, e.g. combine rules.
* Default true.
* Default false.
* @type bool $prettify Whether to add new lines and indents to output.
* Defaults to whether the `SCRIPT_DEBUG` constant is defined.
* }
tests/phpunit/tests/style-engine/styleEngine.php
+2 -1
View File
@@ -654,6 +654,7 @@ class Tests_wpStyleEngine extends WP_UnitTestCase {
/**
* Tests that incoming styles are deduped and merged.
*
* @ticket 58811
* @ticket 56467
*
* @covers ::wp_style_engine_get_stylesheet_from_css_rules
@@ -697,6 +698,6 @@ class Tests_wpStyleEngine extends WP_UnitTestCase {
$compiled_stylesheet = wp_style_engine_get_stylesheet_from_css_rules( $css_rules, array( 'prettify' => false ) );
$this->assertSame( '.gandalf{color:white;height:190px;border-style:dotted;padding:10px;margin-bottom:100px;}.dumbledore,.rincewind{color:grey;height:90px;border-style:dotted;}', $compiled_stylesheet );
$this->assertSame( '.gandalf{color:white;height:190px;border-style:dotted;padding:10px;margin-bottom:100px;}.dumbledore{color:grey;height:90px;border-style:dotted;}.rincewind{color:grey;height:90px;border-style:dotted;}', $compiled_stylesheet );
}
}
tests/phpunit/tests/style-engine/wpStyleEngineProcessor.php
+27 -9
View File
@@ -81,16 +81,19 @@ class Tests_Style_Engine_wpStyleEngineProcessor extends WP_UnitTestCase {
$a_wonderful_processor = new WP_Style_Engine_Processor();
$a_wonderful_processor->add_rules( array( $a_wonderful_css_rule, $a_very_wonderful_css_rule, $a_more_wonderful_css_rule ) );
$expected = '.a-more-wonderful-rule {
font-family: Wonderful sans;
font-size: 1em;
$expected = '.a-wonderful-rule {
color: var(--wonderful-color);
background-color: orange;
}
.a-wonderful-rule,
.a-very_wonderful-rule {
color: var(--wonderful-color);
background-color: orange;
}
.a-more-wonderful-rule {
font-family: Wonderful sans;
font-size: 1em;
background-color: orange;
}
';
$this->assertSameIgnoreEOL(
$expected,
@@ -184,6 +187,9 @@ class Tests_Style_Engine_wpStyleEngineProcessor extends WP_UnitTestCase {
/**
* Tests printing out 'unoptimized' CSS, that is, uncombined selectors and duplicate CSS rules.
*
* This is the default.
*
* @ticket 58811
* @ticket 56467
*
* @covers ::get_css
@@ -230,11 +236,12 @@ class Tests_Style_Engine_wpStyleEngineProcessor extends WP_UnitTestCase {
/**
* Tests that 'optimized' CSS is output, that is, that duplicate CSS rules are combined under their corresponding selectors.
*
* @ticket 58811
* @ticket 56467
*
* @covers ::get_css
*/
public function test_should_optimize_css_output_by_default() {
public function test_should_not_optimize_css_output_by_default() {
$a_sweet_rule = new WP_Style_Engine_CSS_Rule(
'.a-sweet-rule',
array(
@@ -255,14 +262,15 @@ class Tests_Style_Engine_wpStyleEngineProcessor extends WP_UnitTestCase {
$a_sweet_processor->add_rules( array( $a_sweet_rule, $a_sweeter_rule ) );
$this->assertSame(
'.a-sweet-rule,#an-even-sweeter-rule > marquee{color:var(--sweet-color);background-color:purple;}',
'.a-sweet-rule{color:var(--sweet-color);background-color:purple;}#an-even-sweeter-rule > marquee{color:var(--sweet-color);background-color:purple;}',
$a_sweet_processor->get_css( array( 'prettify' => false ) )
);
}
/**
* Tests that incoming CSS rules are merged with existing CSS rules.
* Tests that incoming CSS rules are optimized and merged with existing CSS rules.
*
* @ticket 58811
* @ticket 56467
*
* @covers ::add_rules
@@ -286,7 +294,12 @@ class Tests_Style_Engine_wpStyleEngineProcessor extends WP_UnitTestCase {
$this->assertSame(
'.a-lovely-rule,.a-lovelier-rule{border-color:purple;}',
$a_lovely_processor->get_css( array( 'prettify' => false ) ),
$a_lovely_processor->get_css(
array(
'prettify' => false,
'optimize' => true,
)
),
'Return value of get_css() does not match expectations when combining 2 CSS rules'
);
@@ -308,7 +321,12 @@ class Tests_Style_Engine_wpStyleEngineProcessor extends WP_UnitTestCase {
$this->assertSame(
'.a-lovely-rule,.a-lovelier-rule,.a-most-lovely-rule,.a-perfectly-lovely-rule{border-color:purple;}',
$a_lovely_processor->get_css( array( 'prettify' => false ) ),
$a_lovely_processor->get_css(
array(
'prettify' => false,
'optimize' => true,
)
),
'Return value of get_css() does not match expectations when combining 4 CSS rules'
);
}