Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Mobile]Update string concatenation for accessibility labels #15181

Merged
merged 4 commits into from
Apr 26, 2019
Merged

[Mobile]Update string concatenation for accessibility labels #15181

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
06f7a8c
Make accessibility labels properly localizable
pinarol Apr 25, 2019
41c7bd2
Merge branch 'master' into rnmobile/update-string-concatenation-for-a…
pinarol Apr 25, 2019
cadb99b
Fix indentation
pinarol Apr 25, 2019
0d19f21
Fix image block accessibility labels
pinarol Apr 26, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions packages/block-editor/src/components/media-placeholder/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import { View, Text, TouchableWithoutFeedback } from 'react-native';
/**
* WordPress dependencies
*/
import { __, sprintf } from '@wordpress/i18n';
import { __ } from '@wordpress/i18n';
import { Dashicon } from '@wordpress/components';

/**
Expand All @@ -17,7 +17,8 @@ import styles from './styles.scss';
function MediaPlaceholder( props ) {
return (
<TouchableWithoutFeedback
accessibilityLabel={ sprintf( '%s%s %s', __( 'Image block' ), __( '.' ), __( 'Empty' ) ) }
/* translators: accessibility text for the Image block empty state */
accessibilityLabel={ __( 'Image block. Empty' ) }
accessibilityRole={ 'button' }
accessibilityHint={ __( 'Double tap to select an image' ) }
onPress={ props.onMediaOptionsPressed }
Expand Down
21 changes: 18 additions & 3 deletions packages/block-library/src/image/edit.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ import {
BottomSheet,
Picker,
} from '@wordpress/block-editor';
import { __ } from '@wordpress/i18n';
import { __, sprintf } from '@wordpress/i18n';
import { isURL } from '@wordpress/url';
import { doAction, hasAction } from '@wordpress/hooks';

Expand Down Expand Up @@ -331,7 +331,13 @@ class ImageEdit extends React.Component {
return (
<TouchableWithoutFeedback
accessible={ ! isSelected }
accessibilityLabel={ __( 'Image block' ) + __( '.' ) + ' ' + alt + __( '.' ) + ' ' + caption }

accessibilityLabel={ sprintf(
/* translators: accessibility text. 1: image alt text. 2: image caption. */
__( 'Image block. %1$s. %2$s' ),
alt,
caption
) }
accessibilityRole={ 'button' }
onPress={ this.onImagePressed }
disabled={ ! isSelected }
Expand Down Expand Up @@ -395,7 +401,16 @@ class ImageEdit extends React.Component {
<View
style={ { padding: 12, flex: 1 } }
accessible={ true }
accessibilityLabel={ __( 'Image caption' ) + __( '.' ) + ' ' + ( isEmpty( caption ) ? __( 'Empty' ) : caption ) }
accessibilityLabel={
isEmpty( caption ) ?
/* translators: accessibility text. Empty image caption. */
__( 'Image caption. Empty.' ) :
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There's a dot at the end that seems to not be needed/expected.

sprintf(
/* translators: accessibility text. %s: image caption. */
__( 'Image caption. Empty. %s' ),
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here I believe it shouldn't say Empty.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

copy paste error :(

caption
)
}
accessibilityRole={ 'button' }
>
<TextInput
Expand Down
8 changes: 7 additions & 1 deletion packages/block-library/src/nextpage/edit.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,13 @@ export default function NextPageEdit( { attributes, isSelected, onFocus } ) {
return (
<View
accessible
accessibilityLabel={ sprintf( '%s%s %s', __( 'Page break block' ), __( '.' ), accessibilityTitle ) }
accessibilityLabel={
sprintf(
/* translators: accessibility text. %s: Page break text. */
__( 'Page break block. %s' ),
accessibilityTitle
)
}
accessibilityStates={ accessibilityState }
onAccessibilityTap={ onFocus }
>
Expand Down
13 changes: 11 additions & 2 deletions packages/block-library/src/paragraph/edit.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { isEmpty } from 'lodash';
/**
* WordPress dependencies
*/
import { __ } from '@wordpress/i18n';
import { __, sprintf } from '@wordpress/i18n';
import { Component } from '@wordpress/element';
import { createBlock } from '@wordpress/blocks';
import { RichText } from '@wordpress/block-editor';
Expand Down Expand Up @@ -107,7 +107,16 @@ class ParagraphEdit extends Component {
return (
<View
accessible={ ! this.props.isSelected }
accessibilityLabel={ __( 'Paragraph block' ) + __( '.' ) + ' ' + ( isEmpty( content ) ? __( 'Empty' ) : this.plainTextContent( content ) ) }
accessibilityLabel={
isEmpty( content ) ?
/* translators: accessibility text. empty paragraph block. */
__( 'Paragraph block. Empty' ) :
sprintf(
/* translators: accessibility text. %s: text content of the paragraph block. */
__( 'Paragraph block. %s' ),
this.plainTextContent( content )
)
}
onAccessibilityTap={ this.props.onFocus }
>
<RichText
Expand Down
11 changes: 10 additions & 1 deletion packages/editor/src/components/post-title/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,16 @@ class PostTitle extends Component {
<View
style={ [ styles.titleContainer, borderStyle, { borderColor } ] }
accessible={ ! this.state.isSelected }
accessibilityLabel={ sprintf( '%s%s %s', __( 'Post title' ), __( '.' ), ( isEmpty( title ) ? __( 'Empty' ) : title ) ) }
accessibilityLabel={
isEmpty( title ) ?
/* translators: accessibility text. empty post title. */
__( 'Post title. Empty' ) :
sprintf(
/* translators: accessibility text. %s: text content of the post title. */
__( 'Post title. %s' ),
title
)
}
>
<RichText
tagName={ 'p' }
Expand Down