From 1261ced3bff4b0189c7095a7daa7dce2034c6081 Mon Sep 17 00:00:00 2001 From: Tonya Mork Date: Mon, 13 Feb 2023 14:31:06 +0000 Subject: [PATCH] Themes: Remove local() from @font-face styles in _wp_theme_json_webfonts_handler(). Removes adding `local()` as a `@font-face` `src` within `_wp_theme_json_webfonts_handler()`. Why? To fix font incompatibilities when a user has the font-family locally installed on their viewing computer or device. It's unknown if all of the font-face variations specified by theme.json and/or global styles are: * installed on the user's computer/device. * and in one file or multiple files. The previous implementation used the `src` specified when registering the font with the API. That src will likely vary from user computer/device to user computer/device. To avoid these unknowns which could cause incompatibilities or styling issues, this changeset removes adding `local()` to the generated font-face CSS styles. References: * [https://github.com/WordPress/gutenberg/pull/47254 Gutenberg PR 47254] Follow-up to [53282]. Props luehrsen, aristath, ehtmlu, hellofromTonya, wetah. Fixes #57430. git-svn-id: https://develop.svn.wordpress.org/trunk@55314 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-includes/script-loader.php | 5 ++++- tests/phpunit/tests/webfonts/wpThemeJsonWebfontsHandler.php | 3 ++- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php index 894c2d7936..5216ff299a 100644 --- a/src/wp-includes/script-loader.php +++ b/src/wp-includes/script-loader.php @@ -3520,13 +3520,14 @@ function _wp_theme_json_webfonts_handler() { * Compiles the 'src' into valid CSS. * * @since 6.0.0 + * @since 6.2.0 Removed local() CSS. * * @param string $font_family Font family. * @param array $value Value to process. * @return string The CSS. */ $fn_compile_src = static function( $font_family, array $value ) { - $src = "local($font_family)"; + $src = ''; foreach ( $value as $item ) { @@ -3542,6 +3543,8 @@ function _wp_theme_json_webfonts_handler() { : ", url('{$item['url']}') format('{$item['format']}')"; } + $src = ltrim( $src, ', ' ); + return $src; }; diff --git a/tests/phpunit/tests/webfonts/wpThemeJsonWebfontsHandler.php b/tests/phpunit/tests/webfonts/wpThemeJsonWebfontsHandler.php index ae7deacc01..1c084044f6 100644 --- a/tests/phpunit/tests/webfonts/wpThemeJsonWebfontsHandler.php +++ b/tests/phpunit/tests/webfonts/wpThemeJsonWebfontsHandler.php @@ -76,13 +76,14 @@ class Tests_Webfonts_wpThemeJsonWebfontsHandler extends WP_UnitTestCase { /** * @ticket 55567 * @ticket 46370 + * @ticket 57430 */ public function test_font_face_generated_from_themejson() { $this->setup_theme_and_test( 'webfonts-theme' ); $expected = << -@font-face{font-family:"Source Serif Pro";font-style:normal;font-weight:200 900;font-display:fallback;src:local("Source Serif Pro"), url('THEME_ROOT_URL/assets/fonts/SourceSerif4Variable-Roman.ttf.woff2') format('woff2');font-stretch:normal;}@font-face{font-family:"Source Serif Pro";font-style:italic;font-weight:200 900;font-display:fallback;src:local("Source Serif Pro"), url('THEME_ROOT_URL/assets/fonts/SourceSerif4Variable-Italic.ttf.woff2') format('woff2');font-stretch:normal;} +@font-face{font-family:"Source Serif Pro";font-style:normal;font-weight:200 900;font-display:fallback;src:url('THEME_ROOT_URL/assets/fonts/SourceSerif4Variable-Roman.ttf.woff2') format('woff2');font-stretch:normal;}@font-face{font-family:"Source Serif Pro";font-style:italic;font-weight:200 900;font-display:fallback;src:url('THEME_ROOT_URL/assets/fonts/SourceSerif4Variable-Italic.ttf.woff2') format('woff2');font-stretch:normal;} EOF; $expected = str_replace( 'THEME_ROOT_URL', get_stylesheet_directory_uri(), $expected );