Problem/Motivation
In the book module navigation, the nav element has an aria-labelledby attribute, but the target for the reference doesn't exist.
This means the navigation landmark has no accessible name, for assistive technology users to distinguish it from other navigation landmark regions. Best practice is to provide accessible names wherever there is more than one landmark of a given type (navigation, in this case).
The aria-labelledby
attribute was added to the book-navigation.html.twig
nav element in issue #2052473: Add aria-label or aria-describedby attributes to all <nav> elements but the id attribute on the h2 was removed in issue #2349633: Copy book templates to Classy.
To reproduce the issue
1. Install a theme that is not based on Classy. (I used Bootstrap). The issue is not visible in Bartik.
2. Enable the book module.
3. Create a book that has at least two pages.
4. Go to one of the book pages. You will see the traversal links at the bottom of the page.
5. I ran the WAVE browser extension which will flag the error.
Proposed resolution
Update book-navigation.html.twig
and put an id
attribute on the h2
that matches the aria-labelledby
attribute.
Do this for the book-navigation.html.twig
template provided by the book module, and all core themes which are missing this ID. It should be added to the book-navigation template in the Stable and Stable9 themes; this is a permitted change for the Stable theme. (All core themes were surveyed in comment #9.)
Tips for manual testing
- If you're not familiar with screen readers, use the Landmarks browser extension to inspect the accessible names of landmark regions. (Note that not all landmarks have names. This issue is just about the book-navigation landmark.)
- Use the Stark theme to confirm the correct behaviour of the module template. That's because the Stark theme has
base theme: false
so it doesn't get templates from the Stable or Classy themes. - Put
$settings['extension_discovery_scan_tests'] = TRUE;
in yoursetting.php
file. Then you can enable the Stable or Stable9 themes directly, to confirm the behaviour of the templates from these themes.