Make WordPress Core


Ignore:
Timestamp:
02/08/2024 10:39:24 AM (12 months ago)
Author:
gziolo
Message:

Editor: Add viewScriptModule handling to block.json metadata

Syncing changes from the Gutenberg plugin: https://github.com/WordPress/gutenberg/pull/57437.

Scripts and styles can be registered for blocks via block.json metadata. There is now a Modules API, but was no way to register or associate module assets with blocks via block.json.

Fixes #60233.
Props jonsurrell, gziolo, cbravobernal, luisherranz, youknowriad.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/tests/phpunit/tests/blocks/register.php

    r57559 r57565  
    139139    /**
    140140     * @ticket 50263
     141     * @ticket 60233
    141142     */
    142143    public function test_generate_block_asset_handle() {
     
    154155            'unit-tests-my-block-view-script-100',
    155156            generate_block_asset_handle( $block_name, 'viewScript', 99 )
     157        );
     158        $this->assertSame(
     159            'unit-tests-my-block-view-script-module',
     160            generate_block_asset_handle( $block_name, 'viewScriptModule' )
     161        );
     162        $this->assertSame(
     163            'unit-tests-my-block-view-script-module-2',
     164            generate_block_asset_handle( $block_name, 'viewScriptModule', 1 )
     165        );
     166        $this->assertSame(
     167            'unit-tests-my-block-view-script-module-100',
     168            generate_block_asset_handle( $block_name, 'viewScriptModule', 99 )
    156169        );
    157170        $this->assertSame(
     
    200213
    201214    /**
     215     * @ticket 60233
     216     */
     217    public function test_generate_block_asset_handle_core_block_module() {
     218        $block_name = 'core/paragraph';
     219
     220        $this->assertSame(
     221            'wp-block-paragraph-editor-script-module',
     222            generate_block_asset_handle( $block_name, 'editorScriptModule' )
     223        );
     224        $this->assertSame(
     225            'wp-block-paragraph-editor-script-module-2',
     226            generate_block_asset_handle( $block_name, 'editorScriptModule', 1 )
     227        );
     228        $this->assertSame(
     229            'wp-block-paragraph-editor-script-module-100',
     230            generate_block_asset_handle( $block_name, 'editorScriptModule', 99 )
     231        );
     232
     233        $this->assertSame(
     234            'wp-block-paragraph-view-script-module',
     235            generate_block_asset_handle( $block_name, 'viewScriptModule' )
     236        );
     237        $this->assertSame(
     238            'wp-block-paragraph-view-script-module-2',
     239            generate_block_asset_handle( $block_name, 'viewScriptModule', 1 )
     240        );
     241        $this->assertSame(
     242            'wp-block-paragraph-view-script-module-100',
     243            generate_block_asset_handle( $block_name, 'viewScriptModule', 99 )
     244        );
     245
     246        $this->assertSame(
     247            'wp-block-paragraph-script-module',
     248            generate_block_asset_handle( $block_name, 'scriptModule' )
     249        );
     250        $this->assertSame(
     251            'wp-block-paragraph-script-module-2',
     252            generate_block_asset_handle( $block_name, 'scriptModule', 1 )
     253        );
     254        $this->assertSame(
     255            'wp-block-paragraph-script-module-100',
     256            generate_block_asset_handle( $block_name, 'scriptModule', 99 )
     257        );
     258    }
     259
     260    /**
    202261     * @ticket 50263
    203262     */
     
    233292
    234293    /**
     294     * @ticket 60233
     295     */
     296    public function test_field_not_found_register_block_script_module_id() {
     297        $result = register_block_script_module_id( array(), 'viewScriptModule' );
     298
     299        $this->assertFalse( $result );
     300    }
     301
     302    /**
     303     * @ticket 60233
     304     */
     305    public function test_empty_string_value_do_not_register_block_script_module_id() {
     306        $metadata = array( 'viewScriptModule' => '' );
     307        $result   = register_block_script_module_id( $metadata, 'viewScriptModule' );
     308
     309        $this->assertFalse( $result );
     310    }
     311
     312    /**
     313     * @ticket 60233
     314     */
     315    public function test_empty_array_value_do_not_register_block_script_module_id() {
     316        $metadata = array( 'viewScriptModule' => array() );
     317        $result   = register_block_script_module_id( $metadata, 'viewScriptModule' );
     318
     319        $this->assertFalse( $result );
     320    }
     321
     322    /**
     323     * @ticket 60233
     324     */
     325    public function test_wrong_array_index_do_not_register_block_script_module_id() {
     326        $metadata = array( 'viewScriptModule' => array( 'test-module_id' ) );
     327        $result   = register_block_script_module_id( $metadata, 'script', 1 );
     328
     329        $this->assertFalse( $result );
     330    }
     331
     332    /**
     333     * @ticket 60233
     334     */
     335    public function test_missing_asset_file_register_block_script_module_id() {
     336        $metadata = array(
     337            'file'             => __FILE__,
     338            'name'             => 'unit-tests/test-block',
     339            'viewScriptModule' => 'file:./blocks/notice/missing-asset.js',
     340        );
     341        $result   = register_block_script_module_id( $metadata, 'viewScriptModule' );
     342
     343        $this->assertSame( 'unit-tests-test-block-view-script-module', $result );
     344    }
     345
     346    /**
     347     * @ticket 60233
     348     */
     349    public function test_handle_passed_register_block_script_module_id() {
     350        $metadata = array(
     351            'viewScriptModule' => 'test-script-module-id',
     352        );
     353        $result   = register_block_script_module_id( $metadata, 'viewScriptModule' );
     354
     355        $this->assertSame( 'test-script-module-id', $result );
     356    }
     357
     358    /**
     359     * @ticket 60233
     360     */
     361    public function test_handles_passed_register_block_script_module_ids() {
     362        $metadata = array(
     363            'viewScriptModule' => array( 'test-id', 'test-id-other' ),
     364        );
     365
     366        $result = register_block_script_module_id( $metadata, 'viewScriptModule' );
     367        $this->assertSame( 'test-id', $result );
     368
     369        $result = register_block_script_module_id( $metadata, 'viewScriptModule', 1 );
     370        $this->assertSame( 'test-id-other', $result );
     371    }
     372
     373    /**
     374     * @ticket 60233
     375     */
     376    public function test_success_register_block_script_module_id() {
     377        $metadata = array(
     378            'file'             => DIR_TESTDATA . '/blocks/notice/block.json',
     379            'name'             => 'unit-tests/test-block',
     380            'viewScriptModule' => 'file:./block.js',
     381        );
     382        $result   = register_block_script_module_id( $metadata, 'viewScriptModule' );
     383
     384        $this->assertSame( 'unit-tests-test-block-view-script-module', $result );
     385
     386        // Test the behavior directly within the unit test
     387        $this->assertFalse(
     388            strpos(
     389                wp_normalize_path( realpath( dirname( $metadata['file'] ) . '/' . $metadata['viewScriptModule'] ) ),
     390                trailingslashit( wp_normalize_path( get_template_directory() ) )
     391            ) === 0
     392        );
     393
     394        $this->assertFalse(
     395            strpos(
     396                wp_normalize_path( realpath( dirname( $metadata['file'] ) . '/' . $metadata['viewScriptModule'] ) ),
     397                trailingslashit( wp_normalize_path( get_stylesheet_directory() ) )
     398            ) === 0
     399        );
     400    }
     401
     402    /**
    235403     * @ticket 50263
    236404     */
     
    246414    public function test_handles_passed_register_block_script_handles() {
    247415        $metadata = array(
    248             'script' => array( 'test-script-handle', 'test-script-handle-2' ),
     416            'script' => array( 'test-script-handle', 'test-script-handle-other' ),
    249417        );
    250418
     
    253421
    254422        $result = register_block_script_handle( $metadata, 'script', 1 );
    255         $this->assertSame( 'test-script-handle-2', $result, 1 );
     423        $this->assertSame( 'test-script-handle-other', $result );
    256424    }
    257425
     
    752920     * @ticket 57585
    753921     * @ticket 59797
     922     * @ticket 60233
    754923     */
    755924    public function test_block_registers_with_metadata_fixture() {
     
    8551024        );
    8561025        $this->assertSameSets(
     1026            array( 'tests-notice-view-script-module', 'tests-notice-view-script-module-2' ),
     1027            $result->view_script_module_ids
     1028        );
     1029        $this->assertSameSets(
    8571030            array( 'tests-notice-editor-style' ),
    8581031            $result->editor_style_handles
Note: See TracChangeset for help on using the changeset viewer.