Issue-2115: Reintroduce transformation unit tests for CoBlocks Galler…

…ies to Core (#2382) * Unskip all gallery to core transform tests Refactor transform tests to verify image url * Reformat gallery trasform tests to pass linter * Add Adam Frank as a contributor Co-authored-by: Adam Frank <adam@extrudify.io> Co-authored-by: Olivier Lafleur <olafleur@godaddy.com>
godaddy-wordpress · May 19, 2022 · a595910 · a595910
1 parent 8c0fb99
commit a595910
Show file tree

Hide file tree

Showing 6 changed files with 56 additions and 59 deletions.
diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md
@@ -52,3 +52,4 @@ This list is manually curated to include valuable contributions by volunteers th
 | @ehamwey          |                        |
 | @amenk            |                        |
 | @frozzare         |                        |
+| @adamf59          | @afrankgodaddy         |
diff --git a/src/blocks/gallery-carousel/test/transforms.spec.js b/src/blocks/gallery-carousel/test/transforms.spec.js
@@ -22,8 +22,8 @@ describe( 'coblocks/gallery-carousel transforms', () => {
 		] };
 
 	const innerBlocks = [
-		createBlock( 'core/image', attributes.images[0], [] ),
-		createBlock( 'core/image', attributes.images[1], [] )
+		createBlock( 'core/image', attributes.images[ 0 ], [ ] ),
+		createBlock( 'core/image', attributes.images[ 1 ], [ ] ),
 	];
 
 	beforeAll( () => {
@@ -98,7 +98,7 @@ describe( 'coblocks/gallery-carousel transforms', () => {
 	} );
 
 	it( 'should transform from core/image block only if match', () => {
-		expect( transforms.from[ 2 ].isMatch( [ { id: 1234, url: 'someUrl' }, { id: "1234", url: 'someUrl' } ] ) ).toHaveLength( 1 );
+		expect( transforms.from[ 2 ].isMatch( [ { id: 1234, url: 'someUrl' }, { id: '1234', url: 'someUrl' } ] ) ).toHaveLength( 1 );
 	} );
 
 	it( 'should transform to coblocks/gallery-stacked block', () => {
@@ -144,15 +144,14 @@ describe( 'coblocks/gallery-carousel transforms', () => {
 		}
 	} );
 
-	it.skip( 'should transform to core/gallery block', () => {
+	it( 'should transform to core/gallery block', () => {
 		const block = createBlock( name, attributes );
 		const transformed = switchToBlockType( block, 'core/gallery' );
 
 		expect( transformed[ 0 ].isValid ).toBe( true );
-		for ( let i = 0; i < attributes.images.length; i++ ) {
-			expect( transformed[ 0 ].attributes.images[ i ].index ).toBe( attributes.images[ i ].index );
-			expect( transformed[ 0 ].attributes.images[ i ].url ).toBe( attributes.images[ i ].url );
-		}
+		attributes.images.forEach( ( image, index ) => {
+			expect( transformed[ 0 ].innerBlocks[ index ].attributes.url ).toBe( image.url );
+		} );
 	} );
 
 	it( 'should transform when ":carousel" prefix is seen', () => {
@@ -167,7 +166,7 @@ describe( 'coblocks/gallery-carousel transforms', () => {
 			createBlock( 'core/image', { id: 0, url: 'http://local.domain/image.jpg' } ),
 			createBlock( 'core/image', { id: 1, url: 'http://local.domain/image.jpg' } ),
 		];
-		const transformed = switchToBlockType( coreImageBlocks, name )[0];
+		const transformed = switchToBlockType( coreImageBlocks, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		expect( transformed.attributes.images.length ).toBeGreaterThan( 0 );

diff --git a/src/blocks/gallery-collage/test/transforms.spec.js b/src/blocks/gallery-collage/test/transforms.spec.js
@@ -22,8 +22,8 @@ describe( 'coblocks/gallery-collage transforms', () => {
 		] };
 
 	const innerBlocks = [
-		createBlock( 'core/image', attributes.images[0], [] ),
-		createBlock( 'core/image', attributes.images[1], [] )
+		createBlock( 'core/image', attributes.images[ 0 ], [ ] ),
+		createBlock( 'core/image', attributes.images[ 1 ], [ ] ),
 	];
 
 	beforeAll( () => {
@@ -98,7 +98,7 @@ describe( 'coblocks/gallery-collage transforms', () => {
 	} );
 
 	it( 'should transform from core/image block only if match', () => {
-		expect( transforms.from[ 2 ].isMatch( [ { id: 1234, url: 'someUrl' }, { id: "1234", url: 'someUrl' } ] ) ).toHaveLength( 1 );
+		expect( transforms.from[ 2 ].isMatch( [ { id: 1234, url: 'someUrl' }, { id: '1234', url: 'someUrl' } ] ) ).toHaveLength( 1 );
 	} );
 
 	it( 'should transform to coblocks/gallery-stacked block', () => {
@@ -114,7 +114,7 @@ describe( 'coblocks/gallery-collage transforms', () => {
 
 	it( 'should transform to coblocks/gallery-masonry block', () => {
 		const block = createBlock( name, attributes );
-		const transformed = switchToBlockType( block, 'coblocks/gallery-masonry' )[0];
+		const transformed = switchToBlockType( block, 'coblocks/gallery-masonry' )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		transformed.innerBlocks.forEach( ( image, index ) => {
@@ -144,15 +144,14 @@ describe( 'coblocks/gallery-collage transforms', () => {
 		}
 	} );
 
-	it.skip( 'should transform to core/gallery block', () => {
+	it( 'should transform to core/gallery block', () => {
 		const block = createBlock( name, attributes );
 		const transformed = switchToBlockType( block, 'core/gallery' );
 
 		expect( transformed[ 0 ].isValid ).toBe( true );
-		for ( let i = 0; i < attributes.images.length; i++ ) {
-			expect( transformed[ 0 ].attributes.images[ i ].index ).toBe( attributes.images[ i ].index );
-			expect( transformed[ 0 ].attributes.images[ i ].url ).toBe( attributes.images[ i ].url );
-		}
+		attributes.images.forEach( ( image, index ) => {
+			expect( transformed[ 0 ].innerBlocks[ index ].attributes.url ).toBe( image.url );
+		} );
 	} );
 
 	it( 'should transform when ":collage" prefix is seen', () => {
@@ -167,7 +166,7 @@ describe( 'coblocks/gallery-collage transforms', () => {
 			createBlock( 'core/image', { id: 0, url: 'http://local.domain/image.jpg' } ),
 			createBlock( 'core/image', { id: 1, url: 'http://local.domain/image.jpg' } ),
 		];
-		const transformed = switchToBlockType( coreImageBlocks, name )[0];
+		const transformed = switchToBlockType( coreImageBlocks, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		expect( transformed.attributes.images.length ).toBeGreaterThan( 0 );

diff --git a/src/blocks/gallery-masonry/test/transforms.spec.js b/src/blocks/gallery-masonry/test/transforms.spec.js
@@ -22,8 +22,8 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 
 	const masonryAttributes = {};
 	const innerBlocks = [
-		createBlock( 'core/image', sharedAttributes.images[0], [] ),
-		createBlock( 'core/image', sharedAttributes.images[1], [] )
+		createBlock( 'core/image', sharedAttributes.images[ 0 ], [ ] ),
+		createBlock( 'core/image', sharedAttributes.images[ 1 ], [ ] ),
 	];
 
 	beforeAll( () => {
@@ -33,7 +33,7 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 
 	it( 'should transform from coblocks/gallery-stacked block', () => {
 		const galleryStacked = createBlock( 'coblocks/gallery-stacked',	sharedAttributes );
-		const transformed = switchToBlockType( galleryStacked, name )[0];
+		const transformed = switchToBlockType( galleryStacked, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		transformed.innerBlocks.forEach( ( image, index ) => {
@@ -44,7 +44,7 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 
 	it( 'should transform from coblocks/gallery-collage block', () => {
 		const galleryCollage = createBlock( 'coblocks/gallery-collage', sharedAttributes );
-		const transformed = switchToBlockType( galleryCollage, name )[0];
+		const transformed = switchToBlockType( galleryCollage, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		transformed.innerBlocks.forEach( ( image, index ) => {
@@ -55,7 +55,7 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 
 	it( 'should transform from coblocks/gallery-offset block', () => {
 		const galleryOffset = createBlock( 'coblocks/gallery-offset', sharedAttributes );
-		const transformed = switchToBlockType( galleryOffset, name )[0];
+		const transformed = switchToBlockType( galleryOffset, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		transformed.innerBlocks.forEach( ( image, index ) => {
@@ -66,7 +66,7 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 
 	it( 'should transform from coblocks/gallery-carousel block', () => {
 		const galleryCarousel = createBlock( 'coblocks/gallery-carousel', sharedAttributes );
-		const transformed = switchToBlockType( galleryCarousel, name )[0];
+		const transformed = switchToBlockType( galleryCarousel, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		transformed.innerBlocks.forEach( ( image, index ) => {
@@ -77,7 +77,7 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 
 	it( 'should transform from core/gallery block', () => {
 		const coreGallery = createBlock( 'core/gallery', { images: sharedAttributes.images } );
-		const transformed = switchToBlockType( coreGallery, name )[0];
+		const transformed = switchToBlockType( coreGallery, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		transformed.innerBlocks.forEach( ( image, index ) => {
@@ -87,22 +87,22 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 	} );
 
 	it( 'should transform from core/image block', () => {
-		const coreImage = createBlock( 'core/image', { id:sharedAttributes.images[ 0 ].index, url:sharedAttributes.images[ 0 ].url } );
-		const transformed = switchToBlockType( coreImage, name )[0];
+		const coreImage = createBlock( 'core/image', { id: sharedAttributes.images[ 0 ].index, url: sharedAttributes.images[ 0 ].url } );
+		const transformed = switchToBlockType( coreImage, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		expect( transformed.innerBlocks.length ).toBeGreaterThan( 0 );
 
-		expect( transformed.innerBlocks[0].attributes.id ).toBe( coreImage.attributes.id );
-		expect( transformed.innerBlocks[0].attributes.url ).toBe( coreImage.attributes.url );
+		expect( transformed.innerBlocks[ 0 ].attributes.id ).toBe( coreImage.attributes.id );
+		expect( transformed.innerBlocks[ 0 ].attributes.url ).toBe( coreImage.attributes.url );
 	} );
 
 	it( 'should transform from multiple core/image blocks', () => {
 		const coreImageBlocks = [
 			createBlock( 'core/image', { id: 0, url: 'http://local.domain/image.jpg' } ),
 			createBlock( 'core/image', { id: 1, url: 'http://local.domain/image.jpg' } ),
 		];
-		const transformed = switchToBlockType( coreImageBlocks, name )[0];
+		const transformed = switchToBlockType( coreImageBlocks, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		expect( transformed.innerBlocks.length ).toBeGreaterThan( 0 );
@@ -121,7 +121,7 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 		sharedAttributes.images.forEach( ( image, index ) => {
 			expect( transformed[ 0 ].attributes.images[ index ].index ).toBe( index );
 			expect( transformed[ 0 ].attributes.images[ index ].url ).toBe( image.url );
-		} )
+		} );
 	} );
 
 	it( 'should transform to coblocks/gallery-collage block', () => {
@@ -132,7 +132,7 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 		sharedAttributes.images.forEach( ( image, index ) => {
 			expect( transformed[ 0 ].attributes.images[ index ].index ).toBe( index );
 			expect( transformed[ 0 ].attributes.images[ index ].url ).toBe( image.url );
-		} )
+		} );
 	} );
 
 	it( 'should transform to coblocks/gallery-offset block', () => {
@@ -143,7 +143,7 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 		sharedAttributes.images.forEach( ( image, index ) => {
 			expect( transformed[ 0 ].attributes.images[ index ].index ).toBe( index );
 			expect( transformed[ 0 ].attributes.images[ index ].url ).toBe( image.url );
-		} )
+		} );
 	} );
 
 	it( 'should transform to coblocks/gallery-carousel block', () => {
@@ -154,17 +154,16 @@ describe( 'coblocks/gallery-masonry transforms', () => {
 		sharedAttributes.images.forEach( ( image, index ) => {
 			expect( transformed[ 0 ].attributes.images[ index ].index ).toBe( index );
 			expect( transformed[ 0 ].attributes.images[ index ].url ).toBe( image.url );
-		} )
+		} );
 	} );
 
-	it.skip( 'should transform to core/gallery block', () => {
+	it( 'should transform to core/gallery block', () => {
 		const block = createBlock( name, masonryAttributes, innerBlocks );
 		const transformed = switchToBlockType( block, 'core/gallery' );
 
 		expect( transformed[ 0 ].isValid ).toBe( true );
 		sharedAttributes.images.forEach( ( image, index ) => {
-			expect( transformed[ 0 ].attributes.images[ index ].index ).toBe( index );
-			expect( transformed[ 0 ].attributes.images[ index ].url ).toBe( image.url );
+			expect( transformed[ 0 ].innerBlocks[ index ].attributes.url ).toBe( image.url );
 		} );
 	} );
 

diff --git a/src/blocks/gallery-offset/test/transforms.spec.js b/src/blocks/gallery-offset/test/transforms.spec.js
@@ -19,12 +19,13 @@ describe( 'coblocks/gallery-offset transforms', () => {
 		images: [
 			{ index: 0, url: 'https://s.w.org/images/core/5.3/Windbuchencom.jpg' },
 			{ index: 1, url: 'https://s.w.org/images/core/5.3/Glacial_lakes,_Bhutan.jpg' },
-		] };
+		],
+	};
 
-		const innerBlocks = [
-			createBlock( 'core/image', attributes.images[0], [] ),
-			createBlock( 'core/image', attributes.images[1], [] )
-		];
+	const innerBlocks = [
+		createBlock( 'core/image', attributes.images[ 0 ], [ ] ),
+		createBlock( 'core/image', attributes.images[ 1 ], [ ] ),
+	];
 
 	beforeAll( () => {
 		// Register all gallery blocks.
@@ -98,7 +99,7 @@ describe( 'coblocks/gallery-offset transforms', () => {
 	} );
 
 	it( 'should transform from core/image block only if match', () => {
-		expect( transforms.from[ 2 ].isMatch( [ { id: 1234, url: 'someUrl' }, { id: "1234", url: 'someUrl' } ] ) ).toHaveLength( 1 );
+		expect( transforms.from[ 2 ].isMatch( [ { id: 1234, url: 'someUrl' }, { id: '1234', url: 'someUrl' } ] ) ).toHaveLength( 1 );
 	} );
 
 	it( 'should transform to coblocks/gallery-stacked block', () => {
@@ -144,15 +145,14 @@ describe( 'coblocks/gallery-offset transforms', () => {
 		}
 	} );
 
-	it.skip( 'should transform to core/gallery block', () => {
+	it( 'should transform to core/gallery block', () => {
 		const block = createBlock( name, attributes );
 		const transformed = switchToBlockType( block, 'core/gallery' );
 
 		expect( transformed[ 0 ].isValid ).toBe( true );
-		for ( let i = 0; i < attributes.images.length; i++ ) {
-			expect( transformed[ 0 ].attributes.images[ i ].index ).toBe( attributes.images[ i ].index );
-			expect( transformed[ 0 ].attributes.images[ i ].url ).toBe( attributes.images[ i ].url );
-		}
+		attributes.images.forEach( ( image, index ) => {
+			expect( transformed[ 0 ].innerBlocks[ index ].attributes.url ).toBe( image.url );
+		} );
 	} );
 
 	it( 'should transform when ":offset" prefix is seen', () => {
@@ -167,7 +167,7 @@ describe( 'coblocks/gallery-offset transforms', () => {
 			createBlock( 'core/image', { id: 0, url: 'http://local.domain/image.jpg' } ),
 			createBlock( 'core/image', { id: 1, url: 'http://local.domain/image.jpg' } ),
 		];
-		const transformed = switchToBlockType( coreImageBlocks, name )[0];
+		const transformed = switchToBlockType( coreImageBlocks, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		expect( transformed.attributes.images.length ).toBeGreaterThan( 0 );

diff --git a/src/blocks/gallery-stacked/test/transforms.spec.js b/src/blocks/gallery-stacked/test/transforms.spec.js
@@ -21,8 +21,8 @@ describe( 'coblocks/gallery-stacked transforms', () => {
 		] };
 
 	const innerBlocks = [
-		createBlock( 'core/image', attributes.images[0], [] ),
-		createBlock( 'core/image', attributes.images[1], [] )
+		createBlock( 'core/image', attributes.images[ 0 ], [] ),
+		createBlock( 'core/image', attributes.images[ 1 ], [] ),
 	];
 
 	beforeAll( () => {
@@ -117,7 +117,7 @@ describe( 'coblocks/gallery-stacked transforms', () => {
 
 	it( 'should transform to coblocks/gallery-masonry block', () => {
 		const block = createBlock( name, attributes );
-		const transformed = switchToBlockType( block, 'coblocks/gallery-masonry' )[0];
+		const transformed = switchToBlockType( block, 'coblocks/gallery-masonry' )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		transformed.innerBlocks.forEach( ( image, index ) => {
@@ -147,15 +147,14 @@ describe( 'coblocks/gallery-stacked transforms', () => {
 		}
 	} );
 
-	it.skip( 'should transform to core/gallery block', () => {
+	it( 'should transform to core/gallery block', () => {
 		const block = createBlock( name, attributes );
 		const transformed = switchToBlockType( block, 'core/gallery' );
 
 		expect( transformed[ 0 ].isValid ).toBe( true );
-		for ( let i = 0; i < attributes.images.length; i++ ) {
-			expect( transformed[ 0 ].attributes.images[ i ].index ).toBe( attributes.images[ i ].index );
-			expect( transformed[ 0 ].attributes.images[ i ].url ).toBe( attributes.images[ i ].url );
-		}
+		attributes.images.forEach( ( image, index ) => {
+			expect( transformed[ 0 ].innerBlocks[ index ].attributes.url ).toBe( image.url );
+		} );
 	} );
 
 	it( 'should transform when ":stacked" prefix is seen', () => {
@@ -170,7 +169,7 @@ describe( 'coblocks/gallery-stacked transforms', () => {
 			createBlock( 'core/image', { id: 0, url: 'http://local.domain/image.jpg' } ),
 			createBlock( 'core/image', { id: 1, url: 'http://local.domain/image.jpg' } ),
 		];
-		const transformed = switchToBlockType( coreImageBlocks, name )[0];
+		const transformed = switchToBlockType( coreImageBlocks, name )[ 0 ];
 
 		expect( transformed.isValid ).toBe( true );
 		expect( transformed.attributes.images.length ).toBeGreaterThan( 0 );