Fix: Cover Block: Unnecessary default styles for H2 heading

[jorgefilipecosta]

Description

Fixes: #17704

The cover block needs h2 styles to support older versions of the block, but these styles were styling current heading blocks and make the ability of themes styling the block hard.

This PR fixes this problem by changing the heading selector to rely on section.wp-block-cover-image as a parent. Versions that not had inner blocks and used an h2 heading had a section (and not a div as the current) with a class wp-block-cover-image (and not a wp-block-cover as the current). So relying on this we can apply the styles to older versions and not affect new versions.

Styles that only exist to support deprecated versions were moved and grouped together.

How has this been tested?

I used the classic editor and created a post with the following content (pasting it on Gutenberg automatically migrates to the new version of the blocks):

<!-- wp:cover-image {"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg==","id":34} -->
<section class="wp-block-cover-image has-background-dim" style="background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg==)"><h2><strong>Cover Image</strong></h2></section>
<!-- /wp:cover-image -->

<!-- wp:cover-image {"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg==","id":34} -->
<div class="wp-block-cover-image has-background-dim" style="background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg==)"><p class="wp-block-cover-image-text"><strong>Cover Block</strong></p></div>
<!-- /wp:cover-image -->

<!-- wp:cover {"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg==","id":35} -->
<div class="wp-block-cover has-background-dim" style="background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg==)"><p class="wp-block-cover-text"><strong>Cover Block</strong></p></div>
<!-- /wp:cover -->

I disabled classic editor, opened the post verified it was automatically migrated. Did not save the migration.
I opened the post with Gutenberg master and in this branch and verified it displays equal in both places.
I created a new cover block, I added a new heading inside the cover and verified it was not centered aligned.

[youknowriad]

Can we expand a little bit on the differences compared to the current markup and how we're using them to target only the previous versions?

[jorgefilipecosta]

I explained that on the description of the PR, but I agree that it should be in the comment I added it.

[m-e-h]

Is there a policy for how long we keep deprecated code? I might be wrong but if I remember correctly, h2 in the cover block was removed from the markup before the plugin was initially merged with WordPress core.

[jorgefilipecosta]

Is there a policy for how long we keep deprecated code?

WordPress tries to always be back-compatible so it seems core needs to always contain the styles that made a previous version of the blocks work.

I might be wrong but if I remember correctly, h2 in the cover block was removed from the markup before the plugin was initially merged with WordPress core.

I created a test site with WordPress 5.0 and verified h2 was not used in the cover. I guess in this case we can remove the h2 selectors to save some bytes. Any thoughts on this @youknowriad?

[youknowriad]

I think we should keep them for now until we figure a better strategy. That's not the only place where we support plugin only markup. We have several blocks in that case and we even have hidden blocks that were entirely deprecated.

[jorgefilipecosta]

Thank you for your insights @youknowriad I guess in this case the PR should be ready.

[youknowriad]

Do we need this here?

[jorgefilipecosta]

Yes, we need these styles because of the previous versions, they were always white. Current versions inriht the color, I move these styles to the deprecated zone.