@wordpress/block-library 7.19.0 → 8.1.0

package/src/missing/edit.native.js

@@ -151,7 +151,8 @@ export class UnsupportedBlockEdit extends Component {
 		const infoTitle = sprintf( titleFormat, blockTitle );
 		const missingBlockDetail = applyFilters(
 			'native.missing_block_detail',
-			__( 'We are working hard to add more blocks with each release.' )
+			__( 'We are working hard to add more blocks with each release.' ),
+			blockName
 		);
 		const missingBlockActionButton = applyFilters(
 			'native.missing_block_action_button',
@@ -205,11 +206,17 @@ export class UnsupportedBlockEdit extends Component {
 					<Text style={ [ infoTextStyle, infoTitleStyle ] }>
 						{ infoTitle }
 					</Text>
-					{ isEditableInUnsupportedBlockEditor && (
-						<Text style={ [ infoTextStyle, infoDescriptionStyle ] }>
-							{ missingBlockDetail }
-						</Text>
-					) }
+					{ isEditableInUnsupportedBlockEditor &&
+						missingBlockDetail && (
+							<Text
+								style={ [
+									infoTextStyle,
+									infoDescriptionStyle,
+								] }
+							>
+								{ missingBlockDetail }
+							</Text>
+						) }
 				</View>
 				{ ( isUnsupportedBlockEditorSupported ||
 					canEnableUnsupportedBlockEditor ) &&

package/src/missing/test/edit-integration.native.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { initializeEditor, fireEvent, waitFor, within } from 'test/helpers';
+import { initializeEditor, fireEvent, within } from 'test/helpers';
 
 /**
  * WordPress dependencies
@@ -40,12 +40,12 @@ describe( 'Unsupported block', () => {
 		const initialHtml = `<!-- wp:table -->
 			 <figure class="wp-block-table"><table><tbody><tr><td>1</td><td>2</td></tr><tr><td>3</td><td>4</td></tr></tbody></table></figure>
 			 <!-- /wp:table -->`;
-		const { getByLabelText } = await initializeEditor( {
+		const screen = await initializeEditor( {
 			initialHtml,
 		} );
 
-		const missingBlock = await waitFor( () =>
-			getByLabelText( /Unsupported Block\. Row 1/ )
+		const [ missingBlock ] = await screen.findAllByLabelText(
+			/Unsupported Block\. Row 1/
 		);
 
 		const translatedTableTitle =
@@ -58,24 +58,22 @@ describe( 'Unsupported block', () => {
 		const initialHtml = `<!-- wp:table -->
 		 <figure class="wp-block-table"><table><tbody><tr><td>1</td><td>2</td></tr><tr><td>3</td><td>4</td></tr></tbody></table></figure>
 		 <!-- /wp:table -->`;
-		const { getByLabelText, getByText } = await initializeEditor( {
+		const screen = await initializeEditor( {
 			initialHtml,
 		} );
 
-		const missingBlock = await waitFor( () =>
-			getByLabelText( /Unsupported Block\. Row 1/ )
+		const [ missingBlock ] = await screen.findAllByLabelText(
+			/Unsupported Block\. Row 1/
 		);
 
 		fireEvent.press( missingBlock );
 
-		const helpButton = await waitFor( () =>
-			getByLabelText( 'Help button' )
-		);
+		const [ helpButton ] = await screen.findAllByLabelText( 'Help button' );
 
 		fireEvent.press( helpButton );
 
-		const bottomSheetTitle = await waitFor( () =>
-			getByText( '«Tabla» no es totalmente compatible' )
+		const bottomSheetTitle = await screen.findByText(
+			'«Tabla» no es totalmente compatible'
 		);
 
 		expect( bottomSheetTitle ).toBeDefined();

package/src/more/test/__snapshots__/edit.native.js.snap

@@ -0,0 +1,7 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`More block inserts block 1`] = `
+"<!-- wp:more -->
+<!--more-->
+<!-- /wp:more -->"
+`;

package/src/more/test/edit.native.js

@@ -0,0 +1,41 @@
+/**
+ * External dependencies
+ */
+import {
+	addBlock,
+	getEditorHtml,
+	initializeEditor,
+	getBlock,
+} from 'test/helpers';
+
+/**
+ * WordPress dependencies
+ */
+import { getBlockTypes, unregisterBlockType } from '@wordpress/blocks';
+import { registerCoreBlocks } from '@wordpress/block-library';
+
+beforeAll( () => {
+	// Register all core blocks
+	registerCoreBlocks();
+} );
+
+afterAll( () => {
+	// Clean up registered blocks
+	getBlockTypes().forEach( ( block ) => {
+		unregisterBlockType( block.name );
+	} );
+} );
+
+describe( 'More block', () => {
+	it( 'inserts block', async () => {
+		const screen = await initializeEditor();
+
+		// Add block
+		await addBlock( screen, 'More' );
+
+		// Get block
+		const moreBlock = await getBlock( screen, 'More' );
+		expect( moreBlock ).toBeVisible();
+		expect( getEditorHtml() ).toMatchSnapshot();
+	} );
+} );

package/src/navigation/edit/are-blocks-dirty.js

@@ -0,0 +1,51 @@
+export function areBlocksDirty( originalBlocks, blocks ) {
+	return ! isDeepEqual( originalBlocks, blocks, ( prop, x ) => {
+		// Skip inner blocks of page list during comparison as they
+		// are **always** controlled and may be updated async due to
+		// syncing with entity records. Left unchecked this would
+		// inadvertently trigger the dirty state.
+		if ( x?.name === 'core/page-list' && prop === 'innerBlocks' ) {
+			return true;
+		}
+	} );
+}
+
+/**
+ * Conditionally compares two candidates for deep equality.
+ * Provides an option to skip a given property of an object during comparison.
+ *
+ * @param {*}                  x          1st candidate for comparison
+ * @param {*}                  y          2nd candidate for comparison
+ * @param {Function|undefined} shouldSkip a function which can be used to skip a given property of an object.
+ * @return {boolean}                      whether the two candidates are deeply equal.
+ */
+const isDeepEqual = ( x, y, shouldSkip ) => {
+	if ( x === y ) {
+		return true;
+	} else if (
+		typeof x === 'object' &&
+		x !== null &&
+		x !== undefined &&
+		typeof y === 'object' &&
+		y !== null &&
+		y !== undefined
+	) {
+		if ( Object.keys( x ).length !== Object.keys( y ).length ) return false;
+
+		for ( const prop in x ) {
+			if ( y.hasOwnProperty( prop ) ) {
+				// Afford skipping a given property of an object.
+				if ( shouldSkip && shouldSkip( prop, x ) ) {
+					return true;
+				}
+
+				if ( ! isDeepEqual( x[ prop ], y[ prop ], shouldSkip ) )
+					return false;
+			} else return false;
+		}
+
+		return true;
+	}
+
+	return false;
+};