Device preview button should be disabled in the pattern/template part editor

[t-hamano]

Description

Device preview conflicts with resizable editors. If an editor is resizable, device preview should be disabled.

Specifically, the pattern editor/template part editor in the site editor.

In WordPress 6.5, the device preview button was disabled, as shown in the screenshot below:

This issue appears to have been present since WordPress 6.6.

Step-by-step reproduction instructions

• Open the site editor.
• Open any template part or pattern.
• Switch to mobile view.
• The resizable editor becomes squashed and nearly inoperable.

Screenshots, screen recording, code snippet

20b766fc00778c43ec94b9b4e2f782cd.mp4

Environment info

No response

Please confirm that you have searched existing issues in the repo.

• Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

• Yes

[t-hamano]

After some investigation, it appears this issue occurred in #61273.

[draganescu]

It occured to me that the device preview for resizeable editors is basically setting presets for the editor size - or so it should. E.g. why shouldn't I be able to preview my header on a mobile viewport, and why for patterns, template parts or mobile menus I have to manually resize to tablet, when even is tablet ...?

[t-hamano]

Perhaps the ideal specification would be for the device preview and the resizable editor to be "synchronized." This has been mentioned in the past in this comment:

[draganescu]

Yes, that seems much better than disabling the control. We should try that I think.

[draganescu]

Now that #65970 is merged maybe we need a new issue to go to

the ideal specification [...] the device preview and the resizable editor to be "synchronized."

Also it's my impression that #65970 also falls under the stuff #61622 tries to solve (basically we check for post type to affect UI).

To undo a new hard coding I've recently tried #66600 which looks for a post type supprt to decide zoom out. In this case here the specification outlined by @t-hamano above is the way to go - makes more sense to not remove the feature ad hoc and also removes the need to check for post types.

cc @andrewserong @tellthemachines

[andrewserong]

Thanks for the ping! I like the idea of synchronising them and for the mobile / tablet sizes to be available for folks to set those sizes in the resizable editor. If we do, I think we'll still need some logic to factor in when to show/hide the template preview toggle being proposed in: #66514 — although that one is now guarded behind a check for templateId so it might be fine 🤔

To undo a new hard coding I've recently tried #66600 which looks for a post type support to decide zoom out.

In principle I like the idea of making this more generic so that we don't have a hard-coded list. Would part of the value there be so that plugins can register post types that would default to using the resizable editor? As it stands, though, I don't mind the duplication of hard coding things if it's readable. One of the things I quite liked about #65970 is that although it is hard coding things there was a readability improvement for me in looking over that changeset.