Make WordPress Core

Ticket #55966: 55966.diff

File 55966.diff, 3.3 KB (added by johnregan3, 17 months ago)

Patch to allow min, max, minmax, and calc, including unit tests

  • src/wp-includes/kses.php

    diff --git src/wp-includes/kses.php src/wp-includes/kses.php
    index b32df1beaa..9109d7d122 100644
    function safecss_filter_attr( $css, $deprecated = '' ) { 
    24672467                }
    24682468
    24692469                if ( $found ) {
    2470                         // Allow CSS calc().
    2471                         $css_test_string = preg_replace( '/calc\(((?:\([^()]*\)?|[^()])*)\)/', '', $css_test_string );
     2470                        // Allow some CSS functions.
     2471                        $css_test_string = preg_replace( '/\b(?:calc|min|max|minmax|clamp)\(((?:\([^()]*\)?|[^()])*)\)/', '', $css_test_string );
     2472
    24722473                        // Allow CSS var().
    24732474                        $css_test_string = preg_replace( '/\(?var\(--[a-zA-Z0-9_-]*\)/', '', $css_test_string );
    24742475
  • tests/phpunit/tests/kses.php

    diff --git tests/phpunit/tests/kses.php tests/phpunit/tests/kses.php
    index e6cac09c3b..f1755ddbc5 100644
    EOF; 
    11201120                                'css'      => 'color: rgb( 100, 100, 100, .4 )',
    11211121                                'expected' => '',
    11221122                        ),
     1123                        // Allow min().
     1124                        array(
     1125                                'width: min(50%, 400px)',
     1126                                'width: min(50%, 400px)',
     1127                        ),
     1128                        // Allow max().
     1129                        array(
     1130                                'width: max(50%, 40rem)',
     1131                                'width: max(50%, 40rem)',
     1132                        ),
     1133                        // Allow minmax().
     1134                        array(
     1135                                'width: minmax(100px, 50%)',
     1136                                'width: minmax(100px, 50%)',
     1137                        ),
     1138                        // Allow clamp().
     1139                        array(
     1140                                'width: clamp(100px, 50%, 100vw)',
     1141                                'width: clamp(100px, 50%, 100vw)',
     1142                        ),
     1143                        // Combined CSS function names.
     1144                        array(
     1145                                'width: calcmax(100px + 50%)',
     1146                                '',
     1147                        ),
     1148                        // Allow calc().
     1149                        array(
     1150                                'width: calc(2em + 3px)',
     1151                                'width: calc(2em + 3px)',
     1152                        ),
     1153                        // Allow var().
     1154                        array(
     1155                                'padding: var(--wp-var1) var(--wp-var2)',
     1156                                'padding: var(--wp-var1) var(--wp-var2)',
     1157                        ),
     1158                        // Allow calc() with var().
     1159                        array(
     1160                                'margin-top: calc(var(--wp-var1) * 3 + 2em)',
     1161                                'margin-top: calc(var(--wp-var1) * 3 + 2em)',
     1162                        ),
     1163                        // Malformed min, no closing `)`.
     1164                        array(
     1165                                'width: min(3em + 10px',
     1166                                '',
     1167                        ),
     1168                        // Malformed max, no closing `)`.
     1169                        array(
     1170                                'width: max(3em + 10px',
     1171                                '',
     1172                        ),
     1173                        // Malformed minmax, no closing `)`.
     1174                        array(
     1175                                'width: minmax(3em + 10px',
     1176                                '',
     1177                        ),
     1178                        // Malformed calc, no closing `)`.
     1179                        array(
     1180                                'width: calc(3em + 10px',
     1181                                '',
     1182                        ),
     1183                        // Malformed var, no closing `)`.
     1184                        array(
     1185                                'width: var(--wp-var1',
     1186                                '',
     1187                        ),
    11231188                );
    11241189        }
    11251190
    EOF; 
    12261291         * @ticket 45067
    12271292         * @ticket 46197
    12281293         * @ticket 46498
     1294         * @ticket 55966
    12291295         *
    12301296         * @param $input string The style attribute saved in the editor.
    12311297         * @param $expected string The sanitized style attribute.
    EOF; 
    13011367                                'background: red',
    13021368                        ),
    13031369
    1304                         // CSS calc().
    1305                         array(
    1306                                 'width: calc(2em + 3px)',
    1307                                 'width: calc(2em + 3px)',
    1308                         ),
    1309 
    1310                         // CSS variable.
    1311                         array(
    1312                                 'padding: var(--wp-var1) var(--wp-var2)',
    1313                                 'padding: var(--wp-var1) var(--wp-var2)',
    1314                         ),
    1315 
    1316                         // CSS calc() with var().
    1317                         array(
    1318                                 'margin-top: calc(var(--wp-var1) * 3 + 2em)',
    1319                                 'margin-top: calc(var(--wp-var1) * 3 + 2em)',
    1320                         ),
    1321 
    13221370                        /*
    13231371                         * Invalid use cases.
    13241372                         */
    EOF; 
    13821430                                'background-image: url( "http://example.com );',
    13831431                                '',
    13841432                        ),
    1385 
    1386                         // Malformed calc, no closing `)`.
    1387                         array(
    1388                                 'width: calc(3em + 10px',
    1389                                 '',
    1390                         ),
    1391 
    1392                         // Malformed var, no closing `)`.
    1393                         array(
    1394                                 'width: var(--wp-var1',
    1395                                 '',
    1396                         ),
    13971433                );
    13981434        }
    13991435