Changeset 57254 for trunk/tests/phpunit/tests/block-supports/wpRenderBackgroundSupport.php

Timestamp:

01/09/2024 06:10:09 AM (2 years ago)

Author:

isabel_brison

Message:

Editor: add size and repeat to background image support.

Adds background size and background repeat style processing to the background image block support and WP_Style_Engine definitions.

Props andrewserong, mukesh27.
Fixes #60175.

File:

• trunk/tests/phpunit/tests/block-supports/wpRenderBackgroundSupport.php (modified) (4 diffs)

trunk/tests/phpunit/tests/block-supports/wpRenderBackgroundSupport.php

@@ -68 +68 @@
      *
      * @ticket 59357
+     * @ticket 60175
      *
      * @covers ::wp_render_background_support
@@ -136 +137 @@
                     ),
                 ),
-                'expected_wrapper'    => '<div style="background-image:url(&#039;https://example.com/image.jpg&#039;);background-size:cover;">Content</div>',
+                'expected_wrapper'    => '<div class="has-background" style="background-image:url(&#039;https://example.com/image.jpg&#039;);background-size:cover;">Content</div>',
                 'wrapper'             => '<div>Content</div>',
             ),
+            'background image style with contain, position, and repeat is applied' => array(
+                'theme_name'          => 'block-theme-child-with-fluid-typography',
+                'block_name'          => 'test/background-rules-are-output',
+                'background_settings' => array(
+                    'backgroundImage' => true,
+                ),
+                'background_style'    => array(
+                    'backgroundImage'  => array(
+                        'url'    => 'https://example.com/image.jpg',
+                        'source' => 'file',
+                    ),
+                    'backgroundRepeat' => 'no-repeat',
+                    'backgroundSize'   => 'contain',
+                ),
+                'expected_wrapper'    => '<div class="has-background" style="background-image:url(&#039;https://example.com/image.jpg&#039;);background-position:center;background-repeat:no-repeat;background-size:contain;">Content</div>',
+                'wrapper'             => '<div>Content</div>',
+            ),
             'background image style is appended if a style attribute already exists' => array(
                 'theme_name'          => 'block-theme-child-with-fluid-typography',
@@ -151 +169 @@
                     ),
                 ),
-                'expected_wrapper'    => '<div classname="wp-block-test" style="color: red;background-image:url(&#039;https://example.com/image.jpg&#039;);background-size:cover;">Content</div>',
-                'wrapper'             => '<div classname="wp-block-test" style="color: red">Content</div>',
+                'expected_wrapper'    => '<div class="wp-block-test has-background" style="color: red;background-image:url(&#039;https://example.com/image.jpg&#039;);background-size:cover;">Content</div>',
+                'wrapper'             => '<div class="wp-block-test" style="color: red">Content</div>',
             ),
             'background image style is appended if a style attribute containing multiple styles already exists' => array(
@@ -166 +184 @@
                     ),
                 ),
-                'expected_wrapper'    => '<div classname="wp-block-test" style="color: red;font-size: 15px;background-image:url(&#039;https://example.com/image.jpg&#039;);background-size:cover;">Content</div>',
-                'wrapper'             => '<div classname="wp-block-test" style="color: red;font-size: 15px;">Content</div>',
+                'expected_wrapper'    => '<div class="wp-block-test has-background" style="color: red;font-size: 15px;background-image:url(&#039;https://example.com/image.jpg&#039;);background-size:cover;">Content</div>',
+                'wrapper'             => '<div class="wp-block-test" style="color: red;font-size: 15px;">Content</div>',
             ),
             'background image style is not applied if the block does not support background image' => array(