Global styles: block level styles are enqueued twice

[ramonjd]

Description

Since #42005, global block styles are enqueued twice:

1. In global-styles-inline-css
2. In wp-block-social-links-inline-css

This causes duplicate styles in styles.blocks[ $block_name ] rendered to the HTML.

Before

<style id='wp-block-social-links-inline-css'>
.wp-block-social-links {
	background-color: yellow;
	color: red;
	margin: 100px;
	padding: 150px;
}

</style>

After

<style id='global-styles-inline-css'>

/* ... lots of global styles */

.wp-block-social-links {
	background-color: yellow;
	color: red;
	margin: 100px;
	padding: 150px;
}

/* ... lots more global styles */
</style>

<!-- ... a bunch of stuff... -->

<style id='wp-block-social-links-inline-css'>
.wp-block-social-links {
	background-color: yellow;
	color: red;
	margin: 100px;
	padding: 150px;
}

</style>

Step-by-step reproduction instructions

Add some block styles to your theme.json. Any block will do.

I'm using emptytheme and the Social links block as an example.

Example theme.json

{
	"version": 2,
	"settings": {
		"appearanceTools": true,
		"layout": {
			"contentSize": "840px",
			"wideSize": "1100px"
		}
	},
	"styles": {
		"spacing": {
		},
		"blocks": {
			"core/social-links": {
				"spacing": {
					"blockGap": "55px",
					"margin": "100px",
					"padding": "150px"
				},
				"color": {
					"text": "red",
					"background": "yellow"
				}
			}
		}
	},
	"patterns": [
		"short-text-surrounded-by-round-images",
		"partner-logos"
	]
}

Create a post with that block and publish it.

Example block code

<!-- wp:social-links -->
<ul class="wp-block-social-links"><!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /-->

<!-- wp:social-link {"url":"https://wordpress.org","service":"wordpress"} /--></ul>
<!-- /wp:social-links -->

Inspect the block HTML and see that the styles are applied twice.

Screenshots, screen recording, code snippet

Environment info

• WordPress 6.0
• Gutenberg 13.6.0
• Any block-based theme

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