Merge pull request #949 from wordpress-mobile/fix/android-rich-text-e…

…rrors

Fix android rich text errors

jest/setup.js

@@ -1,3 +1,8 @@
+/**
+ * External dependencies
+ */
+import { NativeModules } from 'react-native';
+
 jest.mock( '../react-native-gutenberg-bridge', () => {
 	return {
 		addEventListener: jest.fn(),
@@ -36,3 +41,22 @@ if ( ! global.window.matchMedia ) {
 		removeListener: () => {},
 	} );
 }
+
+// Overwrite some native module mocks from `react-native` jest preset:
+// https://github.com/facebook/react-native/blob/master/jest/setup.js
+// to fix issue "TypeError: Cannot read property 'Commands' of undefined"
+// raised when calling focus or blur on a native component
+const mockNativeModules = {
+	UIManager: {
+		...NativeModules.UIManager,
+		getViewManagerConfig: jest.fn( () => ( { Commands: {} } ) ),
+	},
+};
+
+Object.keys( mockNativeModules ).forEach( ( module ) => {
+	try {
+		jest.doMock( module, () => mockNativeModules[ module ] ); // needed by FacebookSDK-test
+	} catch ( error ) {
+		jest.doMock( module, () => mockNativeModules[ module ], { virtual: true } );
+	}
+} );

react-native-aztec/android/build.gradle

@@ -12,7 +12,7 @@ buildscript {
         wordpressUtilsVersion = '1.22'
         espressoVersion = '3.0.1'
 
-        aztecVersion = 'v1.3.26'
+        aztecVersion = 'gb-stray-selection-fix-try1'
     }
 
     repositories {

react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecText.java

@@ -84,6 +84,8 @@ public class ReactAztecText extends AztecText {
     public ReactAztecText(ThemedReactContext reactContext) {
         super(reactContext);
 
+        setGutenbergMode(true);
+
         // don't auto-focus when Aztec becomes visible.
         // Needed on rotation and multiple Aztec instances to avoid losing the exact care position.
         setFocusOnVisible(false);

src/block-management/block-holder.js

@@ -26,7 +26,6 @@ import {
 import { withDispatch, withSelect } from '@wordpress/data';
 import { compose } from '@wordpress/compose';
 import { addAction, removeAction, hasAction } from '@wordpress/hooks';
-import { getBlockType } from '@wordpress/blocks';
 import { BlockEdit } from '@wordpress/block-editor';
 
 /**
@@ -124,39 +123,6 @@ export class BlockHolder extends React.Component<PropsType, StateType> {
 		}
 	};
 
-	mergeBlocks = ( forward: boolean = false ) => {
-		const {
-			clientId,
-			getPreviousBlockClientId,
-			getNextBlockClientId,
-			mergeBlocks,
-		} = this.props;
-
-		const previousBlockClientId = getPreviousBlockClientId( clientId );
-		const nextBlockClientId = getNextBlockClientId( clientId );
-
-		// Do nothing when it's the first block.
-		if (
-			( ! forward && ! previousBlockClientId ) ||
-			( forward && ! nextBlockClientId )
-		) {
-			return;
-		}
-
-		if ( forward ) {
-			mergeBlocks( clientId, nextBlockClientId );
-		} else {
-			const name = this.props.getBlockName( previousBlockClientId );
-			const blockType = getBlockType( name );
-			// The default implementation does only focus the previous block if it's not mergeable
-			// We don't want to move the focus for now, just keep for and caret at the beginning of the current block.
-			if ( ! blockType.merge ) {
-				return;
-			}
-			mergeBlocks( previousBlockClientId, clientId );
-		}
-	};
-
 	renderToolbar() {
 		if ( ! this.props.isSelected ) {
 			return null;
@@ -182,7 +148,7 @@ export class BlockHolder extends React.Component<PropsType, StateType> {
 				onFocus={ this.onFocus }
 				onReplace={ this.props.onReplace }
 				insertBlocksAfter={ this.insertBlocksAfter }
-				mergeBlocks={ this.mergeBlocks }
+				mergeBlocks={ this.props.mergeBlocks }
 				onCaretVerticalPositionChange={ this.props.onCaretVerticalPositionChange }
 				clientId={ this.props.clientId }
 			/>
@@ -256,9 +222,8 @@ export default compose( [
 			name,
 		};
 	} ),
-	withDispatch( ( dispatch, { clientId, rootClientId } ) => {
+	withDispatch( ( dispatch, { clientId, rootClientId }, { select } ) => {
 		const {
-			clearSelectedBlock,
 			insertBlocks,
 			mergeBlocks,
 			moveBlocksDown,
@@ -270,7 +235,24 @@ export default compose( [
 		} = dispatch( 'core/block-editor' );
 
 		return {
-			mergeBlocks,
+			mergeBlocks( forward ) {
+				const {
+					getPreviousBlockClientId,
+					getNextBlockClientId,
+				} = select( 'core/block-editor' );
+
+				if ( forward ) {
+					const nextBlockClientId = getNextBlockClientId( clientId );
+					if ( nextBlockClientId ) {
+						mergeBlocks( clientId, nextBlockClientId );
+					}
+				} else {
+					const previousBlockClientId = getPreviousBlockClientId( clientId );
+					if ( previousBlockClientId ) {
+						mergeBlocks( previousBlockClientId, clientId );
+					}
+				}
+			},
 			moveBlockDown() {
 				moveBlocksDown( clientId );
 			},
@@ -284,7 +266,6 @@ export default compose( [
 				insertBlocks( blocks, index, rootClientId );
 			},
 			onSelect: ( selectedClientId: string ) => {
-				clearSelectedBlock();
 				selectBlock( selectedClientId );
 			},
 			onChange: ( attributes: Object ) => {

src/block-management/block-manager.js

@@ -42,7 +42,7 @@ type PropsType = {
 	rootClientId: ?string,
 	blockClientIds: Array<string>,
 	blockCount: number,
-	focusBlock: ( clientId: string ) => void,
+	selectBlock: ( clientId: string ) => void,
 	insertBlock: ( block: BlockType, position: number ) => void,
 	replaceBlock: ( string, BlockType ) => mixed,
 	getBlockName: string => string,
@@ -123,7 +123,7 @@ export class BlockManager extends React.Component<PropsType, StateType> {
 		}
 
 		// now set the focus
-		this.props.focusBlock( newBlock.clientId );
+		this.props.selectBlock( newBlock.clientId );
 	}
 
 	onSafeAreaInsetsUpdate( result: Object ) {
@@ -378,18 +378,14 @@ export default compose( [
 	} ),
 	withDispatch( ( dispatch ) => {
 		const {
-			clearSelectedBlock,
 			insertBlock,
 			replaceBlock,
 			selectBlock,
 		} = dispatch( 'core/block-editor' );
 
 		return {
 			insertBlock,
-			focusBlock: ( clientId ) => {
-				clearSelectedBlock();
-				selectBlock( clientId );
-			},
+			selectBlock,
 			replaceBlock,
 		};
 	} ),