Make WordPress Core


Ignore:
Timestamp:
09/07/2022 02:38:59 PM (4 years ago)
Author:
SergeyBiryukov
Message:

KSES: Allow min(), max(), minmax(), and clamp() values to be used in inline CSS.

Follow-up to [50923].

Props johnregan3, uxl, isabel_brison, andrewserong, ramonopoly, noisysocks, joyously.
See #55966.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/tests/phpunit/tests/kses.php

    r53331 r54092  
    936936         * @ticket 42729
    937937         * @ticket 48376
     938         * @ticket 55966
    938939         * @dataProvider data_test_safecss_filter_attr
    939940         *
    … …  
    11211122                                'expected' => '',
    11221123                        ),
     1124                        // Allow min().
     1125                        array(
     1126                                'css'      => 'width: min(50%, 400px)',
     1127                                'expected' => 'width: min(50%, 400px)',
     1128                        ),
     1129                        // Allow max().
     1130                        array(
     1131                                'css'      => 'width: max(50%, 40rem)',
     1132                                'expected' => 'width: max(50%, 40rem)',
     1133                        ),
     1134                        // Allow minmax().
     1135                        array(
     1136                                'css'      => 'width: minmax(100px, 50%)',
     1137                                'expected' => 'width: minmax(100px, 50%)',
     1138                        ),
     1139                        // Allow clamp().
     1140                        array(
     1141                                'css'      => 'width: clamp(100px, 50%, 100vw)',
     1142                                'expected' => 'width: clamp(100px, 50%, 100vw)',
     1143                        ),
     1144                        // Combined CSS function names.
     1145                        array(
     1146                                'css'      => 'width: calcmax(100px + 50%)',
     1147                                'expected' => '',
     1148                        ),
     1149                        // Allow calc().
     1150                        array(
     1151                                'css'      => 'width: calc(2em + 3px)',
     1152                                'expected' => 'width: calc(2em + 3px)',
     1153                        ),
     1154                        // Allow var().
     1155                        array(
     1156                                'css'      => 'padding: var(--wp-var1) var(--wp-var2)',
     1157                                'expected' => 'padding: var(--wp-var1) var(--wp-var2)',
     1158                        ),
     1159                        // Allow var() with fallback (commas).
     1160                        array(
     1161                                'css'      => 'padding: var(--wp-var1, 10px)',
     1162                                'expected' => 'padding: var(--wp-var1, 10px)',
     1163                        ),
     1164                        // Allow var() with fallback var().
     1165                        array(
     1166                                'css'      => 'background-color: var(--wp-var, var(--wp-var-fallback, pink))',
     1167                                'expected' => 'background-color: var(--wp-var, var(--wp-var-fallback, pink))',
     1168                        ),
     1169                        // Allow calc() with var().
     1170                        array(
     1171                                'css'      => 'margin-top: calc(var(--wp-var1) * 3 + 2em)',
     1172                                'expected' => 'margin-top: calc(var(--wp-var1) * 3 + 2em)',
     1173                        ),
     1174                        // Malformed min, no closing `)`.
     1175                        array(
     1176                                'css'      => 'width: min(3em + 10px',
     1177                                'expected' => '',
     1178                        ),
     1179                        // Malformed max, no closing `)`.
     1180                        array(
     1181                                'css'      => 'width: max(3em + 10px',
     1182                                'expected' => '',
     1183                        ),
     1184                        // Malformed minmax, no closing `)`.
     1185                        array(
     1186                                'css'      => 'width: minmax(3em + 10px',
     1187                                'expected' => '',
     1188                        ),
     1189                        // Malformed calc, no closing `)`.
     1190                        array(
     1191                                'css'      => 'width: calc(3em + 10px',
     1192                                'expected' => '',
     1193                        ),
     1194                        // Malformed var, no closing `)`.
     1195                        array(
     1196                                'css'      => 'width: var(--wp-var1',
     1197                                'expected' => '',
     1198                        ),
    11231199                );
    11241200        }
    … …  
    13021378                        ),
    13031379
    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 
    13221380                        /*
    13231381                         * Invalid use cases.
    … …  
    13811439                        array(
    13821440                                'background-image: url( "http://example.com );',
    1383                                 '',
    1384                         ),
    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',
    13951441                                '',
    13961442                        ),
Note: See TracChangeset for help on using the changeset viewer.