[MM-16039] Fixed accessibility issues with the Account Settings modal (…

…mattermost#3051) * [MM-16039] Fixed accessibility issues with the Account Settings modal * [MM-16039] Removed workaround and fixed case
mattermost-build · Jul 4, 2019 · cb52947 · cb52947
1 parent f01241b
commit cb52947
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 0 deletions.
diff --git a/components/__snapshots__/setting_item_min.test.jsx.snap b/components/__snapshots__/setting_item_min.test.jsx.snap
@@ -15,6 +15,7 @@ exports[`components/SettingItemMin should match snapshot 1`] = `
  className="col-xs-12 col-sm-3 section-edit"
  >
  <button
+ aria-labelledby="sectionTitle sectionEdit"
  className="color--link cursor--pointer style--none text-left"
  id="sectionEdit"
  onClick={[Function]}

diff --git a/components/setting_item_min.jsx b/components/setting_item_min.jsx
@@ -80,6 +80,7 @@ export default class SettingItemMin extends React.PureComponent {
  className='color--link cursor--pointer style--none'
  onClick={this.handleUpdateSection}
  ref={this.getEdit}
+ aria-labelledby={this.props.section + 'Title ' + this.props.section + 'Edit'}
  >
  <EditIcon/>
  {this.props.describe}
@@ -94,6 +95,7 @@ export default class SettingItemMin extends React.PureComponent {
  className='color--link cursor--pointer style--none text-left'
  onClick={this.handleUpdateSection}
  ref={this.getEdit}
+ aria-labelledby={this.props.section + 'Title ' + this.props.section + 'Edit'}
  >
  <EditIcon/>
  <FormattedMessage

diff --git a/components/settings_sidebar.jsx b/components/settings_sidebar.jsx
@@ -41,6 +41,7 @@ export default class SettingsSidebar extends React.Component {
  id={`${tab.name}Button`}
  className='cursor--pointer style--none'
  onClick={this.handleClick.bind(null, tab)}
+ aria-label={tab.uiName.toLowerCase()}
  >
  <i
  className={tab.icon}