-
-
Notifications
You must be signed in to change notification settings - Fork 323
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
Fixes for docs and DashboardLayout component #4104
Conversation
1bc577b
to
84e6a5b
Compare
@@ -230,7 +230,7 @@ describe('DashboardLayout', () => { | |||
|
|||
const { rerender } = render(<AppWithPathname pathname="/dashboard" />); | |||
|
|||
const navigation = screen.getByRole('navigation'); | |||
const navigation = screen.getAllByRole('navigation').at(-1)!; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Might want to label these instead, as per https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/navigation_role#multiple_landmarks
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ah cool, there should never actually be multiple nav
s in the page except in these headless browser tests, but anyway doesn't hurt to add these.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The way I look at it is that if it's hard to navigate the accessibility tree in the tests, it could be an indicator that it's going to be hard for assistive software as well.
DashboardLayout
docs (Closes Search bar looks strange when filled on dark mode #4037)DashboardLayout
docsdisableCollapsibleSidebar
propuseMediaQuery
hookDashboardLayout
navigation item actions demo (there were extra slashes)https://deploy-preview-4104--mui-toolpad-docs.netlify.app/toolpad/core/react-dashboard-layout/
Before: https://mui.com/toolpad/core/react-dashboard-layout/