Sync packages for WP 6.1 RC 1 (with Fluid Typography) by ockham · Pull Request #3437 · WordPress/wordpress-develop

ockham · 2022-10-11T11:27:52Z

Alternative to #3434. It's also possible to merge #3434 first, and then merge this PR, which contains all the changes from #3434, plus the Fluid Typography fixes (see WordPress/gutenberg#44758 and #3431).

Includes the latest round of Gutenberg bugfix PRs that were approved for inclusion during yesterday’s triage session. The following Gutenberg PRs were cherry-picked:

Furthermore, this includes the Fluid Typography fixes listed in WordPress/gutenberg#44758.

Needed for today's WP 6.1 RC 1 release.

Trac ticket: https://core.trac.wordpress.org/ticket/56467

This Pull Request is for code review only. Please keep all other discussion in the Trac ticket. Do not merge this Pull Request. See GitHub Pull Requests for Code Review in the Core Handbook for more details.

dream-encode

I think this code is mostly OK as-is, aside from updating the function prefix from gutenberg to wp.

My comments on the inline styles aren't a blocker for 6.1 RC 1, but I think this code should be refactored. There's actually a lot of this pattern in(at least) the search block code, i.e. check if value for specific key in array has a value, and, if so, a similar task to several other keys.

dream-encode · 2022-10-11T13:31:40Z

src/wp-includes/blocks/navigation-link.php

-		$font_sizes['inline_styles'] = sprintf( 'font-size: %s;', $context['style']['typography']['fontSize'] );
+		$font_sizes['inline_styles'] = sprintf(
+			'font-size: %s;',
+			gutenberg_get_typography_font_size_value(


Suggested change

gutenberg_get_typography_font_size_value(

wp_get_typography_font_size_value(

dream-encode · 2022-10-11T13:31:51Z

src/wp-includes/blocks/navigation-submenu.php

-		$font_sizes['inline_styles'] = sprintf( 'font-size: %s;', $context['style']['typography']['fontSize'] );
+		$font_sizes['inline_styles'] = sprintf(
+			'font-size: %s;',
+			gutenberg_get_typography_font_size_value(


Suggested change

gutenberg_get_typography_font_size_value(

wp_get_typography_font_size_value(

dream-encode · 2022-10-11T13:32:04Z

src/wp-includes/blocks/page-list.php

-		$font_sizes['inline_styles'] = sprintf( 'font-size: %s;', $context['style']['typography']['fontSize'] );
+		$font_sizes['inline_styles'] = sprintf(
+			'font-size: %s;',
+			gutenberg_get_typography_font_size_value(


Suggested change

gutenberg_get_typography_font_size_value(

wp_get_typography_font_size_value(

dream-encode · 2022-10-11T13:32:23Z

src/wp-includes/blocks/search.php

-		$typography_styles[] = sprintf( 'font-size: %s;', esc_attr( $attributes['style']['typography']['fontSize'] ) );
+		$typography_styles[] = sprintf(
+			'font-size: %s;',
+			gutenberg_get_typography_font_size_value(


Suggested change

gutenberg_get_typography_font_size_value(

wp_get_typography_font_size_value(

dream-encode · 2022-10-11T13:48:34Z

src/wp-includes/blocks/search.php

 	if ( ! empty( $attributes['style']['typography']['fontFamily'] ) ) {
-		$typography_styles[] = sprintf( 'font-family: %s;', esc_attr( $attributes['style']['typography']['fontFamily'] ) );
+		$typography_styles[] = sprintf( 'font-family: %s;', $attributes['style']['typography']['fontFamily'] );
 	}

 	if ( ! empty( $attributes['style']['typography']['letterSpacing'] ) ) {
-		$typography_styles[] = sprintf( 'letter-spacing: %s;', esc_attr( $attributes['style']['typography']['letterSpacing'] ) );
+		$typography_styles[] = sprintf( 'letter-spacing: %s;', $attributes['style']['typography']['letterSpacing'] );
 	}

 	if ( ! empty( $attributes['style']['typography']['fontWeight'] ) ) {
-		$typography_styles[] = sprintf( 'font-weight: %s;', esc_attr( $attributes['style']['typography']['fontWeight'] ) );
+		$typography_styles[] = sprintf( 'font-weight: %s;', $attributes['style']['typography']['fontWeight'] );
 	}

 	if ( ! empty( $attributes['style']['typography']['fontStyle'] ) ) {
-		$typography_styles[] = sprintf( 'font-style: %s;', esc_attr( $attributes['style']['typography']['fontStyle'] ) );
+		$typography_styles[] = sprintf( 'font-style: %s;', $attributes['style']['typography']['fontStyle'] );
 	}

 	if ( ! empty( $attributes['style']['typography']['lineHeight'] ) ) {
-		$typography_styles[] = sprintf( 'line-height: %s;', esc_attr( $attributes['style']['typography']['lineHeight'] ) );
+		$typography_styles[] = sprintf( 'line-height: %s;', $attributes['style']['typography']['lineHeight'] );
 	}

 	if ( ! empty( $attributes['style']['typography']['textTransform'] ) ) {
-		$typography_styles[] = sprintf( 'text-transform: %s;', esc_attr( $attributes['style']['typography']['textTransform'] ) );
+		$typography_styles[] = sprintf( 'text-transform: %s;', $attributes['style']['typography']['textTransform'] );


I feel like this code could be simplified to one loop over all elements in $attributes['style']['typography'].

Inside the loop, we could abstract out the building of the inline styles to another function. Also, if there are more style props added, this code would only need to be changed if there's some sort of unique transform needed on the value, e.g. fontSize key above on line 447 passes its value through wp_get_typography_font_size_value.

Example:

$allowed_keys = array( 'fontFamily', 'letterSpacing', 'fontWeight', 'fontStyle', 'lineHeight', 'textTransform', ); if ( isset( $attributes['style']['typography'] ) ) { foreach ( $attributes['style']['typography'] as $key => $value ) { if ( in_array( $key, $allowed_keys, true ) && ! empty( $attributes['style']['typography'][ $key ] ) ) { $typography_styles[] = sprintf( '%1$s: %2$s;', _wp_to_kebab_case( $key ), $attributes['style']['typography'][ $key ] ); } } }

Edited to add an allowlist of known keys, to avoid parsing bad ones.

ockham · 2022-10-11T15:05:26Z

I think this code is mostly OK as-is, aside from updating the function prefix from gutenberg to wp.

Good catch! Since this is dynamic block PHP, we'll have to do that in Gutenberg, as that code is sync'ed from the @wordpress/block-library package during Core's build process.

dream-encode · 2022-10-11T15:25:15Z

Merged into core in https://core.trac.wordpress.org/changeset/54483.

ockham · 2022-10-11T15:38:46Z

Merged into core in https://core.trac.wordpress.org/changeset/54483.

I believe @dream-encode merged the version without the Fluid Typography changes (#3434). Reopening 😅

ockham · 2022-10-11T15:55:10Z

I think this code is mostly OK as-is, aside from updating the function prefix from gutenberg to wp.

Good catch! Since this is dynamic block PHP, we'll have to do that in Gutenberg, as that code is sync'ed from the @wordpress/block-library package during Core's build process.

WordPress/gutenberg#44876

ockham · 2022-10-11T16:16:16Z

Merged into core in https://core.trac.wordpress.org/changeset/54483.

I believe @dream-encode merged the version without the Fluid Typography changes (#3434). Reopening 😅

Ah, looks like it was actually this one that was merged! Apologies for the confusion. Closing again; #3439 is the follow-up to prevent the gutenberg_ prefix from being re-written during build.

Sync packages for WP 6.1 RC 1 (with Fluid Typography)

e385dc9

dream-encode approved these changes Oct 11, 2022

View reviewed changes

dream-encode closed this Oct 11, 2022

ockham mentioned this pull request Oct 11, 2022

Fluid Typography: Use wp_ prefixed function WordPress/gutenberg#44876

Merged

ockham reopened this Oct 11, 2022

ockham mentioned this pull request Oct 11, 2022

Sync wordpress/block-library package #3439

Closed

ockham closed this Oct 11, 2022

ockham mentioned this pull request Oct 11, 2022

Sync packages for WP 6.1 RC 1 #3434

Closed

ockham deleted the update/sync-packages-wp-6-1-rc-1-with-fluid-typography-fixes branch October 12, 2022 12:20

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Sync packages for WP 6.1 RC 1 (with Fluid Typography)#3437

Sync packages for WP 6.1 RC 1 (with Fluid Typography)#3437
ockham wants to merge 1 commit intoWordPress:trunkfrom
ockham:update/sync-packages-wp-6-1-rc-1-with-fluid-typography-fixes

ockham commented Oct 11, 2022

Uh oh!

dream-encode left a comment

Uh oh!

dream-encode Oct 11, 2022

Uh oh!

dream-encode Oct 11, 2022

Uh oh!

dream-encode Oct 11, 2022

Uh oh!

dream-encode Oct 11, 2022

Uh oh!

dream-encode Oct 11, 2022

Uh oh!

dream-encode Oct 11, 2022

Uh oh!

ockham commented Oct 11, 2022

Uh oh!

dream-encode commented Oct 11, 2022

Uh oh!

ockham commented Oct 11, 2022

Uh oh!

ockham commented Oct 11, 2022

Uh oh!

ockham commented Oct 11, 2022

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

	gutenberg_get_typography_font_size_value(
	wp_get_typography_font_size_value(

Conversation

ockham commented Oct 11, 2022

Uh oh!

dream-encode left a comment

Choose a reason for hiding this comment

Uh oh!

dream-encode Oct 11, 2022

Choose a reason for hiding this comment

Uh oh!

dream-encode Oct 11, 2022

Choose a reason for hiding this comment

Uh oh!

dream-encode Oct 11, 2022

Choose a reason for hiding this comment

Uh oh!

dream-encode Oct 11, 2022

Choose a reason for hiding this comment

Uh oh!

dream-encode Oct 11, 2022

Choose a reason for hiding this comment

Uh oh!

dream-encode Oct 11, 2022

Choose a reason for hiding this comment

Uh oh!

ockham commented Oct 11, 2022

Uh oh!

dream-encode commented Oct 11, 2022

Uh oh!

ockham commented Oct 11, 2022

Uh oh!

ockham commented Oct 11, 2022

Uh oh!

ockham commented Oct 11, 2022

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants