Add aria-hidden to 'Hide image' button in MediaGallery since the button is useless to screen reader users (#22513)

This commit is contained in:
Holden Foreman 2023-01-05 07:36:42 -05:00 committed by GitHub
parent 4dc9152b3e
commit c5da2f8c43
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 1 deletions

View File

@ -27,6 +27,7 @@ export default class IconButton extends React.PureComponent {
counter: PropTypes.number,
obfuscateCount: PropTypes.bool,
href: PropTypes.string,
ariaHidden: PropTypes.bool,
};
static defaultProps = {
@ -36,6 +37,7 @@ export default class IconButton extends React.PureComponent {
animate: false,
overlay: false,
tabIndex: '0',
ariaHidden: false,
};
state = {
@ -102,6 +104,7 @@ export default class IconButton extends React.PureComponent {
counter,
obfuscateCount,
href,
ariaHidden,
} = this.props;
const {
@ -142,6 +145,7 @@ export default class IconButton extends React.PureComponent {
type='button'
aria-label={title}
aria-expanded={expanded}
aria-hidden={ariaHidden}
title={title}
className={classes}
onClick={this.handleClick}

View File

@ -345,7 +345,7 @@ class MediaGallery extends React.PureComponent {
</button>
);
} else if (visible) {
spoilerButton = <IconButton title={intl.formatMessage(messages.toggle_visible, { number: size })} icon='eye-slash' overlay onClick={this.handleOpen} />;
spoilerButton = <IconButton title={intl.formatMessage(messages.toggle_visible, { number: size })} icon='eye-slash' overlay onClick={this.handleOpen} ariaHidden />;
} else {
spoilerButton = (
<button type='button' onClick={this.handleOpen} className='spoiler-button__overlay'>