WordPress.org
Get WordPress

Make WordPress Core

Changeset 56574


Ignore:
Timestamp:
09/14/2023 04:54:22 AM (3 weeks ago)
Author:
isabel_brison
Message:

Editor: disable default style engine optimisation.

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.

Location:
trunk
Files:
6 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-includes/script-loader.php

    r56568 r56574  
    30543054 *
    30553055 *     @type bool $optimize Whether to optimize the CSS output, e.g., combine rules.
    3056  *                          Default true.
     3056 *                          Default false.
    30573057 *     @type bool $prettify Whether to add new lines and indents to output.
    30583058 *                          Default to whether the `SCRIPT_DEBUG` constant is defined.

  • trunk/src/wp-includes/style-engine.php

    r55820 r56574  
    131131 *                                 When set, the style engine will attempt to store the CSS rules.
    132132 *     @type bool        $optimize Whether to optimize the CSS output, e.g. combine rules.
    133  *                                 Default true.
     133 *                                 Default false.
    134134 *     @type bool        $prettify Whether to add new lines and indents to output.
    135135 *                                 Defaults to whether the `SCRIPT_DEBUG` constant is defined.
    … …  
    179179 *
    180180 *     @type bool $optimize Whether to optimize the CSS output, e.g. combine rules.
    181  *                          Default true.
     181 *                          Default false.
    182182 *     @type bool $prettify Whether to add new lines and indents to output.
    183183 *                          Defaults to whether the `SCRIPT_DEBUG` constant is defined.

  • trunk/src/wp-includes/style-engine/class-wp-style-engine-processor.php

    r55820 r56574  
    8686     *
    8787     * @since 6.1.0
     88     * @since 6.4.0 The Optimization is no longer the default.
    8889     *
    8990     * @param array $options   {
    … …  
    9192     *
    9293     *     @type bool $optimize Whether to optimize the CSS output, e.g. combine rules.
    93      *                          Default true.
     94     *                          Default false.
    9495     *     @type bool $prettify Whether to add new lines and indents to output.
    9596     *                          Defaults to whether the `SCRIPT_DEBUG` constant is defined.
    … …  
    99100    public function get_css( $options = array() ) {
    100101        $defaults = array(
    101             'optimize' => true,
     102            'optimize' => false,
    102103            'prettify' => defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG,
    103104        );

  • trunk/src/wp-includes/style-engine/class-wp-style-engine.php

    r56046 r56574  
    625625     *                                 When set, the style engine will attempt to store the CSS rules.
    626626     *     @type bool        $optimize Whether to optimize the CSS output, e.g. combine rules.
    627      *                                 Default true.
     627     *                                 Default false.
    628628     *     @type bool        $prettify Whether to add new lines and indents to output.
    629629     *                                 Defaults to whether the `SCRIPT_DEBUG` constant is defined.

  • trunk/tests/phpunit/tests/style-engine/styleEngine.php

    r56046 r56574  
    655655     * Tests that incoming styles are deduped and merged.
    656656     *
     657     * @ticket 58811
    657658     * @ticket 56467
    658659     *
    … …  
    698699        $compiled_stylesheet = wp_style_engine_get_stylesheet_from_css_rules( $css_rules, array( 'prettify' => false ) );
    699700
    700         $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 );
     701        $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 );
    701702    }
    702703}

  • trunk/tests/phpunit/tests/style-engine/wpStyleEngineProcessor.php

    r54394 r56574  
    8282        $a_wonderful_processor->add_rules( array( $a_wonderful_css_rule, $a_very_wonderful_css_rule, $a_more_wonderful_css_rule ) );
    8383
    84         $expected = '.a-more-wonderful-rule {
     84        $expected = '.a-wonderful-rule {
     85    color: var(--wonderful-color);
     86    background-color: orange;
     87}
     88.a-very_wonderful-rule {
     89    color: var(--wonderful-color);
     90    background-color: orange;
     91}
     92.a-more-wonderful-rule {
    8593    font-family: Wonderful sans;
    8694    font-size: 1em;
    87     background-color: orange;
    88 }
    89 .a-wonderful-rule,
    90 .a-very_wonderful-rule {
    91     color: var(--wonderful-color);
    9295    background-color: orange;
    9396}
    … …  
    185188     * Tests printing out 'unoptimized' CSS, that is, uncombined selectors and duplicate CSS rules.
    186189     *
     190     * This is the default.
     191     *
     192     * @ticket 58811
    187193     * @ticket 56467
    188194     *
    … …  
    231237     * Tests that 'optimized' CSS is output, that is, that duplicate CSS rules are combined under their corresponding selectors.
    232238     *
    233      * @ticket 56467
    234      *
    235      * @covers ::get_css
    236      */
    237     public function test_should_optimize_css_output_by_default() {
     239     * @ticket 58811
     240     * @ticket 56467
     241     *
     242     * @covers ::get_css
     243     */
     244    public function test_should_not_optimize_css_output_by_default() {
    238245        $a_sweet_rule = new WP_Style_Engine_CSS_Rule(
    239246            '.a-sweet-rule',
    … …  
    256263
    257264        $this->assertSame(
    258             '.a-sweet-rule,#an-even-sweeter-rule > marquee{color:var(--sweet-color);background-color:purple;}',
     265            '.a-sweet-rule{color:var(--sweet-color);background-color:purple;}#an-even-sweeter-rule > marquee{color:var(--sweet-color);background-color:purple;}',
    259266            $a_sweet_processor->get_css( array( 'prettify' => false ) )
    260267        );
    … …  
    262269
    263270    /**
    264      * Tests that incoming CSS rules are merged with existing CSS rules.
    265      *
     271     * Tests that incoming CSS rules are optimized and merged with existing CSS rules.
     272     *
     273     * @ticket 58811
    266274     * @ticket 56467
    267275     *
    … …  
    287295        $this->assertSame(
    288296            '.a-lovely-rule,.a-lovelier-rule{border-color:purple;}',
    289             $a_lovely_processor->get_css( array( 'prettify' => false ) ),
     297            $a_lovely_processor->get_css(
     298                array(
     299                    'prettify' => false,
     300                    'optimize' => true,
     301                )
     302            ),
    290303            'Return value of get_css() does not match expectations when combining 2 CSS rules'
    291304        );
    … …  
    309322        $this->assertSame(
    310323            '.a-lovely-rule,.a-lovelier-rule,.a-most-lovely-rule,.a-perfectly-lovely-rule{border-color:purple;}',
    311             $a_lovely_processor->get_css( array( 'prettify' => false ) ),
     324            $a_lovely_processor->get_css(
     325                array(
     326                    'prettify' => false,
     327                    'optimize' => true,
     328                )
     329            ),
    312330            'Return value of get_css() does not match expectations when combining 4 CSS rules'
    313331        );
Note: See TracChangeset for help on using the changeset viewer.