From 4809ae032757f7c3ccc609eb845a75e957162179 Mon Sep 17 00:00:00 2001 From: Michael Auteri Date: Tue, 28 Dec 2021 21:14:09 -0500 Subject: [PATCH 1/7] Improve user experience with blocks editor when a block is not registered. Mimic that of edit when a block is missing with core/missing block. --- .gitignore | 3 +++ packages/blocks/src/api/factory.js | 9 +++++++++ 2 files changed, 12 insertions(+) diff --git a/.gitignore b/.gitignore index 48cca7fcb886a4..ba571413ac9711 100644 --- a/.gitignore +++ b/.gitignore @@ -28,3 +28,6 @@ test/native/junit.xml phpcs.xml phpunit.xml phpunit-watcher.yml + +# IDE +.idea/ diff --git a/packages/blocks/src/api/factory.js b/packages/blocks/src/api/factory.js index 4abd12a802f03f..ca2e63264c82f2 100644 --- a/packages/blocks/src/api/factory.js +++ b/packages/blocks/src/api/factory.js @@ -45,6 +45,15 @@ import { * @return {Object} Block object. */ export function createBlock( name, attributes = {}, innerBlocks = [] ) { + // If a Block is undefined, use the core/missing block as a placeholder + // for a better user experience. + if ( undefined === getBlockType( name ) ) { + attributes.originalName = name; + attributes.originalContent = ''; + attributes.originalUndelimitedContent = ''; + name = 'core/missing'; + } + const sanitizedAttributes = __experimentalSanitizeBlockAttributes( name, attributes From 3f8598eafcde7a1305e094ad52d5a5df4ae74c9a Mon Sep 17 00:00:00 2001 From: Michael Auteri Date: Wed, 29 Dec 2021 09:10:47 -0500 Subject: [PATCH 2/7] Remove change to .gitignore. --- .gitignore | 3 --- 1 file changed, 3 deletions(-) diff --git a/.gitignore b/.gitignore index ba571413ac9711..48cca7fcb886a4 100644 --- a/.gitignore +++ b/.gitignore @@ -28,6 +28,3 @@ test/native/junit.xml phpcs.xml phpunit.xml phpunit-watcher.yml - -# IDE -.idea/ From 53c31e0e7ad38f04dfa6698048645ab78d9f34f1 Mon Sep 17 00:00:00 2001 From: Michael Auteri Date: Wed, 29 Dec 2021 10:01:09 -0500 Subject: [PATCH 3/7] Move code from createBlock to synchronizeBlocksWithTemplate, which is a more appropriate location. --- packages/blocks/src/api/factory.js | 9 --------- packages/blocks/src/api/templates.js | 12 ++++++++++++ 2 files changed, 12 insertions(+), 9 deletions(-) diff --git a/packages/blocks/src/api/factory.js b/packages/blocks/src/api/factory.js index ca2e63264c82f2..4abd12a802f03f 100644 --- a/packages/blocks/src/api/factory.js +++ b/packages/blocks/src/api/factory.js @@ -45,15 +45,6 @@ import { * @return {Object} Block object. */ export function createBlock( name, attributes = {}, innerBlocks = [] ) { - // If a Block is undefined, use the core/missing block as a placeholder - // for a better user experience. - if ( undefined === getBlockType( name ) ) { - attributes.originalName = name; - attributes.originalContent = ''; - attributes.originalUndelimitedContent = ''; - name = 'core/missing'; - } - const sanitizedAttributes = __experimentalSanitizeBlockAttributes( name, attributes diff --git a/packages/blocks/src/api/templates.js b/packages/blocks/src/api/templates.js index 69a46f2831bbda..e27282f43743fd 100644 --- a/packages/blocks/src/api/templates.js +++ b/packages/blocks/src/api/templates.js @@ -73,6 +73,18 @@ export function synchronizeBlocksWithTemplate( blocks = [], template ) { // before creating the blocks. const blockType = getBlockType( name ); + + // If a Block is undefined, use the core/missing block as a placeholder + // for a better user experience. + if ( undefined === blockType ) { + attributes = { + originalName: name, + originalContent: '', + originalUndelimitedContent: '', + }; + name = 'core/missing'; + } + const isHTMLAttribute = ( attributeDefinition ) => get( attributeDefinition, [ 'source' ] ) === 'html'; const isQueryAttribute = ( attributeDefinition ) => From 1848ab9d13b851789e8281edff7414a794b446f2 Mon Sep 17 00:00:00 2001 From: Michael Auteri Date: Wed, 29 Dec 2021 10:59:02 -0500 Subject: [PATCH 4/7] Added new unit test to check that unregistered blocks from template are replaced with core/missing block. --- packages/blocks/src/api/test/templates.js | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/packages/blocks/src/api/test/templates.js b/packages/blocks/src/api/test/templates.js index 7dbee7062cb862..91598f4df1b877 100644 --- a/packages/blocks/src/api/test/templates.js +++ b/packages/blocks/src/api/test/templates.js @@ -43,6 +43,13 @@ describe( 'templates', () => { category: 'text', title: 'test block', } ); + + registerBlockType( 'core/missing', { + attributes: {}, + save: noop, + category: 'text', + title: 'missing block', + } ); } ); describe( 'doBlocksMatchTemplate', () => { @@ -201,5 +208,17 @@ describe( 'templates', () => { synchronizeBlocksWithTemplate( blockList, template ) ).toEqual( [ block1 ] ); } ); + + it( 'should replace unregistered blocks from template with core/missing block', () => { + const template = [ + [ 'core/test-block' ], + [ 'core/test-block-2' ], + [ 'core/test-faker' ], + ]; + + expect( + synchronizeBlocksWithTemplate( [], template )[ 2 ].name + ).toEqual( 'core/missing' ); + } ); } ); } ); From 1d72668d087ca777ce231625ec14d9f424ce9abc Mon Sep 17 00:00:00 2001 From: Michael Auteri Date: Tue, 4 Jan 2022 11:39:07 -0500 Subject: [PATCH 5/7] Fix E2E test and replace with core/missing block to replace unregistered block. --- .../e2e-tests/specs/editor/plugins/custom-post-types.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/e2e-tests/specs/editor/plugins/custom-post-types.test.js b/packages/e2e-tests/specs/editor/plugins/custom-post-types.test.js index 51f6420fd8b4e6..dde89bfc02c550 100644 --- a/packages/e2e-tests/specs/editor/plugins/custom-post-types.test.js +++ b/packages/e2e-tests/specs/editor/plugins/custom-post-types.test.js @@ -75,7 +75,7 @@ describe( 'Test Custom Post Types', () => { await createNewPost( { postType: 'leg_block_in_tpl' } ); await clickBlockAppender(); await page.keyboard.type( 'Hello there' ); - await page.waitForSelector( '[data-type="core/embed"]' ); + await page.waitForSelector( '[data-type="core/missing"]' ); await publishPost(); } ); } ); From a695dcc1a80ce7d51d06bbdd8b9325769c561cbc Mon Sep 17 00:00:00 2001 From: Michael Auteri Date: Tue, 4 Jan 2022 12:02:54 -0500 Subject: [PATCH 6/7] Move BlockName check to end of function and allow legacy block check to run before replacing with core/missing block. --- packages/blocks/src/api/templates.js | 24 +++++++++---------- .../editor/plugins/custom-post-types.test.js | 2 +- 2 files changed, 13 insertions(+), 13 deletions(-) diff --git a/packages/blocks/src/api/templates.js b/packages/blocks/src/api/templates.js index e27282f43743fd..dd2006dc220aa8 100644 --- a/packages/blocks/src/api/templates.js +++ b/packages/blocks/src/api/templates.js @@ -74,17 +74,6 @@ export function synchronizeBlocksWithTemplate( blocks = [], template ) { const blockType = getBlockType( name ); - // If a Block is undefined, use the core/missing block as a placeholder - // for a better user experience. - if ( undefined === blockType ) { - attributes = { - originalName: name, - originalContent: '', - originalUndelimitedContent: '', - }; - name = 'core/missing'; - } - const isHTMLAttribute = ( attributeDefinition ) => get( attributeDefinition, [ 'source' ] ) === 'html'; const isQueryAttribute = ( attributeDefinition ) => @@ -120,7 +109,7 @@ export function synchronizeBlocksWithTemplate( blocks = [], template ) { attributes ); - const [ + let [ blockName, blockAttributes, ] = convertLegacyBlockNameAndAttributes( @@ -128,6 +117,17 @@ export function synchronizeBlocksWithTemplate( blocks = [], template ) { normalizedAttributes ); + // If a Block is undefined at this point, use the core/missing block as + // a placeholder for a better user experience. + if ( undefined === getBlockType( blockName ) ) { + blockAttributes = { + originalName: name, + originalContent: '', + originalUndelimitedContent: '', + }; + blockName = 'core/missing'; + } + return createBlock( blockName, blockAttributes, diff --git a/packages/e2e-tests/specs/editor/plugins/custom-post-types.test.js b/packages/e2e-tests/specs/editor/plugins/custom-post-types.test.js index dde89bfc02c550..51f6420fd8b4e6 100644 --- a/packages/e2e-tests/specs/editor/plugins/custom-post-types.test.js +++ b/packages/e2e-tests/specs/editor/plugins/custom-post-types.test.js @@ -75,7 +75,7 @@ describe( 'Test Custom Post Types', () => { await createNewPost( { postType: 'leg_block_in_tpl' } ); await clickBlockAppender(); await page.keyboard.type( 'Hello there' ); - await page.waitForSelector( '[data-type="core/missing"]' ); + await page.waitForSelector( '[data-type="core/embed"]' ); await publishPost(); } ); } ); From 0b3bb58a7812b9d58c05f95306fb365b94a6510c Mon Sep 17 00:00:00 2001 From: Michael Auteri Date: Tue, 4 Jan 2022 12:10:36 -0500 Subject: [PATCH 7/7] Remove extra line break. --- packages/blocks/src/api/templates.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/blocks/src/api/templates.js b/packages/blocks/src/api/templates.js index dd2006dc220aa8..6c363dae825645 100644 --- a/packages/blocks/src/api/templates.js +++ b/packages/blocks/src/api/templates.js @@ -73,7 +73,6 @@ export function synchronizeBlocksWithTemplate( blocks = [], template ) { // before creating the blocks. const blockType = getBlockType( name ); - const isHTMLAttribute = ( attributeDefinition ) => get( attributeDefinition, [ 'source' ] ) === 'html'; const isQueryAttribute = ( attributeDefinition ) =>