Backport: Block theme previews

[onemaggie]

This PR backports the changes made to the block theme previews. I grouped them together instead of having one PR for each change because they would all depend on each other, which made more sense.

Backports:

​https://github.com/WordPress/gutenberg/pull/50030
​https://github.com/WordPress/gutenberg/pull/50335
​https://github.com/WordPress/gutenberg/pull/50338
​https://github.com/WordPress/gutenberg/pull/50354
​https://github.com/WordPress/gutenberg/pull/51221
​https://github.com/WordPress/gutenberg/pull/51312
​https://github.com/WordPress/gutenberg/pull/50983
​https://github.com/WordPress/wordpress-develop/pull/4376

Trac ticket: [](https://core.trac.wordpress.org/ticket/58561)

This PR backports the changes made to the block theme previews. I grouped them together instead of having one PR for each change because they would all depend on each other, which made more sense.

Backports:

• [x] ​https://github.com/WordPress/gutenberg/pull/50030
• [x] ​https://github.com/WordPress/gutenberg/pull/50335
• [x] ​https://github.com/WordPress/gutenberg/pull/50338
• [x] ​https://github.com/WordPress/gutenberg/pull/50354
• [x] ​https://github.com/WordPress/gutenberg/pull/51221
• [x] ​https://github.com/WordPress/gutenberg/pull/51312
• [x] ​https://github.com/WordPress/gutenberg/pull/50983
• [x] ​https://github.com/WordPress/wordpress-develop/pull/4376

@felixarntz @audrasjb would you please have another look?

During testing, I'm seeing an error when the active theme is a classic theme

1. Activate the theme Twenty Twenty-One (classic theme)
2. Click live preview on a block theme: twenty twenty-two
3. An error message is displayed: The theme you are currently using is not compatible with the Site Editor.

The reverse case is unaffected: it's still possible to preview a classic theme while a block theme is active.

During testing, I'm seeing an error when the active theme is a classic theme

I suspect this is due to the npm packages not being updated yet in core. Can you confirm @MaggieCabrera ?

During testing, I'm seeing an error when the active theme is a classic theme

I suspect this is due to the npm packages not being updated yet in core. Can you confirm @MaggieCabrera ?

This is in fact not happening when testing that flow using Gutenberg trunk and core 6.2.2. I can't say of the top of my head what's causing it, I'm going to double-check, but most likely we are just missing the npm packages like you said.

During testing, I'm seeing an error when the active theme is a classic theme

I suspect this is due to the npm packages not being updated yet in core. Can you confirm @MaggieCabrera ?

This is not the reason why it was failing - we found the cause was an incorrect GET param on the button. Having said that we are still finding that the feature isn't working correctly on this branch because the npm packages aren't updated yet. I think we'll need to wait for this to be done before we can confirm that this is working as expected.

Thanks for the pointer, I tried running npm run sync-gutenberg-packages on this branch to see if I could test but without success. I'm going to leave it alone for the rest of the weekend and see if I have more success on Monday.

[onemaggie]

i think this one is missing the 6.3 milestone

[isabel_brison]

In 56059:

General: add block theme previews.

Adds a preview link to block themes in the themes screen, opening the previews in the site editor.

Props onemaggie, andraganescu, audrasjb, flixos90, peterwilsoncc, spacedmonkey, scruffian.
Fixes #58561.

committed in r56059 / ​1ef856c.

[kebbet]

@isabel_brison Please set the milestone for this ticket to 6.3. Thanks!