diff --git a/packages/blocks/src/api/registration.js b/packages/blocks/src/api/registration.js index 8605fa4838abe..717e88223b974 100644 --- a/packages/blocks/src/api/registration.js +++ b/packages/blocks/src/api/registration.js @@ -169,6 +169,16 @@ export function unstable__bootstrapServerSideBlockDefinitions( definitions ) { serverSideBlockDefinitions[ blockName ].ancestor = definitions[ blockName ].ancestor; } + // The `selectors` prop is not yet included in the server provided + // definitions. Polyfill it as well. + if ( + serverSideBlockDefinitions[ blockName ].selectors === + undefined && + definitions[ blockName ].selectors + ) { + serverSideBlockDefinitions[ blockName ].selectors = + definitions[ blockName ].selectors; + } continue; } @@ -203,6 +213,7 @@ function getBlockSettingsFromMetadata( { textdomain, ...metadata } ) { 'attributes', 'providesContext', 'usesContext', + 'selectors', 'supports', 'styles', 'example', diff --git a/packages/blocks/src/api/test/registration.js b/packages/blocks/src/api/test/registration.js index 58bf57726a3b9..1c91654ece6c1 100644 --- a/packages/blocks/src/api/test/registration.js +++ b/packages/blocks/src/api/test/registration.js @@ -460,6 +460,42 @@ describe( 'blocks', () => { } ); } ); + // This can be removed once polyfill adding selectors has been removed. + it( 'should apply selectors on the client when not set on the server', () => { + const blockName = 'core/test-block-with-selectors'; + unstable__bootstrapServerSideBlockDefinitions( { + [ blockName ]: { + category: 'widgets', + }, + } ); + unstable__bootstrapServerSideBlockDefinitions( { + [ blockName ]: { + selectors: { root: '.wp-block-custom-selector' }, + category: 'ignored', + }, + } ); + + const blockType = { + title: 'block title', + }; + registerBlockType( blockName, blockType ); + expect( getBlockType( blockName ) ).toEqual( { + name: blockName, + save: expect.any( Function ), + title: 'block title', + category: 'widgets', + icon: { src: BLOCK_ICON_DEFAULT }, + attributes: {}, + providesContext: {}, + usesContext: [], + keywords: [], + selectors: { root: '.wp-block-custom-selector' }, + supports: {}, + styles: [], + variations: [], + } ); + } ); + it( 'should validate the icon', () => { const blockType = { save: noop,