Blog Posts Block - Featured Images Oversized and Overlap in the Editor

[donalirl]

Describe the bug
Images in the Blog Posts block (grid view) appear distorted in the editor, making it difficult to edit the site.

To Reproduce
Steps to reproduce the behavior:

1. Activate a block theme
2. Visit the site editor and edit the homepage template
3. Add a Blog Posts block
4. In the toolbar, choose Grid View
5. Ensure three posts are loaded and that each post has a featured image

Screenshots
Images are suddenly extremely large and pushed up against each other:

Expected behavior
I expected the editor view to show the images with correct spacing, like we see on the live site:

[philnick206]

Another report: 8582019-zd-a8c

[mxhassani]

Another one: 8622597-zen
Theme: Masu
Workaround: use query loop block

[masperber]

Another report here: 8663356-zd-a8c

[m1r0]

I was able to reproduce it.

cc @Automattic/newspack-product to increase visibility.

[laurelfulford]

Thanks for the reports, all!

It look like this is related to this optimization change that loads some of the editor styles as needed -- these styles include a max-width for the images, and they're being loaded into the regular post editor but not the site editor: #1548

We'll be looking into a fix!

[leogermani]

is this related? #1878

[dev-sabbir]

Another one here: 8770806-zd-a8c

[Robertght]

8914025-zen

It seems the issue is more present on the Atomic sites and modern themes as classic ones appear to work correctly.

I tested with Gourmetto and Dara.

[leogermani]

Being fixed on #1920. Once it's released I'll add a comment here

[laurelfulford]

Reopening this since the issue isn't merged to WP.com yet 😬 The closing was my fault, I added the comment to the PR without thinking.

[matticbot]

🎉 This issue has been resolved in version 4.3.5-alpha.1 🎉

The release is available on:

• npm package (@alpha dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[Robertght]

@laurelfulford I can see this was released, but it's not clear if it's merged into dotcom yet. Can we please have this merged as well?

[adekbadek]

It's released on the alpha channel. When it will be released on the main release channel (there will be another bot ping here), it'll be possible to merge it to dotcom.

[ezebecke]

Reported also on 9013627-zd

[matticbot]

🎉 This issue has been resolved in version 4.3.5 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[mxhassani]

9028589-zen

[rinazrina]

Another report: 9106742-zd-a8c

[deancroyal]

Working with a customer here: 9167698-zd-a8c

Active theme is Automattic's Startorg

[supernovia]

I've also seen this myself and thought it was just a quirk. @laurelfulford is this an issue that's come back?

[leogermani]

@supernovia The fix we did on the block was not ported over to wpcom yet. Since this takes some time to be done and we are about to release a few more changes to the block, we're holding this just a bit longer so we don't have to do this again in a short period of time

[ricardo-ramos-dot-com]

This is another report from 9168875-zen

[Robertght]

9246321-zen

[jordesign]

@leogermani Just checking on the status of porting this change over to wpcom?

[jorpdesigns]

9342515-zen

[ezebecke]

9378506-zen