Editor: Format and sanitize font family names according the CSS spec.

This fixes two bugs in the font library. 
 - Fonts using special characters were not being rendered properly in the frontend.
 - Allows the ability to use generic() in font family names.

Props mmaattiiaass, nithins53, kafleg, vivekawsm, swissspidy, audrasjb.
Fixes #60537.
Built from https://develop.svn.wordpress.org/trunk@57657


git-svn-id: http://core.svn.wordpress.org/trunk@57158 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
youknowriad 2024-02-20 07:11:14 +00:00
parent 93eaafe9c1
commit 134d389842
3 changed files with 43 additions and 23 deletions

View File

@ -219,8 +219,10 @@ final class WP_Font_Collection {
array( array(
'font_family_settings' => array( 'font_family_settings' => array(
'name' => 'sanitize_text_field', 'name' => 'sanitize_text_field',
'slug' => 'sanitize_title', 'slug' => static function ( $value ) {
'fontFamily' => 'sanitize_text_field', return _wp_to_kebab_case( sanitize_title( $value ) );
},
'fontFamily' => 'WP_Font_Utils::sanitize_font_family',
'preview' => 'sanitize_url', 'preview' => 'sanitize_url',
'fontFace' => array( 'fontFace' => array(
array( array(

View File

@ -18,11 +18,36 @@
* @access private * @access private
*/ */
class WP_Font_Utils { class WP_Font_Utils {
/**
* Adds surrounding quotes to font family names that contain special characters.
*
* It follows the recommendations from the CSS Fonts Module Level 4.
* @link https://www.w3.org/TR/css-fonts-4/#font-family-prop
*
* @since 6.5.0
*
* @param string $item A font family name.
* @return string The font family name with surrounding quotes, if necessary.
*/
private static function maybe_add_quotes( $item ) {
// Matches strings that are not exclusively alphabetic characters or hyphens, and do not exactly follow the pattern generic(alphabetic characters or hyphens).
$regex = '/^(?!generic\([a-zA-Z\-]+\)$)(?!^[a-zA-Z\-]+$).+/';
$item = trim( $item );
if ( preg_match( $regex, $item ) ) {
$item = trim( $item, "\"'" );
return '"' . $item . '"';
}
return $item;
}
/** /**
* Sanitizes and formats font family names. * Sanitizes and formats font family names.
* *
* - Applies `sanitize_text_field` * - Applies `sanitize_text_field`.
* - Adds surrounding quotes to names that contain spaces and are not already quoted * - Adds surrounding quotes to names containing any characters that are not alphabetic or dashes.
*
* It follows the recommendations from the CSS Fonts Module Level 4.
* @link https://www.w3.org/TR/css-fonts-4/#font-family-prop
* *
* @since 6.5.0 * @since 6.5.0
* @access private * @access private
@ -37,26 +62,19 @@ class WP_Font_Utils {
return ''; return '';
} }
$font_family = sanitize_text_field( $font_family ); $output = sanitize_text_field( $font_family );
$font_families = explode( ',', $font_family ); $formatted_items = array();
$wrapped_font_families = array_map( if ( str_contains( $output, ',' ) ) {
function ( $family ) { $items = explode( ',', $output );
$trimmed = trim( $family ); foreach ( $items as $item ) {
if ( ! empty( $trimmed ) && str_contains( $trimmed, ' ' ) && ! str_contains( $trimmed, "'" ) && ! str_contains( $trimmed, '"' ) ) { $formatted_item = self::maybe_add_quotes( $item );
return '"' . $trimmed . '"'; if ( ! empty( $formatted_item ) ) {
$formatted_items[] = $formatted_item;
} }
return $trimmed; }
}, return implode( ', ', $formatted_items );
$font_families
);
if ( count( $wrapped_font_families ) === 1 ) {
$font_family = $wrapped_font_families[0];
} else {
$font_family = implode( ', ', $wrapped_font_families );
} }
return self::maybe_add_quotes( $output );
return $font_family;
} }
/** /**

View File

@ -16,7 +16,7 @@
* *
* @global string $wp_version * @global string $wp_version
*/ */
$wp_version = '6.5-beta1-57656'; $wp_version = '6.5-beta1-57657';
/** /**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema. * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.