github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 01:38:56 -04:00
Code Issues Projects Releases Packages Wiki Activity

Fixing the spaces header aria-controls a11y issue (#54512) (#54587)

Browse source 
* Fixing the spaces header aria-controls a11y issue

* Updating snapshots

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
Brandon Kobel 2020-01-13 08:57:55 -08:00 • committed by GitHub
parent df21c91faa
commit 53fd409a38
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 13 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

3
x-pack/legacy/plugins/spaces/public/nav_control/__snapshots__/nav_control_popover.test.tsx.snap generated
View file

@ -5,7 +5,7 @@ exports[`NavControlPopover renders without crashing 1`] = `
anchorPosition="downRight"
button={
<EuiHeaderSectionItemButton
aria-controls="headerSpacesMenuList"
aria-controls="headerSpacesMenuContent"
aria-expanded={false}
aria-haspopup="true"
aria-label="loading"
@ -39,6 +39,7 @@ exports[`NavControlPopover renders without crashing 1`] = `
},
}
}
id="headerSpacesMenuContent"
onManageSpacesClick={[Function]}
/>
</EuiPopover>

1
x-pack/legacy/plugins/spaces/public/nav_control/components/__snapshots__/spaces_description.test.tsx.snap generated
View file

@ -4,6 +4,7 @@ exports[`SpacesDescription renders without crashing 1`] = `
<EuiContextMenuPanel
className="spcDescription"
hasFocus={true}
id="foo"
items={Array []}
title="Spaces"
>

1
x-pack/legacy/plugins/spaces/public/nav_control/components/spaces_description.test.tsx
View file

@ -13,6 +13,7 @@ describe('SpacesDescription', () => {
expect(
shallow(
<SpacesDescription
id={'foo'}
capabilities={{
navLinks: {},
management: {},

2
x-pack/legacy/plugins/spaces/public/nav_control/components/spaces_description.tsx
View file

@ -11,12 +11,14 @@ import { ManageSpacesButton } from './manage_spaces_button';
import { getSpacesFeatureDescription } from '../../constants';
interface Props {
id: string;
onManageSpacesClick: () => void;
capabilities: Capabilities;
}
export const SpacesDescription: FC<Props> = (props: Props) => {
const panelProps = {
id: props.id,
className: 'spcDescription',
title: 'Spaces',
};

2
x-pack/legacy/plugins/spaces/public/nav_control/components/spaces_menu.tsx
View file

@ -20,6 +20,7 @@ import { ManageSpacesButton } from './manage_spaces_button';
import { SpaceAvatar } from '../../space_avatar';
interface Props {
id: string;
spaces: Space[];
isLoading: boolean;
onSelectSpace: (space: Space) => void;
@ -48,6 +49,7 @@ class SpacesMenuUI extends Component<Props, State> {
: this.getVisibleSpaces(searchTerm).map(this.renderSpaceMenuItem);
const panelProps = {
id: this.props.id,
className: 'spcMenu',
title: intl.formatMessage({
id: 'xpack.spaces.navControl.spacesMenu.changeCurrentSpaceTitle',

6
x-pack/legacy/plugins/spaces/public/nav_control/nav_control_popover.tsx
View file

@ -32,6 +32,8 @@ interface State {
spaces: Space[];
}
const popoutContentId = 'headerSpacesMenuContent';
export class NavControlPopover extends Component<Props, State> {
private activeSpace$?: Subscription;
@ -71,6 +73,7 @@ export class NavControlPopover extends Component<Props, State> {
if (!this.state.loading && this.state.spaces.length < 2) {
element = (
<SpacesDescription
id={popoutContentId}
onManageSpacesClick={this.toggleSpaceSelector}
capabilities={this.props.capabilities}
/>
@ -78,6 +81,7 @@ export class NavControlPopover extends Component<Props, State> {
} else {
element = (
<SpacesMenu
id={popoutContentId}
spaces={this.state.spaces}
isLoading={this.state.loading}
onSelectSpace={this.onSelectSpace}
@ -140,7 +144,7 @@ export class NavControlPopover extends Component<Props, State> {
private getButton = (linkIcon: JSX.Element, linkTitle: string) => {
return (
<EuiHeaderSectionItemButton
aria-controls="headerSpacesMenuList"
aria-controls={popoutContentId}
aria-expanded={this.state.showSpaceSelector}
aria-haspopup="true"
aria-label={linkTitle}