Transform multiple heading blocks to list or paragraphs (#24977)

* transform multiple headings to list or paragraphs * fix e2e tests
WordPress · Sep 2, 2020 · 2d53ad1 · 2d53ad1
1 parent 87c4dc5
commit 2d53ad1
Show file tree

Hide file tree

Showing 3 changed files with 52 additions and 24 deletions.
diff --git a/packages/block-library/src/heading/transforms.js b/packages/block-library/src/heading/transforms.js
@@ -13,13 +13,15 @@ const transforms = {
 	from: [
 		{
 			type: 'block',
+			isMultiBlock: true,
 			blocks: [ 'core/paragraph' ],
-			transform: ( { content, anchor } ) => {
-				return createBlock( name, {
-					content,
-					anchor,
-				} );
-			},
+			transform: ( attributes ) =>
+				attributes.map( ( { content, anchor } ) =>
+					createBlock( name, {
+						content,
+						anchor,
+					} )
+				),
 		},
 		{
 			type: 'raw',
@@ -69,13 +71,15 @@ const transforms = {
 	to: [
 		{
 			type: 'block',
+			isMultiBlock: true,
 			blocks: [ 'core/paragraph' ],
-			transform: ( { content, anchor } ) => {
-				return createBlock( 'core/paragraph', {
-					content,
-					anchor,
-				} );
-			},
+			transform: ( attributes ) =>
+				attributes.map( ( { content, anchor } ) =>
+					createBlock( 'core/paragraph', {
+						content,
+						anchor,
+					} )
+				),
 		},
 	],
 };

diff --git a/packages/block-library/src/list/transforms.js b/packages/block-library/src/list/transforms.js
@@ -37,7 +37,7 @@ const transforms = {
 		{
 			type: 'block',
 			isMultiBlock: true,
-			blocks: [ 'core/paragraph' ],
+			blocks: [ 'core/paragraph', 'core/heading' ],
 			transform: ( blockAttributes ) => {
 				return createBlock( 'core/list', {
 					values: toHTMLString( {
@@ -157,6 +157,23 @@ const transforms = {
 					} )
 				),
 		},
+		{
+			type: 'block',
+			blocks: [ 'core/heading' ],
+			transform: ( { values } ) =>
+				split(
+					create( {
+						html: values,
+						multilineTag: 'li',
+						multilineWrapperTags: [ 'ul', 'ol' ],
+					} ),
+					__UNSTABLE_LINE_SEPARATOR
+				).map( ( piece ) =>
+					createBlock( 'core/heading', {
+						content: toHTMLString( { value: piece } ),
+					} )
+				),
+		},
 		{
 			type: 'block',
 			blocks: [ 'core/quote' ],

diff --git a/packages/e2e-tests/specs/editor/various/block-switcher.test.js b/packages/e2e-tests/specs/editor/various/block-switcher.test.js
@@ -24,12 +24,15 @@ describe( 'Block Switcher', () => {
 		expect( await hasBlockSwitcher() ).toBeTruthy();
 
 		// Verify the correct block transforms appear.
-		expect( await getAvailableBlockTransforms() ).toEqual( [
-			'Group',
-			'Paragraph',
-			'Quote',
-			'Pullquote',
-		] );
+		expect( await getAvailableBlockTransforms() ).toEqual(
+			expect.arrayContaining( [
+				'Group',
+				'Paragraph',
+				'Quote',
+				'Heading',
+				'Pullquote',
+			] )
+		);
 	} );
 
 	it( 'Should show the expected block transforms on the list block when the quote block is removed', async () => {
@@ -47,11 +50,14 @@ describe( 'Block Switcher', () => {
 		expect( await hasBlockSwitcher() ).toBeTruthy();
 
 		// Verify the correct block transforms appear.
-		expect( await getAvailableBlockTransforms() ).toEqual( [
-			'Group',
-			'Paragraph',
-			'Pullquote',
-		] );
+		expect( await getAvailableBlockTransforms() ).toEqual(
+			expect.arrayContaining( [
+				'Group',
+				'Paragraph',
+				'Pullquote',
+				'Heading',
+			] )
+		);
 	} );
 
 	it( 'Should not show the block switcher if all the blocks the list block transforms into are removed', async () => {
@@ -62,6 +68,7 @@ describe( 'Block Switcher', () => {
 				'core/pullquote',
 				'core/paragraph',
 				'core/group',
+				'core/heading',
 			].map( ( block ) => wp.blocks.unregisterBlockType( block ) );
 		} );