[Webfonts] Upgrade the Google Fonts Provider to use the new Fonts API

[hellofromtonya]

Impacted plugin

Jetpack

What

Upgrade Google Fonts Provider for the new Fonts API

How

The original Webfonts API being developed in Gutenberg has changed and will impact the Google Fonts Provider module/package in Jetpack:

New Architecture:

The API's architecture has been redesigned to extend WP_Dependencies. The new design changed the registration data structures and available public functionality. (See commit 87c738e and PR 43492. Scheduled to release Gutenberg 14.9.

What changed?

• The array structure for registering fonts changed, requiring variations to be grouped by their font-family.

jetpack/projects/plugins/jetpack/modules/google-fonts.php

Lines 112 to 131 in a3b8bf9

	foreach ( $fonts_to_register as $font_family ) {
	wp_register_webfonts(
	array(
	array(
	'font-family' => $font_family,
	'font-weight' => '100 900',
	'font-style' => 'normal',
	'font-display' => 'fallback',
	'provider' => 'jetpack-google-fonts',
	),
	array(
	'font-family' => $font_family,
	'font-weight' => '100 900',
	'font-style' => 'italic',
	'font-display' => 'fallback',
	'provider' => 'jetpack-google-fonts',
	),
	)
	);
	}

changes to:

foreach ( $fonts_to_register as $font_family ) {
	wp_register_webfonts(
		array(
			$font_family => array(
				array(
					'font-family'  => $font_family,
					'font-weight'  => '100 900',
					'font-style'   => 'normal',
					'font-display' => 'fallback',
					'provider'     => 'jetpack-google-fonts',
				),
				array(
					'font-family'  => $font_family,
					'font-weight'  => '100 900',
					'font-style'   => 'italic',
					'font-display' => 'fallback',
					'provider'     => 'jetpack-google-fonts',
				),
			),
		)
	);
}

• WP_Webfonts class is deprecated. Use WP_Web_Fonts instead.
• WP_Webfonts::get_font_slug() is deprecated.
• $wp_webfonts-> get_registered_webfonts() is deprecated.

The code in Automattic\Jetpack\Fonts\Utils::is_font_family_registered() is impacted:

jetpack/projects/packages/google-fonts-provider/src/class-utils.php

Lines 46 to 56 in b313bd2

	public static function is_font_family_registered( $font_family_name ) {
	if ( ! function_exists( 'wp_webfonts' ) || ! method_exists( 'WP_Webfonts', 'get_font_slug' ) ) {
	return;
	}
	$wp_webfonts = wp_webfonts();
	$slug = \WP_Webfonts::get_font_slug( $font_family_name );
	return isset( $wp_webfonts->get_registered_webfonts()[ $slug ] );
	}

changes to:

public static function is_font_family_registered( $font_family_name ) {
	if (
		! function_exists( 'wp_webfonts' ) ||
		! class_exists( 'WP_Web_Fonts' ) ||
		! class_exists( 'WP_Webfonts_Utils' )
	) {
		return;
	}

	$wp_webfonts = wp_webfonts();
	if ( ! method_exists( $wp_webfonts, 'get_registered_font_families' ) ) {
		return;
	}

	$handle = \WP_Webfonts_Utils::convert_font_family_into_handle( $font_family_name );

	return in_array( $handle, $wp_webfonts->get_registered_font_families(), true );
}

API renamed

The API is in the process of being renamed, meaning all public functionality (functions, classes, methods will be affected). Likely won't release until Gutenberg 14.10.

What changed?

This change is WIP. Stay tuned.

Temporary BC Layer and deprecations

The new API includes a temporary backwards-compatible (BC) layer (that will not be backported to WordPress Core) that does work with current version of the Google Fonts Provider. This means Jetpack's module will still work but will throw deprecation notices.

[jeherve]

Thanks for the heads up! This is currently in progress in #28054.

[hellofromtonya]

Awesome! Thanks @jeherve 🎉 Once the rename is merged, I'll pop back with what else needs to change.

[simison]

Thanks! Similar follow up need in Blockbase theme once this merges Automattic/themes#6794 (comment)

[simison]

API renaming coming up as well potentially in GB 14.9; WordPress/gutenberg#46749

Renaming will be great as it'll allow us test if the array format should follow new or old way just by checking for Class existance;

if ( class_exists( 'WP_Fonts' ) ) {
  // New
} else if ( class_exists( 'WP_Webfonts' ) ) {
 /// Old 
}

[hellofromtonya]

Heads up: The API renaming PR merged today. Unsure if it will be released in Gutenberg 15.0 or 15.1.

For example, wp_register_webfonts() is now wp_register_fonts().

The original function and class names moved to the BC Layer and are deprecated. This BC Layer keeps the deprecated code functioning with deprecation notices, but will not be backported into WP Core.

The redesign of the API's consumable public functionality and data structures should now be complete.

What else might change?

• New enhancement coming to automatically enqueue all global styles fonts. Once this merges, Jetpack will no longer need to carry the enqueuing code.
• Only throw deprecations when WP_DEBUG is true.

cc @jeherve @simison

[jeherve]

cc @obenland; since @simison is AFK, is this something that's on your teams' agenda?

Thank you!

[obenland]

It is not.

@cometgrrl Are API changes considered part of maintenance or bug reports only?

[cometgrrl]

@obenland While we'd like to focus primarily on bugs, since this is something timely that needs to be addressed, we can take it.