Get latest changes from gb mobile

WordPress · Apr 17, 2019 · 3d29632 · 3d29632
1 parent 6f48f03
commit 3d29632
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 3 deletions.
diff --git a/packages/block-editor/src/components/block-inspector/index.native.js b/packages/block-editor/src/components/block-inspector/index.native.js
@@ -49,6 +49,7 @@ export default class BlockInspector extends Component {
 		return (
 			<View style={ styles.toolbar }>
 				<ToolbarButton
+					accessibilityLabel={ __( 'Move up' ) }
 					label={ __( 'Move up' ) }
 					isDisabled={ ! this.props.canMoveUp }
 					onClick={ this.onUpPressed }

diff --git a/packages/block-editor/src/components/block-list/block.native.js b/packages/block-editor/src/components/block-list/block.native.js
@@ -172,10 +172,22 @@ export class BlockListBlock extends Component {
 		const borderColor = isSelected ? focusedBorderColor : 'transparent';
 
 		return (
-			<TouchableWithoutFeedback onPress={ this.onFocus } >
+			// accessible prop needs to be false to access children
+			// https://facebook.github.io/react-native/docs/accessibility#accessible-ios-android
+			<TouchableWithoutFeedback
+				accessible={ false }
+				accessibilityLabel="block-container"
+				onPress={ this.onFocus }
+			>
 				<View style={ [ styles.blockHolder, borderStyle, { borderColor } ] }>
 					{ this.props.showTitle && this.renderBlockTitle() }
-					<View style={ [ ! isSelected && styles.blockContainer, isSelected && styles.blockContainerFocused ] }>{ this.getBlockForType() }</View>
+					<View
+						accessibile={ true }
+						accessibilityLabel={ this.props.testID }
+						style={ [ ! isSelected && styles.blockContainer, isSelected && styles.blockContainerFocused ] }
+					>
+						{ this.getBlockForType() }
+					</View>
 					{ this.renderToolbar() }
 				</View>
 			</TouchableWithoutFeedback>

diff --git a/packages/block-editor/src/components/block-list/index.native.js b/packages/block-editor/src/components/block-list/index.native.js
@@ -149,6 +149,7 @@ export class BlockList extends Component {
 			<View style={ { flex: 1 } } >
 				<KeyboardAwareFlatList
 					{ ...( Platform.OS === 'android' ? { removeClippedSubviews: false } : {} ) } // Disable clipping on Android to fix focus losing. See https://github.com/wordpress-mobile/gutenberg-mobile/pull/741#issuecomment-472746541
+					accessibilityLabel="block-list"
 					innerRef={ this.scrollViewInnerRef }
 					blockToolbarHeight={ toolbarStyles.container.height }
 					innerToolbarHeight={ inlineToolbarStyles.toolbar.height + blockHolderStyles.blockContainerFocused.paddingBottom }
@@ -207,13 +208,15 @@ export class BlockList extends Component {
 
 	renderItem( value ) {
 		const clientId = value.item;
+		const testID = `block-${ value.index }-${ this.props.getBlockName( clientId ) }`;
 
 		return (
 			<ReadableContentView>
 				<BlockListBlock
 					key={ clientId }
 					showTitle={ false }
 					clientId={ clientId }
+					testID={ testID }
 					rootClientId={ this.props.rootClientId }
 					onCaretVerticalPositionChange={ this.onCaretVerticalPositionChange }
 					borderStyle={ this.blockHolderBorderStyle() }
@@ -235,6 +238,7 @@ export default compose( [
 	withSelect( ( select, { rootClientId } ) => {
 		const {
 			getBlockCount,
+			getBlockName,
 			getBlockIndex,
 			getBlockOrder,
 			getSelectedBlock,
@@ -247,6 +251,7 @@ export default compose( [
 		return {
 			blockClientIds: getBlockOrder( rootClientId ),
 			blockCount: getBlockCount( rootClientId ),
+			getBlockName,
 			isBlockSelected,
 			selectedBlock: getSelectedBlock(),
 			selectedBlockClientId,

diff --git a/packages/block-editor/src/components/block-toolbar/index.native.js b/packages/block-editor/src/components/block-toolbar/index.native.js
@@ -53,7 +53,7 @@ export class BlockToolbar extends Component {
 					alwaysBounceHorizontal={ false }
 					contentContainerStyle={ styles.scrollableContent }
 				>
-					<Toolbar>
+					<Toolbar accessible={ false }>
 						<ToolbarButton
 							title={ __( 'Add block' ) }
 							icon={ ( <Dashicon icon="plus-alt" style={ styles.addBlockButton } color={ styles.addBlockButton.color } /> ) }
@@ -65,12 +65,14 @@ export class BlockToolbar extends Component {
 							icon="undo"
 							isDisabled={ ! hasUndo }
 							onClick={ undo }
+							extraProps={ { hint: __( 'Double tap to undo last change' ) } }
 						/>
 						<ToolbarButton
 							title={ __( 'Redo' ) }
 							icon="redo"
 							isDisabled={ ! hasRedo }
 							onClick={ redo }
+							extraProps={ { hint: __( 'Double tap to redo last change' ) } }
 						/>
 					</Toolbar>
 					<BlockControls.Slot />
@@ -82,6 +84,7 @@ export class BlockToolbar extends Component {
 						title={ __( 'Hide keyboard' ) }
 						icon="keyboard-hide"
 						onClick={ this.onKeyboardHide }
+						extraProps={ { hint: __( 'Tap to hide the keyboard' ) } }
 					/>
 				</Toolbar> ) }
 			</View>

diff --git a/packages/block-editor/src/components/inserter/index.native.js b/packages/block-editor/src/components/inserter/index.native.js
@@ -44,6 +44,7 @@ class Inserter extends Component {
 							style={ styles.touchableArea }
 							underlayColor={ 'transparent' }
 							activeOpacity={ .5 }
+							accessibilityLabel={ item.title }
 							onPress={ () => this.props.onValueSelected( item.name ) }>
 							<View style={ styles.modalItem }>
 								<View style={ styles.modalIconWrapper }>