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