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

Fixes for accessibility tickets #821

Merged
merged 17 commits into from
May 14, 2018
Merged

Fixes for accessibility tickets #821

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
36f91ad
pagination labeling fixes #735
snide May 11, 2018
e39a031
fixes #621 adds menubar roles to side nav
snide May 11, 2018
48b16d8
fixes #734, adds more descriptive aria labeling for pagination
snide May 11, 2018
5355ddf
update snapshots
snide May 11, 2018
b8639bc
fixes #729, apply aria-live to popovers
snide May 11, 2018
81ada28
fixes #723, provides screen reader notice for bottom bar appearance
snide May 11, 2018
3614a0e
fix ownFocus needing to be true for non-context menu sitations. apply…
snide May 11, 2018
7b36ccf
feedback
snide May 11, 2018
4cf3206
fixes #616 adds home page label
snide May 11, 2018
fdd9acd
fixes #687, documentation button labeling
snide May 11, 2018
bddb74e
snapshot updates
snide May 11, 2018
1c89762
fixes #617 applies aria label to theme selector
snide May 11, 2018
a950bbd
fixes #746 applies proper label to select all checkboxes in table
snide May 11, 2018
585bdd4
snapshots
snide May 11, 2018
af4f873
changelog
snide May 11, 2018
76d40c6
clone element and id no longer needed for popover
snide May 11, 2018
98b7766
more snapshots
snide May 11, 2018
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
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
- Ensure switches’ inputs are still hidden when `[disabled]` ([#778](https://github.com/elastic/eui/pull/778))
- Made boolean matching in `EuiSearchBar` more exact so it doesn't match words starting with booleans, like "truest" or "offer" ([#776](https://github.com/elastic/eui/pull/776))
- `EuiComboBox` do not setState or call refs once component is unmounted ([807](https://github.com/elastic/eui/pull/807) and [#813](https://github.com/elastic/eui/pull/813))
- Added better accessibility labeling to `EuiPagination`, `EuiSideNav`, `EuiPopover`, `EuiBottomBar` and `EuiBasicTable`. ([#821](https://github.com/elastic/eui/pull/821))

## [`0.0.46`](https://github.com/elastic/eui/tree/v0.0.46)

Expand Down
8 changes: 6 additions & 2 deletions src-docs/src/components/guide_page/guide_page_chrome.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,7 @@ export class GuidePageChrome extends Component {
<Link
to="/"
className="guideLogo"
aria-label="Go to home page"
>
<EuiIcon type="logoElastic" size="l" />
</Link>
Expand All @@ -93,11 +94,14 @@ export class GuidePageChrome extends Component {
}

renderSubSections = (subSections = []) => {
if (subSections.length <= 1) {

const subSectionsWithTitles = subSections.filter(item => (item.title));

if (subSectionsWithTitles.length <= 1) {
return;
}

return subSections.map(({ title, id }) => ({
return subSectionsWithTitles.map(({ title, id }) => ({
id: `subSection-${id}`,
name: title,
onClick: this.onClickLink.bind(this, id),
Expand Down
1 change: 1 addition & 0 deletions src-docs/src/components/guide_theme_selector/guide_theme_selector.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@ export class GuideThemeSelector extends Component {
iconType="arrowDown"
iconSide="right"
onClick={this.onThemeButtonClick}
aria-label="Select a visual theme"
>
<strong>Elastic UI</strong> <span className="guideSideNav__theme"> ~ {this.props.selectedTheme}</span>
</EuiButtonEmpty>
Expand Down
10 changes: 5 additions & 5 deletions src-docs/src/views/guidelines/button.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -287,9 +287,9 @@ export default() => (
frame="frame"
>
<div>
<EuiButtonIcon size="s" iconType="pencil" aria-label="Next"/>
<EuiButtonIcon size="s" iconType="pencil" aria-label="Edit"/>
&nbsp;&nbsp;&nbsp;&nbsp;
<EuiButtonIcon size="s" iconType="expand" aria-label="Next"/>
<EuiButtonIcon size="s" iconType="expand" aria-label="Expand"/>
</div>
</GuideRuleExample>
<GuideRuleExample
Expand All @@ -300,11 +300,11 @@ export default() => (
>
<div>
<EuiButton>
<EuiIcon type="pencil"/>
<EuiIcon type="pencil" aria-label="Edit" />
</EuiButton>
&nbsp;&nbsp;&nbsp;&nbsp;
<EuiButton >
<EuiIcon type="expand"/>
<EuiButton>
<EuiIcon type="expand" aria-label="Expand" />
</EuiButton>
</div>
</GuideRuleExample>
Expand Down
1 change: 0 additions & 1 deletion src-docs/src/views/popover/popover.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,6 @@ export default class extends Component {
return (
<EuiPopover
id="popover"
ownFocus
button={button}
isOpen={this.state.isPopoverOpen}
closePopover={this.closePopover.bind(this)}
Expand Down
28 changes: 28 additions & 0 deletions src/components/basic_table/__snapshots__/basic_table.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -483,6 +483,7 @@ exports[`EuiBasicTable with pagination and selection 1`] = `
width="24px"
>
<EuiCheckbox
aria-label="Select all rows"
checked={false}
compressed={false}
data-test-subj="checkboxSelectAll"
Expand Down Expand Up @@ -511,6 +512,7 @@ exports[`EuiBasicTable with pagination and selection 1`] = `
key="_selection_column_1"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-1"
Expand Down Expand Up @@ -540,6 +542,7 @@ exports[`EuiBasicTable with pagination and selection 1`] = `
key="_selection_column_2"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-2"
Expand Down Expand Up @@ -569,6 +572,7 @@ exports[`EuiBasicTable with pagination and selection 1`] = `
key="_selection_column_3"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-3"
Expand Down Expand Up @@ -635,6 +639,7 @@ exports[`EuiBasicTable with pagination, selection and sorting 1`] = `
width="24px"
>
<EuiCheckbox
aria-label="Select all rows"
checked={false}
compressed={false}
data-test-subj="checkboxSelectAll"
Expand Down Expand Up @@ -666,6 +671,7 @@ exports[`EuiBasicTable with pagination, selection and sorting 1`] = `
key="_selection_column_1"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-1"
Expand Down Expand Up @@ -695,6 +701,7 @@ exports[`EuiBasicTable with pagination, selection and sorting 1`] = `
key="_selection_column_2"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-2"
Expand Down Expand Up @@ -724,6 +731,7 @@ exports[`EuiBasicTable with pagination, selection and sorting 1`] = `
key="_selection_column_3"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-3"
Expand Down Expand Up @@ -790,6 +798,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and a single record a
width="24px"
>
<EuiCheckbox
aria-label="Select all rows"
checked={false}
compressed={false}
data-test-subj="checkboxSelectAll"
Expand Down Expand Up @@ -828,6 +837,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and a single record a
key="_selection_column_1"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-1"
Expand Down Expand Up @@ -885,6 +895,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and a single record a
key="_selection_column_2"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-2"
Expand Down Expand Up @@ -942,6 +953,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and a single record a
key="_selection_column_3"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-3"
Expand Down Expand Up @@ -1036,6 +1048,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and column dataType 1
width="24px"
>
<EuiCheckbox
aria-label="Select all rows"
checked={false}
compressed={false}
data-test-subj="checkboxSelectAll"
Expand Down Expand Up @@ -1067,6 +1080,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and column dataType 1
key="_selection_column_1"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-1"
Expand Down Expand Up @@ -1096,6 +1110,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and column dataType 1
key="_selection_column_2"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-2"
Expand Down Expand Up @@ -1125,6 +1140,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and column dataType 1
key="_selection_column_3"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-3"
Expand Down Expand Up @@ -1191,6 +1207,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and column renderer 1
width="24px"
>
<EuiCheckbox
aria-label="Select all rows"
checked={false}
compressed={false}
data-test-subj="checkboxSelectAll"
Expand Down Expand Up @@ -1222,6 +1239,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and column renderer 1
key="_selection_column_1"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-1"
Expand Down Expand Up @@ -1251,6 +1269,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and column renderer 1
key="_selection_column_2"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-2"
Expand Down Expand Up @@ -1280,6 +1299,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and column renderer 1
key="_selection_column_3"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-3"
Expand Down Expand Up @@ -1346,6 +1366,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and multiple record a
width="24px"
>
<EuiCheckbox
aria-label="Select all rows"
checked={false}
compressed={false}
data-test-subj="checkboxSelectAll"
Expand Down Expand Up @@ -1384,6 +1405,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and multiple record a
key="_selection_column_1"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-1"
Expand Down Expand Up @@ -1439,6 +1461,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and multiple record a
key="_selection_column_2"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-2"
Expand Down Expand Up @@ -1494,6 +1517,7 @@ exports[`EuiBasicTable with pagination, selection, sorting and multiple record a
key="_selection_column_3"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-3"
Expand Down Expand Up @@ -1586,6 +1610,7 @@ exports[`EuiBasicTable with pagination, selection, sorting, column renderer and
width="24px"
>
<EuiCheckbox
aria-label="Select all rows"
checked={false}
compressed={false}
data-test-subj="checkboxSelectAll"
Expand Down Expand Up @@ -1617,6 +1642,7 @@ exports[`EuiBasicTable with pagination, selection, sorting, column renderer and
key="_selection_column_1"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-1"
Expand Down Expand Up @@ -1646,6 +1672,7 @@ exports[`EuiBasicTable with pagination, selection, sorting, column renderer and
key="_selection_column_2"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-2"
Expand Down Expand Up @@ -1675,6 +1702,7 @@ exports[`EuiBasicTable with pagination, selection, sorting, column renderer and
key="_selection_column_3"
>
<EuiCheckbox
aria-label="Select this row"
checked={false}
compressed={false}
data-test-subj="checkboxSelectRow-3"
Expand Down
2 changes: 2 additions & 0 deletions src/components/basic_table/basic_table.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -366,6 +366,7 @@ export class EuiBasicTable extends Component {
disabled={disabled}
onChange={onChange}
data-test-subj="checkboxSelectAll"
aria-label="Select all rows"
/>
</EuiTableHeaderCellCheckbox>
);
Expand Down Expand Up @@ -562,6 +563,7 @@ export class EuiBasicTable extends Component {
checked={checked}
onChange={onChange}
title={title}
aria-label="Select this row"
data-test-subj={`checkboxSelectRow-${itemId}`}
/>
</EuiTableRowCellCheckbox>
Expand Down
Loading