Description

I have many patterns where a Group, Columns, or Media & Text block is the "top level" block in the pattern and has alignwide or alignfull classes applied.

However, I have realized that these classes are not included in the pattern preview markup, often breaking styles.

For instance, I'm working on a site where the Group block has a border-radius by default but removes it from full width Group blocks with the selector .wp-block-group.alignfull. This works great, but the preview shows the containing Group block with the border radius applied because the alignfull is not applied.

I'm sure there is a reason for doing this, but it's definitely causing problems for me and I don't see any current potential workarounds for now.

Step-by-step reproduction instructions

1. Make a block pattern where the first block has an alignment class applied. Could just be this:

   <!-- wp:group {"align":"wide","layout":{"type":"constrained"}} -->
       <div class="wp-block-group alignwide"></div>
   <!-- /wp:group -->

2. Apply a style with CSS that runs in the editor that styles a group of such alignment. Maybe:

   .wp-block-group.alignwide { background: rebeccapurple; }

3. The result is that the pattern is not purple in the preview, but is purple in the editor.

Screenshots, screen recording, code snippet

Preview of current use-case where the missing alignfull class results in rounded corners on a full-width group block in a pattern:

Environment info

• WP 6.7.1
• No Gutenberg
• Custom hybrid theme

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

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure