[aria-*] attributes do not match their roles

[m4g3s]

Context

No response

Bug description

Seems to be an issue with [aria-*] attributes not matching their roles. I found this bug when running Chrome's Lighthouse feature.

Seems to be an issue with the nav

Was able to reproduce this error on a reproduction after adding the following to mkdocs.yml

nav:
  - 'Home':
    - 'index.md'
    - 'Test':
      - 'Testing': 'testing.md'

Also will mention i'm using the latest version of insiders 4.29.0

Related links

• Bug reporting
• I looked though the documentation but couldn't find anything too relevant to link here

Reproduction

example.zip

Steps to reproduce

1. go to https://squidfunk.github.io/mkdocs-material/setup/changing-the-colors/
2. Open developer tools
3. Run Lighthouse
4. Check under Accessibility

Browser

Chrome

Before submitting

• I have read and followed the bug reporting guidelines.
• I have attached links to the documentation, and possibly related issues or discussions.
• I assure that I have removed all customizations before submitting this bug report.
• I have attached a .zip file with a minimal reproduction.

[squidfunk]

Thanks for reporting and providing the reproduction! The problem is related to. aria-expanded being set on the label element, which doesn't match it's role, and was introduced in f8f44f5 to solve #4804. I check how we can improve the situation.

[squidfunk]

Okay, I believe I found a better solution in 148c9fd, at least Lighthouse stopped complaining. Prior to this change, the label element hosted the aria-expanded attribute, which is semantically not correct, since the label itself cannot be expanded. However, the label triggers the expansion of the subsequent nav element, which is why I've linked the nav element to the label using aria-labelledby, and set the aria-expanded attribute on this element.

This fixes the issue described. I've also fixed an issue where the aria-expanded state was only triggered when hitting Enter when thelabel is focused, not when clicking. Now, the attribute is also updated when clicking on the label.

[squidfunk]

Released as part of 9.0.7