From 2dc04e17015b1d614e303db1a5c6bc70d6b365f2 Mon Sep 17 00:00:00 2001
From: Pinar Olguc <pinarolguc@gmail.com>
Date: Tue, 23 Apr 2019 18:24:13 +0300
Subject: [PATCH 1/2] Add accessibility label for unselected state

---
 .../src/paragraph/edit.native.js              | 30 +++++++++++++++++--
 1 file changed, 27 insertions(+), 3 deletions(-)

diff --git a/packages/block-library/src/paragraph/edit.native.js b/packages/block-library/src/paragraph/edit.native.js
index f7d26d596a656e..4694b655c15836 100644
--- a/packages/block-library/src/paragraph/edit.native.js
+++ b/packages/block-library/src/paragraph/edit.native.js
@@ -2,6 +2,7 @@
  * External dependencies
  */
 import { View } from 'react-native';
+import { isEmpty } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -22,6 +23,12 @@ class ParagraphEdit extends Component {
 		super( props );
 		this.splitBlock = this.splitBlock.bind( this );
 		this.onReplace = this.onReplace.bind( this );
+		this.onFocus = this.onFocus.bind( this );
+		this.onBlur = this.onBlur.bind( this );
+
+		this.state = {
+			isSelected: false,
+		};
 	}
 
 	/**
@@ -81,6 +88,20 @@ class ParagraphEdit extends Component {
 		) ) );
 	}
 
+	onFocus() {
+		this.setState( { isSelected: true } );
+		if ( this.props.onFocus ) {
+			this.props.onFocus();
+		}
+	}
+
+	onBlur() {
+		this.setState( { isSelected: false } );
+		if ( this.props.onBlur ) {
+			this.props.onBlur();
+		}
+	}
+
 	render() {
 		const {
 			attributes,
@@ -95,13 +116,16 @@ class ParagraphEdit extends Component {
 		} = attributes;
 
 		return (
-			<View>
+			<View
+				accessible={ ! this.state.isSelected }
+				accessibilityLabel={ __( 'Paragraph block' ) + __( '.' ) + ' ' + ( isEmpty( content ) ? __( 'Empty' ) : content ) }
+			>
 				<RichText
 					tagName="p"
 					value={ content }
 					isSelected={ this.props.isSelected }
-					onFocus={ this.props.onFocus } // always assign onFocus as a props
-					onBlur={ this.props.onBlur } // always assign onBlur as a props
+					onFocus={ this.onFocus }
+					onBlur={ this.onBlur }
 					onCaretVerticalPositionChange={ this.props.onCaretVerticalPositionChange }
 					style={ style }
 					onChange={ ( nextContent ) => {

From 04e18f29ab9c883a75f48a935e118231ba913e6c Mon Sep 17 00:00:00 2001
From: Pinar Olguc <pinarolguc@gmail.com>
Date: Wed, 24 Apr 2019 12:39:43 +0300
Subject: [PATCH 2/2] Improve accessibility handling

---
 .../src/paragraph/edit.native.js              | 32 +++++++------------
 1 file changed, 11 insertions(+), 21 deletions(-)

diff --git a/packages/block-library/src/paragraph/edit.native.js b/packages/block-library/src/paragraph/edit.native.js
index 4694b655c15836..876aa5795298f1 100644
--- a/packages/block-library/src/paragraph/edit.native.js
+++ b/packages/block-library/src/paragraph/edit.native.js
@@ -11,6 +11,7 @@ import { __ } from '@wordpress/i18n';
 import { Component } from '@wordpress/element';
 import { createBlock } from '@wordpress/blocks';
 import { RichText } from '@wordpress/block-editor';
+import { create } from '@wordpress/rich-text';
 
 /**
  * Internal dependencies
@@ -23,12 +24,6 @@ class ParagraphEdit extends Component {
 		super( props );
 		this.splitBlock = this.splitBlock.bind( this );
 		this.onReplace = this.onReplace.bind( this );
-		this.onFocus = this.onFocus.bind( this );
-		this.onBlur = this.onBlur.bind( this );
-
-		this.state = {
-			isSelected: false,
-		};
 	}
 
 	/**
@@ -88,18 +83,12 @@ class ParagraphEdit extends Component {
 		) ) );
 	}
 
-	onFocus() {
-		this.setState( { isSelected: true } );
-		if ( this.props.onFocus ) {
-			this.props.onFocus();
-		}
-	}
-
-	onBlur() {
-		this.setState( { isSelected: false } );
-		if ( this.props.onBlur ) {
-			this.props.onBlur();
+	plainTextContent( html ) {
+		const result = create( { html } );
+		if ( result ) {
+			return result.text;
 		}
+		return '';
 	}
 
 	render() {
@@ -117,15 +106,16 @@ class ParagraphEdit extends Component {
 
 		return (
 			<View
-				accessible={ ! this.state.isSelected }
-				accessibilityLabel={ __( 'Paragraph block' ) + __( '.' ) + ' ' + ( isEmpty( content ) ? __( 'Empty' ) : content ) }
+				accessible={ ! this.props.isSelected }
+				accessibilityLabel={ __( 'Paragraph block' ) + __( '.' ) + ' ' + ( isEmpty( content ) ? __( 'Empty' ) : this.plainTextContent( content ) ) }
+				onAccessibilityTap={ this.props.onFocus }
 			>
 				<RichText
 					tagName="p"
 					value={ content }
 					isSelected={ this.props.isSelected }
-					onFocus={ this.onFocus }
-					onBlur={ this.onBlur }
+					onFocus={ this.props.onFocus } // always assign onFocus as a props
+					onBlur={ this.props.onBlur } // always assign onBlur as a props
 					onCaretVerticalPositionChange={ this.props.onCaretVerticalPositionChange }
 					style={ style }
 					onChange={ ( nextContent ) => {