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.

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

remove menubar role from EuiSideNav #2429

Merged
merged 3 commits into from
Oct 16, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
**Bug fixes**

- Fixed missing misc. button and link type definition exports ([#2434](https://github.com/elastic/eui/pull/2434))
- Strip custom semantics from `EuiSideNav` ([#2429](https://github.com/elastic/eui/pull/2429))

## [`14.5.0`](https://github.com/elastic/eui/tree/v14.5.0)

Expand Down
24 changes: 0 additions & 24 deletions src/components/side_nav/__snapshots__/side_nav.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,6 @@ exports[`EuiSideNav is rendered 1`] = `
</button>
<div
class="euiSideNav__content"
role="menubar"
/>
</nav>
`;
Expand Down Expand Up @@ -61,7 +60,6 @@ exports[`EuiSideNav props isOpenOnMobile defaults to false 1`] = `
</button>
<div
class="euiSideNav__content"
role="menubar"
/>
</nav>
`;
Expand Down Expand Up @@ -93,7 +91,6 @@ exports[`EuiSideNav props isOpenOnMobile is rendered when specified as true 1`]
</button>
<div
class="euiSideNav__content"
role="menubar"
/>
</nav>
`;
Expand Down Expand Up @@ -125,13 +122,11 @@ exports[`EuiSideNav props items is rendered 1`] = `
</button>
<div
class="euiSideNav__content"
role="menubar"
>
<div
class="euiSideNavItem euiSideNavItem--root euiSideNavItem--hasChildItems"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand All @@ -151,7 +146,6 @@ exports[`EuiSideNav props items is rendered 1`] = `
class="euiSideNavItem euiSideNavItem--trunk"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand All @@ -169,7 +163,6 @@ exports[`EuiSideNav props items is rendered 1`] = `
class="euiSideNavItem euiSideNavItem--trunk"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand Down Expand Up @@ -224,13 +217,11 @@ exports[`EuiSideNav props items renders items having { forceOpen: true } in open
</button>
<div
class="euiSideNav__content"
role="menubar"
>
<div
class="euiSideNavItem euiSideNavItem--root euiSideNavItem--hasChildItems"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand All @@ -250,7 +241,6 @@ exports[`EuiSideNav props items renders items having { forceOpen: true } in open
class="euiSideNavItem euiSideNavItem--trunk"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand All @@ -268,7 +258,6 @@ exports[`EuiSideNav props items renders items having { forceOpen: true } in open
class="euiSideNavItem euiSideNavItem--trunk euiSideNavItem--hasChildItems"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton euiSideNavItemButton-isOpen"
>
<span
Expand All @@ -288,7 +277,6 @@ exports[`EuiSideNav props items renders items having { forceOpen: true } in open
class="euiSideNavItem euiSideNavItem--branch euiSideNavItem--hasChildItems"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton euiSideNavItemButton-isOpen"
>
<span
Expand All @@ -308,7 +296,6 @@ exports[`EuiSideNav props items renders items having { forceOpen: true } in open
class="euiSideNavItem euiSideNavItem--branch"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand Down Expand Up @@ -359,7 +346,6 @@ exports[`EuiSideNav props items renders items using a specified callback 1`] = `
</button>
<div
class="euiSideNav__content"
role="menubar"
>
<div
class="euiSideNavItem euiSideNavItem--root euiSideNavItem--hasChildItems"
Expand Down Expand Up @@ -433,15 +419,13 @@ exports[`EuiSideNav props items renders items which are links 1`] = `
</button>
<div
class="euiSideNav__content"
role="menubar"
>
<div
class="euiSideNavItem euiSideNavItem--root euiSideNavItem--hasChildItems"
>
<a
class="euiSideNavItemButton euiSideNavItemButton--isClickable"
href="http://www.elastic.co"
role="menuitem"
>
<span
class="euiSideNavItemButton__content"
Expand All @@ -460,7 +444,6 @@ exports[`EuiSideNav props items renders items which are links 1`] = `
class="euiSideNavItem euiSideNavItem--trunk"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand All @@ -478,7 +461,6 @@ exports[`EuiSideNav props items renders items which are links 1`] = `
class="euiSideNavItem euiSideNavItem--trunk"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand Down Expand Up @@ -533,13 +515,11 @@ exports[`EuiSideNav props items renders selected item and automatically opens pa
</button>
<div
class="euiSideNav__content"
role="menubar"
>
<div
class="euiSideNavItem euiSideNavItem--root euiSideNavItem--hasChildItems"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand All @@ -559,7 +539,6 @@ exports[`EuiSideNav props items renders selected item and automatically opens pa
class="euiSideNavItem euiSideNavItem--trunk"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand All @@ -577,7 +556,6 @@ exports[`EuiSideNav props items renders selected item and automatically opens pa
class="euiSideNavItem euiSideNavItem--trunk euiSideNavItem--hasChildItems"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton euiSideNavItemButton-isOpen"
>
<span
Expand All @@ -597,7 +575,6 @@ exports[`EuiSideNav props items renders selected item and automatically opens pa
class="euiSideNavItem euiSideNavItem--branch"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton euiSideNavItemButton-isSelected"
>
<span
Expand All @@ -615,7 +592,6 @@ exports[`EuiSideNav props items renders selected item and automatically opens pa
class="euiSideNavItem euiSideNavItem--branch"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ exports[`EuiSideNavItem is rendered 1`] = `
class="euiSideNavItem"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand All @@ -30,7 +29,6 @@ exports[`EuiSideNavItem isSelected defaults to false 1`] = `
class="euiSideNavItem"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand All @@ -51,7 +49,6 @@ exports[`EuiSideNavItem isSelected is rendered when specified as true 1`] = `
class="euiSideNavItem"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton euiSideNavItemButton-isSelected"
>
<span
Expand All @@ -72,7 +69,6 @@ exports[`EuiSideNavItem preserves child's classes 1`] = `
class="euiSideNavItem"
>
<div
aria-label="[object Object]"
class="euiSideNavItemButton"
>
<span
Expand Down
4 changes: 1 addition & 3 deletions src/components/side_nav/side_nav.js
Original file line number Diff line number Diff line change
Expand Up @@ -106,9 +106,7 @@ export class EuiSideNav extends Component {
</button>

{/* Hidden from view in mobile, but toggled from the button above */}
<div className="euiSideNav__content" role="menubar">
{nav}
</div>
<div className="euiSideNav__content">{nav}</div>
</nav>
);
}
Expand Down
16 changes: 3 additions & 13 deletions src/components/side_nav/side_nav_item.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,32 +7,22 @@ import { EuiIcon } from '../icon';
const defaultRenderItem = ({ href, onClick, className, children, ...rest }) => {
if (href) {
return (
<a
className={className}
href={href}
onClick={onClick}
role="menuitem"
{...rest}>
<a className={className} href={href} onClick={onClick} {...rest}>
{children}
</a>
);
}

if (onClick) {
return (
<button
type="button"
className={className}
onClick={onClick}
role="menuitem"
{...rest}>
<button type="button" className={className} onClick={onClick} {...rest}>
{children}
</button>
);
}

return (
<div className={className} aria-label={children} {...rest}>
<div className={className} {...rest}>
{children}
</div>
);
Expand Down