Skip to content

Commit ba47208

Browse files
committed
Editor: Load all style variation fonts within the editors.
Loads the font family files from style variations defined within a theme for user in the site and post editors. This is to ensure the fonts are shown while editing without the need for a reload after switching styles. Props ironprogrammer, mmaattiiaass. Fixes #62231. git-svn-id: https://develop.svn.wordpress.org/trunk@59260 602fd350-edb4-49c9-b593-d223f7449a82
1 parent 281a68f commit ba47208

File tree

7 files changed

+266
-0
lines changed

7 files changed

+266
-0
lines changed

src/wp-admin/includes/admin-filters.php

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -172,3 +172,4 @@
172172

173173
// Font management.
174174
add_action( 'admin_print_styles', 'wp_print_font_faces', 50 );
175+
add_action( 'admin_print_styles', 'wp_print_font_faces_from_style_variations', 50 );

src/wp-includes/block-editor.php

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -366,6 +366,7 @@ function _wp_get_iframed_editor_assets() {
366366
ob_start();
367367
wp_print_styles();
368368
wp_print_font_faces();
369+
wp_print_font_faces_from_style_variations();
369370
$styles = ob_get_clean();
370371

371372
if ( $has_emoji_styles ) {

src/wp-includes/fonts.php

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,22 @@ function wp_print_font_faces( $fonts = array() ) {
5454
$wp_font_face->generate_and_print( $fonts );
5555
}
5656

57+
/**
58+
* Generates and prints font-face styles defined the the theme style variations.
59+
*
60+
* @since 6.7.0
61+
*
62+
*/
63+
function wp_print_font_faces_from_style_variations() {
64+
$fonts = WP_Font_Face_Resolver::get_fonts_from_style_variations();
65+
66+
if ( empty( $fonts ) ) {
67+
return;
68+
}
69+
70+
wp_print_font_faces( $fonts );
71+
}
72+
5773
/**
5874
* Registers a new font collection in the font library.
5975
*

src/wp-includes/fonts/class-wp-font-face-resolver.php

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,38 @@ public static function get_fonts_from_theme_json() {
3636
return static::parse_settings( $settings );
3737
}
3838

39+
/**
40+
* Gets fonts defined in style variations.
41+
*
42+
* @since 6.7.0
43+
*
44+
* @return array Returns an array of font-families.
45+
*/
46+
public static function get_fonts_from_style_variations() {
47+
$variations = WP_Theme_JSON_Resolver::get_style_variations();
48+
$fonts = array();
49+
50+
if ( empty( $variations ) ) {
51+
return $fonts;
52+
}
53+
54+
foreach ( $variations as $variation ) {
55+
if ( ! empty( $variation['settings']['typography']['fontFamilies']['theme'] ) ) {
56+
$fonts = array_merge( $fonts, $variation['settings']['typography']['fontFamilies']['theme'] );
57+
}
58+
}
59+
60+
$settings = array(
61+
'typography' => array(
62+
'fontFamilies' => array(
63+
'theme' => $fonts,
64+
),
65+
),
66+
);
67+
68+
return static::parse_settings( $settings );
69+
}
70+
3971
/**
4072
* Parse theme.json settings to extract font definitions with variations grouped by font-family.
4173
*

tests/phpunit/tests/fonts/font-face/wp-font-face-tests-dataset.php

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -403,4 +403,95 @@ public static function get_custom_font_families( $key = '' ) {
403403

404404
return $data;
405405
}
406+
407+
public static function get_custom_style_variations( $key = '' ) {
408+
static $data = null;
409+
410+
$path = get_stylesheet_directory() . '/assets/fonts/';
411+
$uri = get_stylesheet_directory_uri() . '/assets/fonts/';
412+
$expected_font_families = array(
413+
array(
414+
array(
415+
'src' => array(
416+
"{$path}dm-sans/DMSans-Regular.woff2",
417+
),
418+
'font-family' => 'DM Sans',
419+
'font-stretch' => 'normal',
420+
'font-style' => 'normal',
421+
'font-weight' => '400',
422+
),
423+
array(
424+
'src' => array(
425+
"{$path}dm-sans/DMSans-Bold.woff2",
426+
),
427+
'font-family' => 'DM Sans',
428+
'font-stretch' => 'normal',
429+
'font-style' => 'normal',
430+
'font-weight' => '700',
431+
),
432+
),
433+
array(
434+
array(
435+
'src' => array(
436+
"{$path}open-sans/OpenSans-VariableFont_wdth,wght.ttf",
437+
),
438+
'font-family' => 'Open Sans',
439+
'font-stretch' => 'normal',
440+
'font-style' => 'normal',
441+
'font-weight' => '400',
442+
),
443+
array(
444+
'src' => array(
445+
"{$path}open-sans/OpenSans-Italic-VariableFont_wdth,wght.ttf",
446+
),
447+
'font-family' => 'Open Sans',
448+
'font-stretch' => 'normal',
449+
'font-style' => 'italic',
450+
'font-weight' => '400',
451+
),
452+
),
453+
array(
454+
array(
455+
'src' => array(
456+
"{$path}dm-sans/DMSans-Medium.woff2",
457+
),
458+
'font-family' => 'DM Sans',
459+
'font-stretch' => 'normal',
460+
'font-style' => 'normal',
461+
'font-weight' => '500',
462+
),
463+
array(
464+
'src' => array(
465+
"{$path}dm-sans/DMSans-Medium-Italic.woff2",
466+
),
467+
'font-family' => 'DM Sans',
468+
'font-stretch' => 'normal',
469+
'font-style' => 'italic',
470+
'font-weight' => '500',
471+
),
472+
),
473+
);
474+
475+
$expected_styles = <<<CSS
476+
@font-face{font-family:"DM Sans";font-style:normal;font-weight:400;font-display:fallback;src:url('{$uri}dm-sans/DMSans-Regular.woff2') format('woff2');font-stretch:normal;}
477+
@font-face{font-family:"DM Sans";font-style:normal;font-weight:700;font-display:fallback;src:url('{$uri}dm-sans/DMSans-Bold.woff2') format('woff2');font-stretch:normal;}
478+
@font-face{font-family:"Open Sans";font-style:normal;font-weight:400;font-display:fallback;src:url('{$uri}open-sans/OpenSans-VariableFont_wdth,wght.ttf') format('truetype');font-stretch:normal;}
479+
@font-face{font-family:"Open Sans";font-style:italic;font-weight:400;font-display:fallback;src:url('{$uri}open-sans/OpenSans-Italic-VariableFont_wdth,wght.ttf') format('truetype');font-stretch:normal;}
480+
@font-face{font-family:"DM Sans";font-style:normal;font-weight:500;font-display:fallback;src:url('{$uri}dm-sans/DMSans-Medium.woff2') format('woff2');font-stretch:normal;}
481+
@font-face{font-family:"DM Sans";font-style:italic;font-weight:500;font-display:fallback;src:url('{$uri}dm-sans/DMSans-Medium-Italic.woff2') format('woff2');font-stretch:normal;}
482+
CSS;
483+
484+
if ( null === $data ) {
485+
$data = array(
486+
'expected' => $expected_font_families,
487+
'expected_styles' => $expected_styles,
488+
);
489+
}
490+
491+
if ( isset( $data[ $key ] ) ) {
492+
return $data[ $key ];
493+
}
494+
495+
return $data;
496+
}
406497
}
Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
<?php
2+
/**
3+
* Test case for WP_Font_Face_Resolver::get_fonts_from_style_variations().
4+
*
5+
* @package WordPress
6+
* @subpackage Fonts
7+
*
8+
* @since 6.7.0
9+
*
10+
* @group fonts
11+
* @group fontface
12+
*
13+
* @covers WP_Font_Face_Resolver::get_fonts_from_style_variations
14+
*/
15+
class Tests_Fonts_WPFontFaceResolver_GetFontsFromStyleVariations extends WP_Font_Face_UnitTestCase {
16+
const FONTS_THEME = 'fonts-block-theme';
17+
18+
public static function set_up_before_class() {
19+
self::$requires_switch_theme_fixtures = true;
20+
21+
parent::set_up_before_class();
22+
}
23+
24+
/**
25+
* Ensure that an empty array is returned when the theme has no style variations.
26+
*
27+
* @ticket 62231
28+
*/
29+
public function test_should_return_empty_array_when_theme_has_no_style_variations() {
30+
switch_theme( 'block-theme' );
31+
32+
$fonts = WP_Font_Face_Resolver::get_fonts_from_style_variations();
33+
$this->assertIsArray( $fonts, 'Should return an array data type' );
34+
$this->assertEmpty( $fonts, 'Should return an empty array' );
35+
}
36+
37+
/**
38+
* Ensure that all variations are loaded from a theme.
39+
*
40+
* @ticket 62231
41+
*/
42+
public function test_should_return_all_fonts_from_all_style_variations() {
43+
switch_theme( static::FONTS_THEME );
44+
45+
$actual = WP_Font_Face_Resolver::get_fonts_from_style_variations();
46+
$expected = self::get_custom_style_variations( 'expected' );
47+
48+
$this->assertSame( $expected, $actual, 'All the fonts from the theme variations should be returned.' );
49+
}
50+
51+
/**
52+
* Ensure that file:./ is replaced in the src list.
53+
*
54+
* @ticket 62231
55+
*/
56+
public function test_should_replace_src_file_placeholder() {
57+
switch_theme( static::FONTS_THEME );
58+
59+
$fonts = WP_Font_Face_Resolver::get_fonts_from_style_variations();
60+
61+
// Check that the there is no theme relative url in the src list.
62+
foreach ( $fonts as $family ) {
63+
foreach ( $family as $font ) {
64+
foreach ( $font['src'] as $src ) {
65+
$src_basename = basename( $src );
66+
$this->assertStringNotContainsString( 'file:./', $src, "Font $src_basename should not contain the 'file:./' placeholder" );
67+
}
68+
}
69+
}
70+
}
71+
}
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
<?php
2+
/**
3+
* Test case for wp_print_font_faces_from_style_variations().
4+
*
5+
* @package WordPress
6+
* @subpackage Fonts
7+
*
8+
* @since 6.7.0
9+
*
10+
* @group fonts
11+
* @group fontface
12+
*
13+
* @covers wp_print_font_faces_from_style_variations
14+
*/
15+
class Tests_Fonts_WpPrintFontFacesFromStyleVariations extends WP_Font_Face_UnitTestCase {
16+
const FONTS_THEME = 'fonts-block-theme';
17+
18+
public static function set_up_before_class() {
19+
parent::set_up_before_class();
20+
self::$requires_switch_theme_fixtures = true;
21+
}
22+
23+
/**
24+
* Ensure that no fonts are printed when the theme has no fonts.
25+
*
26+
* @ticket 62231
27+
*/
28+
public function test_should_not_print_when_no_fonts() {
29+
switch_theme( 'block-theme' );
30+
31+
$this->expectOutputString( '' );
32+
wp_print_font_faces_from_style_variations();
33+
}
34+
35+
/**
36+
* Ensure that all fonts are printed from the theme style variations.
37+
*
38+
* @ticket 62231
39+
*/
40+
public function test_should_print_fonts_in_style_variations() {
41+
switch_theme( static::FONTS_THEME );
42+
43+
$expected = $this->get_custom_style_variations( 'expected_styles' );
44+
$expected_output = $this->get_expected_styles_output( $expected );
45+
46+
$this->expectOutputString( $expected_output );
47+
wp_print_font_faces_from_style_variations();
48+
}
49+
50+
private function get_expected_styles_output( $styles ) {
51+
$style_element = "<style class='wp-fonts-local' type='text/css'>\n%s\n</style>\n";
52+
return sprintf( $style_element, $styles );
53+
}
54+
}

0 commit comments

Comments
 (0)