Block API: Allow more than 1 block stylesheets

[aristath]

Description

This PR aims to allow enqueing multiple stylesheets per-block.

Inside a block.json file:

Allow defining style and editorStyle as an array. In the case of the post-comments-form block we needed to also enqueue styles for the button block. This is now possible by changing the value from

{
	"style": "wp-block-post-comments-form"
}

to

{
 	"style": [ "wp-block-post-comments-form", "wp-block-buttons", "wp-block-button" ]
}

From a theme/plugin

If a theme needs to add styles to a block, they can now do it using the wp_enqueue_block_style function:

add_action( 
	'after_setup_theme',
	function() {
		$args = array( // Same args used for wp_enqueue_style().
			'handle' => 'my-theme-site-title',
			'src'    => get_theme_file_uri( 'assets/blocks/site-title.css' ),
		);
		// Add "path" to allow inlining asset if the theme opts-in.
		$args['path'] = get_theme_file_path( 'assets/blocks/site-title.css' );

		// Enqueue asset.
		wp_enqueue_block_style( 'core/site-title', $args );
	}
);

How has this been tested?

• Tested in a block theme, confirming that the post-comments-form block still loads the button block assets.
• Added a file in a block-based theme, assets/blocks/site-title.css and confirmed that the code above adds the styles when the template contains a site-title block.
• Added the same file in a classic theme and confirmed the same behavior.
• Confirmed the same behavior both in the frontend and the editor.

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• I've tested my changes with keyboard and screen readers.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).

[gziolo]

The same issue was raised in https://make.wordpress.org/core/2021/06/23/block-api-enhancements-in-wordpress-5-8/#comment-41466 for scripts. It isn't possible to provide in a simple way multiple scripts of the same type for the block using block.json.

[ellatrix]

This will need to be tested in the iframed editors (template editor and FSE).

[aristath]

Many of these things would be a lot easier to do directly in wp-core... I expect the logic to be greatly simplified when this (or a similar implementation) gets backported to core 🤞

[gziolo]

Let's give it a try. I think it's in good shape after several iterations and covers all I can think of for now. We can further improve e2e tests as noted in the most recent comment.

The biggest remaining tasks are to prepare the dev note and find a way to backport those changes to WordPress core.

The next step to think about is how to bring feature parity for JS assets 😄

Awesome work as always. It's a pleasure to review your outstanding work.