Build: Split packages and blocks to their webpack configs

.gitignore

@@ -29,6 +29,8 @@ wp-tests-config.php
 /src/wp-includes/css/*.min.css
 /src/wp-includes/css/*-rtl.css
 /src/wp-includes/blocks/**/*.css
+/src/wp-includes/blocks/**/*.js
+/src/wp-includes/blocks/**/*.js.map
 /packagehash.txt
 /artifacts
 

Gruntfile.js

@@ -997,6 +997,7 @@ module.exports = function(grunt) {
 						WORKING_DIR + 'wp-{admin,includes}/**/*.js',
 						WORKING_DIR + 'wp-content/themes/twenty*/**/*.js',
 						'!' + WORKING_DIR + 'wp-content/themes/twenty*/node_modules/**/*.js',
+						'!' + WORKING_DIR + 'wp-includes/blocks/**/*.js',
 						'!' + WORKING_DIR + 'wp-includes/js/dist/**/*.js',
 					]
 				}

src/wp-includes/blocks.php

@@ -42,12 +42,16 @@ function generate_block_asset_handle( $block_name, $field_name ) {
 		if ( 0 === strpos( $field_name, 'editor' ) ) {
 			$asset_handle .= '-editor';
 		}
+		if ( 0 === strpos( $field_name, 'view' ) ) {
+			$asset_handle .= '-view';
+		}
 		return $asset_handle;
 	}
 
 	$field_mappings = array(
 		'editorScript' => 'editor-script',
 		'script'       => 'script',
+		'viewScript'   => 'view-script',
 		'editorStyle'  => 'editor-style',
 		'style'        => 'style',
 	);
@@ -96,18 +100,23 @@ function register_block_script_handle( $metadata, $field_name ) {
 		);
 		return false;
 	}
-	$script_asset = require $script_asset_path;
-	$result       = wp_register_script(
+	$is_core_block       = isset( $metadata['file'] ) && 0 === strpos( $metadata['file'], ABSPATH . WPINC );
+	$script_uri          = $is_core_block ?
+		includes_url( str_replace( ABSPATH . WPINC, '', realpath( dirname( $metadata['file'] ) . '/' . $script_path ) ) ) :
+		plugins_url( $script_path, $metadata['file'] );
+	$script_asset        = require $script_asset_path;
+	$script_dependencies = isset( $script_asset['dependencies'] ) ? $script_asset['dependencies'] : array();
+	$result              = wp_register_script(
 		$script_handle,
-		plugins_url( $script_path, $metadata['file'] ),
-		$script_asset['dependencies'],
-		$script_asset['version']
+		$script_uri,
+		$script_dependencies,
+		isset( $script_asset['version'] ) ? $script_asset['version'] : false
 	);
 	if ( ! $result ) {
 		return false;
 	}
 
-	if ( ! empty( $metadata['textdomain'] ) ) {
+	if ( ! empty( $metadata['textdomain'] ) && in_array( 'wp-i18n', $script_dependencies ) ) {
 		wp_set_script_translations( $script_handle, $metadata['textdomain'] );
 	}
 
@@ -182,6 +191,7 @@ function register_block_style_handle( $metadata, $field_name ) {
  * Registers a block type from the metadata stored in the `block.json` file.
  *
  * @since 5.5.0
+ * @since 5.9.0 Added support for the `viewScript` field.
  *
  * @param string $file_or_folder Path to the JSON file with metadata definition for
  *                               the block or path to the folder where the `block.json` file is located.
@@ -304,6 +314,13 @@ function register_block_type_from_metadata( $file_or_folder, $args = array() ) {
 		);
 	}
 
+	if ( ! empty( $metadata['viewScript'] ) ) {
+		$settings['view_script'] = register_block_script_handle(
+			$metadata,
+			'viewScript'
+		);
+	}
+
 	if ( ! empty( $metadata['editorStyle'] ) ) {
 		$settings['editor_style'] = register_block_style_handle(
 			$metadata,

src/wp-includes/blocks/file/view.asset.php

@@ -0,0 +1 @@
+<?php return array('dependencies' => array('wp-polyfill'), 'version' => '499eaf2efb98327a07f222e92d742380');

src/wp-includes/blocks/file/view.min.asset.php

@@ -0,0 +1 @@
+<?php return array('dependencies' => array('wp-polyfill'), 'version' => 'e8d668b8e69d9bf1c99dc250d92f2b72');

src/wp-includes/class-wp-block-type.php

@@ -156,31 +156,39 @@ class WP_Block_Type {
 	public $provides_context = null;
 
 	/**
-	 * Block type editor script handle.
+	 * Block type editor only script handle.
 	 *
 	 * @since 5.0.0
 	 * @var string|null
 	 */
 	public $editor_script = null;
 
 	/**
-	 * Block type front end script handle.
+	 * Block type front end and editor script handle.
 	 *
 	 * @since 5.0.0
 	 * @var string|null
 	 */
 	public $script = null;
 
 	/**
-	 * Block type editor style handle.
+	 * Block type front end only script handle.
+	 *
+	 * @since 5.9.0
+	 * @var string|null
+	 */
+	public $view_script = null;
+
+	/**
+	 * Block type editor only style handle.
 	 *
 	 * @since 5.0.0
 	 * @var string|null
 	 */
 	public $editor_style = null;
 
 	/**
-	 * Block type front end style handle.
+	 * Block type front end and editor style handle.
 	 *
 	 * @since 5.0.0
 	 * @var string|null
@@ -198,6 +206,7 @@ class WP_Block_Type {
 	 *              `uses_context`, and `provides_context` properties.
 	 * @since 5.6.0 Added the `api_version` property.
 	 * @since 5.8.0 Added the `variations` property.
+	 * @since 5.9.0 Added the `view_script` property.
 	 *
 	 * @see register_block_type()
 	 *
@@ -225,10 +234,11 @@ class WP_Block_Type {
 	 *     @type array|null    $attributes       Block type attributes property schemas.
 	 *     @type array         $uses_context     Context values inherited by blocks of this type.
 	 *     @type array|null    $provides_context Context provided by blocks of this type.
-	 *     @type string|null   $editor_script    Block type editor script handle.
-	 *     @type string|null   $script           Block type front end script handle.
-	 *     @type string|null   $editor_style     Block type editor style handle.
-	 *     @type string|null   $style            Block type front end style handle.
+	 *     @type string|null   $editor_script    Block type editor only script handle.
+	 *     @type string|null   $script           Block type front end and editor script handle.
+	 *     @type string|null   $view_script      Block type front end only script handle.
+	 *     @type string|null   $editor_style     Block type editor only style handle.
+	 *     @type string|null   $style            Block type front end and editor style handle.
 	 * }
 	 */
 	public function __construct( $block_type, $args = array() ) {

src/wp-includes/class-wp-block.php

@@ -229,6 +229,10 @@ public function render( $options = array() ) {
 			wp_enqueue_script( $this->block_type->script );
 		}
 
+		if ( ! empty( $this->block_type->view_script ) && empty( $this->block_type->render_callback ) ) {
+			wp_enqueue_script( $this->block_type->view_script );
+		}
+
 		if ( ! empty( $this->block_type->style ) ) {
 			wp_enqueue_style( $this->block_type->style );
 		}

src/wp-includes/rest-api/endpoints/class-wp-rest-block-types-controller.php

@@ -272,6 +272,7 @@ public function prepare_item_for_response( $block_type, $request ) {
 			'example',
 			'editor_script',
 			'script',
+			'view_script',
 			'editor_style',
 			'style',
 			'variations',
@@ -517,6 +518,13 @@ public function get_item_schema() {
 					'readonly'    => true,
 				),
 				'script'           => array(
+					'description' => __( 'Public facing and editor script handle.' ),
+					'type'        => array( 'string', 'null' ),
+					'default'     => null,
+					'context'     => array( 'embed', 'view', 'edit' ),
+					'readonly'    => true,
+				),
+				'view_script'    => array(
 					'description' => __( 'Public facing script handle.' ),
 					'type'        => array( 'string', 'null' ),
 					'default'     => null,
@@ -531,7 +539,7 @@ public function get_item_schema() {
 					'readonly'    => true,
 				),
 				'style'            => array(
-					'description' => __( 'Public facing style handle.' ),
+					'description' => __( 'Public facing and editor style handle.' ),
 					'type'        => array( 'string', 'null' ),
 					'default'     => null,
 					'context'     => array( 'embed', 'view', 'edit' ),

tests/phpunit/data/blocks/notice/block.json

@@ -48,6 +48,7 @@
 	},
 	"editorScript": "tests-notice-editor-script",
 	"script": "tests-notice-script",
+	"viewScript": "tests-notice-view-script",
 	"editorStyle": "tests-notice-editor-style",
 	"style": "tests-notice-style"
 }

tests/phpunit/tests/blocks/register.php

@@ -132,6 +132,10 @@ function test_generate_block_asset_handle() {
 			'unit-tests-my-block-script',
 			generate_block_asset_handle( $block_name, 'script' )
 		);
+		$this->assertSame(
+			'unit-tests-my-block-view-script',
+			generate_block_asset_handle( $block_name, 'viewScript' )
+		);
 		$this->assertSame(
 			'unit-tests-my-block-editor-style',
 			generate_block_asset_handle( $block_name, 'editorStyle' )
@@ -156,6 +160,10 @@ function test_generate_block_asset_handle_core_block() {
 			'wp-block-paragraph',
 			generate_block_asset_handle( $block_name, 'script' )
 		);
+		$this->assertSame(
+			'wp-block-paragraph-view',
+			generate_block_asset_handle( $block_name, 'viewScript' )
+		);
 		$this->assertSame(
 			'wp-block-paragraph-editor',
 			generate_block_asset_handle( $block_name, 'editorStyle' )
@@ -372,6 +380,7 @@ function test_block_registers_with_metadata_fixture() {
 		);
 		$this->assertSame( 'tests-notice-editor-script', $result->editor_script );
 		$this->assertSame( 'tests-notice-script', $result->script );
+		$this->assertSame( 'tests-notice-view-script', $result->view_script );
 		$this->assertSame( 'tests-notice-editor-style', $result->editor_style );
 		$this->assertSame( 'tests-notice-style', $result->style );
 

tests/phpunit/tests/rest-api/rest-block-type-controller.php

@@ -215,6 +215,7 @@ public function test_get_item_invalid() {
 			'category'         => true,
 			'editor_script'    => true,
 			'script'           => true,
+			'view_script'      => true,
 			'editor_style'     => true,
 			'style'            => true,
 			'keywords'         => 'invalid_keywords',
@@ -237,6 +238,7 @@ public function test_get_item_invalid() {
 		$this->assertNull( $data['icon'] );
 		$this->assertNull( $data['editor_script'] );
 		$this->assertNull( $data['script'] );
+		$this->assertNull( $data['view_script'] );
 		$this->assertNull( $data['editor_style'] );
 		$this->assertNull( $data['style'] );
 		$this->assertSameSets( array(), $data['provides_context'] );
@@ -268,6 +270,7 @@ public function test_get_item_defaults() {
 			'category'         => false,
 			'editor_script'    => false,
 			'script'           => false,
+			'view_script'      => false,
 			'editor_style'     => false,
 			'style'            => false,
 			'keywords'         => false,
@@ -290,6 +293,7 @@ public function test_get_item_defaults() {
 		$this->assertNull( $data['icon'] );
 		$this->assertNull( $data['editor_script'] );
 		$this->assertNull( $data['script'] );
+		$this->assertNull( $data['view_script'] );
 		$this->assertNull( $data['editor_style'] );
 		$this->assertNull( $data['style'] );
 		$this->assertSameSets( array(), $data['attributes'] );
@@ -374,7 +378,7 @@ public function test_get_item_schema() {
 		$response   = rest_get_server()->dispatch( $request );
 		$data       = $response->get_data();
 		$properties = $data['schema']['properties'];
-		$this->assertCount( 21, $properties );
+		$this->assertCount( 22, $properties );
 		$this->assertArrayHasKey( 'api_version', $properties );
 		$this->assertArrayHasKey( 'title', $properties );
 		$this->assertArrayHasKey( 'icon', $properties );
@@ -389,6 +393,7 @@ public function test_get_item_schema() {
 		$this->assertArrayHasKey( 'is_dynamic', $properties );
 		$this->assertArrayHasKey( 'editor_script', $properties );
 		$this->assertArrayHasKey( 'script', $properties );
+		$this->assertArrayHasKey( 'view_script', $properties );
 		$this->assertArrayHasKey( 'editor_style', $properties );
 		$this->assertArrayHasKey( 'style', $properties );
 		$this->assertArrayHasKey( 'parent', $properties );
@@ -500,6 +505,7 @@ protected function check_block_type_object( $block_type, $data, $links ) {
 			'category',
 			'editor_script',
 			'script',
+			'view_script',
 			'editor_style',
 			'style',
 			'title',