Cover block not working when changing the aspect ratio about gutenberg

[andrewserong]

Thanks for opening this issue @westnz! I've added it to the tracking issue for follow-up tasks over in #58230

For example, when I select the 'wide' aspect ratio with three sentences of text, the text cuts off in mobile view.

Unfortunately this is a limitation of using aspect ratio with the Cover block. When using an aspect ratio, the aspect ratio is preserved even if text extends beyond the bounds of the block. There was some initial discussion about this on the original PR (#56897) and more recently on a Cover block bug fix PR (#59388) that restored the original overflow rules. I'll just ping @jasmussen, @jameskoster and @tellthemachines for visibility since they were involved in some of those discussions. In short, I think the discussion was summed up in this comment:

I think we can explore an overflow design tool as a separate thing, and leave it to an editorial responsibility to ensure things look good here.

What this means is that for WP 6.5, when using the aspect ratio control for Cover blocks, it will preserve the aspect ratio at all screen sizes. This makes it suitable for simple Cover blocks with, say, a single heading or a button, but likely not for cover blocks containing paragraph-like content.

For future WP versions, I think it'd be great for us to explore extending the options for how overflowing content is handled: e.g. if it extends the container, if it switches off the aspect ratio, or if it displays a scrollbar, etc. Any exploration there will need to be careful to avoid regressions, as was brought up in #59388.

---

A second issue I found was that when I changed the aspect ratio back to 'Original', the block did not display correctly.

This is an interesting one. To work around it in 6.5, to clear out the value, you can either set a "minimum height of cover value" or go to the ellipsis menu for Dimensions and then click RESET next to Aspect ratio:

What's happening on trunk is that if you deliberately change aspect ratios and then select Original, it'll output auto for the aspect ratio, and switch off the minimum height for the Cover block, so that the Cover block is just the size of its content. I imagine most of the time that's not what's desired, as folks are just wanting to clear the value. One potential use case for deliberately outputting auto is in order to override an aspect ratio that is set in global styles. I.e. if the Cover block in global styles is set to 16/9, it might be good for individual cover blocks to be able to override that value and set the block to auto explicitly?

The confusion surrounding the "Original" option is also flagged in the tracking issue (#58230).

---

To sum up: the aspect ratio support in 6.5 is in its first state, which is useful for some but not all use cases. I think it'd be good to come up with more options for how we handle overflowing content, but I doubt there'll be any solutions ready in time for 6.5. It would be a good thing to expand and enhance for 6.6, though.

For the issue of switching to Original and it overriding the minimum height of the Cover block, that does look worth fixing if we can. Since it's possible for a user to reset via the ellipsis menu or by setting a minimum height of the cover block, I think it's a good idea to fix it, but IMO can wait until WP 6.5.1.

[jameskoster]

It could be nice to start with some basic overflow controls to handle vertical scrolling (most common). Perhaps something like:

A notice could appear to warn the user if scroll behavior is incompatible.

This format could easily graduate to accommodate horizontal overflow controls via tools panel:

[westnz]

Thank @andrewserong you very much for shedding more light and connecting all the dots. ⭐ Glad these issues are being looked at by all the right folks.