KSES: Allow assigning values to CSS variables.

The `safecss_filter_attr()` function allows using custom CSS variables like `color: var(--color)`. However, it did not allow assigning values to CSS variables like `--color: #F00`, which is common in Global Styles and Gutenberg.

This commit adds support for assigning values to CSS variables, so that the function can be used consistently in Global Styles and the future Style Engine in Gutenberg.

Follow-up to [50923], [54100].

Props aristath, ramonopoly, SergeyBiryukov.
Fixes #56353.
Built from https://develop.svn.wordpress.org/trunk@54117


git-svn-id: http://core.svn.wordpress.org/trunk@53676 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Sergey Biryukov 2022-09-09 12:39:11 +00:00
parent 02032a7562
commit 9ba0095255
2 changed files with 18 additions and 2 deletions

View File

@ -2229,7 +2229,7 @@ function kses_init() {
* @since 5.7.1 Added support for `object-position`.
* @since 5.8.0 Added support for `calc()` and `var()` values.
* @since 6.1.0 Added support for `min()`, `max()`, `minmax()`, `clamp()`,
* and nested `var()` values.
* nested `var()` values, and assigning values to CSS variables.
* Added support for `gap`, `column-gap`, `row-gap`, and `flex-wrap`.
* Extended `margin-*` and `padding-*` support for logical properties.
*
@ -2391,6 +2391,9 @@ function safecss_filter_attr( $css, $deprecated = '' ) {
'object-position',
'overflow',
'vertical-align',
// Custom CSS properties.
'--*',
)
);
@ -2436,6 +2439,7 @@ function safecss_filter_attr( $css, $deprecated = '' ) {
$found = false;
$url_attr = false;
$gradient_attr = false;
$is_custom_var = false;
if ( strpos( $css_item, ':' ) === false ) {
$found = true;
@ -2443,11 +2447,23 @@ function safecss_filter_attr( $css, $deprecated = '' ) {
$parts = explode( ':', $css_item, 2 );
$css_selector = trim( $parts[0] );
// Allow assigning values to CSS variables.
if ( in_array( '--*', $allowed_attr, true ) && preg_match( '/^--[a-zA-Z0-9-_]+$/', $css_selector ) ) {
$allowed_attr[] = $css_selector;
$is_custom_var = true;
}
if ( in_array( $css_selector, $allowed_attr, true ) ) {
$found = true;
$url_attr = in_array( $css_selector, $css_url_data_types, true );
$gradient_attr = in_array( $css_selector, $css_gradient_data_types, true );
}
if ( $is_custom_var ) {
$css_value = trim( $parts[1] );
$url_attr = str_starts_with( $css_value, 'url(' );
$gradient_attr = str_contains( $css_value, '-gradient(' );
}
}
if ( $found && $url_attr ) {

View File

@ -16,7 +16,7 @@
*
* @global string $wp_version
*/
$wp_version = '6.1-alpha-54116';
$wp_version = '6.1-alpha-54117';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.