Changeset 55345

Timestamp:

02/15/2023 03:55:12 AM (19 months ago)

Author:

peterwilsoncc

Message:

Editor: Prevent KSES stripping global layout style properties.

Layout style properties are stored using indirect values, rather than direct CSS properties.

Allow users without the unfiltered_html capability to modify global styles using the indirect block spacing properties contentSize, wideSize, and blockGap, using a mapping of the eventual CSS property to the indirect property stored in theme.json. The mapped CSS property is then used for CSS validation.

Props andrewserong, costdev, hellofromtonya, mamaduka, mmtr86.
Fixes #57321.

Location:

trunk

Files:

• src/wp-includes/class-wp-theme-json.php (modified) (4 diffs)
• tests/phpunit/tests/theme/wpThemeJson.php (modified) (1 diff)

trunk/src/wp-includes/class-wp-theme-json.php

@@ -264 +264 @@
 
     /**
+     * Indirect metadata for style properties that are not directly output.
+     *
+     * Each element maps from a CSS property name to an array of
+     * paths to the value in theme.json & block attributes.
+     *
+     * Indirect properties are not output directly by `compute_style_properties`,
+     * but are used elsewhere in the processing of global styles. The indirect
+     * property is used to validate whether or not a style value is allowed.
+     *
+     * @since 6.1.2
+     * @var array
+     */
+    const INDIRECT_PROPERTIES_METADATA = array(
+        'gap'        => array(
+            array( 'spacing', 'blockGap' ),
+        ),
+        'column-gap' => array(
+            array( 'spacing', 'blockGap', 'left' ),
+        ),
+        'row-gap'    => array(
+            array( 'spacing', 'blockGap', 'top' ),
+        ),
+        'max-width'  => array(
+            array( 'layout', 'contentSize' ),
+            array( 'layout', 'wideSize' ),
+        ),
+    );
+
+    /**
      * Protected style properties.
      *
@@ -2950 +2979 @@
             }
         }
+
+        // Ensure indirect properties not included in any `PRESETS_METADATA` value are allowed.
+        static::remove_indirect_properties( $input, $output );
+
         return $output;
     }
@@ -2978 +3011 @@
             }
         }
+
+        // Ensure indirect properties not handled by `compute_style_properties` are allowed.
+        static::remove_indirect_properties( $input, $output );
+
         return $output;
     }
@@ -2994 +3031 @@
         $filtered          = esc_html( safecss_filter_attr( $style_to_validate ) );
         return ! empty( trim( $filtered ) );
+    }
+
+    /**
+     * Removes indirect properties from the given input node and
+     * sets in the given output node.
+     *
+     * @since 6.1.2
+     *
+     * @param array $input  Node to process.
+     * @param array $output The processed node. Passed by reference.
+     */
+    private static function remove_indirect_properties( $input, &$output ) {
+        foreach ( static::INDIRECT_PROPERTIES_METADATA as $property => $paths ) {
+            foreach ( $paths as $path ) {
+                $value = _wp_array_get( $input, $path );
+                if (
+                    is_string( $value ) &&
+                    static::is_safe_css_declaration( $property, $value )
+                ) {
+                    _wp_array_set( $output, $path, $value );
+                }
+            }
+        }
     }
 

trunk/tests/phpunit/tests/theme/wpThemeJson.php

@@ -2428 +2428 @@
 
     /**
+     * @ticket 57321
+     *
+     * @covers WP_Theme_JSON::remove_insecure_properties
+     */
+    public function test_remove_insecure_properties_should_allow_indirect_properties() {
+        $actual = WP_Theme_JSON::remove_insecure_properties(
+            array(
+                'version'  => WP_Theme_JSON::LATEST_SCHEMA,
+                'styles'   => array(
+                    'spacing' => array(
+                        'blockGap' => '3em',
+                    ),
+                    'blocks'  => array(
+                        'core/social-links' => array(
+                            'spacing' => array(
+                                'blockGap' => array(
+                                    'left' => '2em',
+                                    'top'  => '1em',
+                                ),
+                            ),
+                        ),
+                    ),
+                ),
+                'settings' => array(
+                    'layout' => array(
+                        'contentSize' => '800px',
+                        'wideSize'    => '1000px',
+                    ),
+                ),
+            )
+        );
+
+        $expected = array(
+            'version'  => WP_Theme_JSON::LATEST_SCHEMA,
+            'styles'   => array(
+                'spacing' => array(
+                    'blockGap' => '3em',
+                ),
+                'blocks'  => array(
+                    'core/social-links' => array(
+                        'spacing' => array(
+                            'blockGap' => array(
+                                'left' => '2em',
+                                'top'  => '1em',
+                            ),
+                        ),
+                    ),
+                ),
+            ),
+            'settings' => array(
+                'layout' => array(
+                    'contentSize' => '800px',
+                    'wideSize'    => '1000px',
+                ),
+            ),
+        );
+
+        $this->assertSameSetsWithIndex( $expected, $actual );
+    }
+
+    /**
      * @ticket 56467
      */