Layout issues in Row block with Yoast plugin active

[bgardner]

Description

As reported in Slack, I am experiencing an issue with layout (Row block inside of Group block) and the "Space between items" setting not being honored with Yoast plugin active.

Step-by-step reproduction instructions

1. Add a Group block, set to Full-width layout.
2. Add a Row block inside, set to Wide-width layout, add two items, and select "Space between items" setting.
3. Activate Yoast plugin.

Screenshots, screen recording, code snippet

Screen.Recording.2023-09-29.at.2.21.31.PM.mp4

Environment info

WordPress 6.4-beta1, with and without Gutenberg 16.7 active.
TT3 theme active.

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

[bgardner]

Worth noting that this is only an issue with the block editor, as the front end operates as expected.

[Mamaduka]

You can also reproduce the issue by enabling the Custom Fields. This is probably related to the editor switching to a non-framed canvas.

Screenshot

[t-hamano]

I found that when the editor is not an iframe, the style is not applied because the .editor-styles-wrapper selector is nested in the output container class.

[Mamaduka]

I think the regression is a side-effect of the following changes:

• Iframe: skip scoping styles #46752 - makes only non-iframed editor styles scoped. It is not an issue itself, but it makes it harder to catch the bug when using the Gutenberg plugin and metaboxes aren't active.
• Layout: use override editor style API #54466 - switched layout styles to use new styles override API. Layout styles are rendered via the EditorStyles component, so scoping is applied for non-iframed editors.

The getLayoutStyle method already appends the wrapper scope to the generated CSS, so we get double wrapping.

[t-hamano]

I was also looking for the cause of this problem, and through git bisect I was able to identify that #54466 caused this problem.

[Mamaduka]

I tried fixing this without changing the way layout styles are generated — result #54981.

[bgardner]

@Mamaduka @glendaviesnz @t-hamano @annezazu

This issue does not appear to be resolved, as I just tested again with WP 6.4 Beta-2.

Screen.Recording.2023-10-03.at.11.59.09.AM.mp4

[mikachan]

Hey @bgardner. #54981 wasn't included in Beta 2 (we'd already synced the GB Beta 2 fixes when it was merged), but it will go into Beta 3. In the meantime, I can test this as soon as #54981 has been cherry-picked, ahead of Beta 3.

[bgardner]

@mikachan Ah, gotcha. For some reason I thought it was in Beta 2, so I'll test again once 3 goes out. Appreciate the insight.

[mikachan]

Confirming that I've tested these changes as part of the updates for 6.4 Beta 3, and I can no longer see this issue. @bgardner It would be amazing if you could also double-check this once Beta 3 is released! 🙇