Section Styles: Prevent flash of block style variation styling in post editor

[aaronrobertshaw]

This ticket tracks the backport of PHP files for the following Gutenberg updates:

• ​https://github.com/WordPress/gutenberg/pull/63071

These changes prevent a flash of style updates for applied block style variations when the global styles data is loaded into the block editor. This is done by preloading the global styles REST API paths which also brings the post and site editors further into line.

This PR backports the changes from ​https://github.com/WordPress/gutenberg/pull/63071

These changes include preloading the global styles REST API paths required to collect the global styles data for use in the block editor. This has two benefits:

• Prevents a flash of style updates for block style variations in the post editor
• Brings the post editor's preloaded paths a little more in line with the site editors

#### Test Instructions

1. Active a theme that defines styles for the button outline block style variation e.g. TT4
2. In the post editor add a button, select the Outline style, and save.
3. Reload the post editor and ensure there is no flash of styling (i.e. from a solid color to the outline variant)
4. In the site editor navigate to Styles > Blocks > Button > Outline
5. Apply custom styles for the Outline block style variation e.g. change the border color, background etc.
6. Save the Global Styles changes
7. Switch back to the post editor, loading your earlier post with the button outline block
8. When the editor loads there should be no flash of styling from the default theme outline styles to the custom styles assigned via Global Styles

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

Before	After
<video src="​https://github.com/WordPress/wordpress-develop/assets/60436221/1e4d2603-9aea-4d15-927f-739f73e9a452" />	<video src="​https://github.com/WordPress/wordpress-develop/assets/60436221/fffb815e-c08b-4ae3-925c-6da3af74ab72" />

I do still see a much briefer flash, but I assume that because a package update is needed to bring the JS changes from ​https://github.com/WordPress/gutenberg/pull/63071. It's still better than in trunk.

That would be correct. Without the JS update, the global styles ID is loaded after another API request which isn't required when the ID is in the URL already.

The demo videos in the description illustrate the degree to which this is an improvement even without the JS update.

Would love to see this merged prior to RC3 release. Think it is possible?

[talldanwp]

As mentioned on the PR, the changes look good to me.

Would appreciate a second committer approval for 6.6.

The process outlined in ​this post mentions using dev-feedback for second committer approval, so I've updated the keywords accordingly.

[ellatrix]

Apologies, I got confused between the tickets. [58690] fixed this ticket, not the linked one.

[ellatrix]

I've also manually adjusted the props in the database.

[hellofromTonya]

Reopening this ticket for 2nd committer review and sign-off for backporting [58690] to the 6.6 branch.

[audrasjb]

[58690] looks good to me.
This is a 2nd committer sign-off for backport to branch 6.6.

[davidbaumwald]

In 58698:

Editor: Prevent flash of block style variation styling in post editor.

These changes prevent a flash of style updates for applied block style variations when the global styles data is loaded into the block editor. This is done by preloading the global styles REST API paths which also brings the post and site editors further into line.

Reviewed by audrasjb.
Merges [58690] to the 6.6 branch.

Props aaronrobertshaw, andrewserong, ramonopoly, ellatrix, hellofromTonya.
Fixes #61553.