Quantcast
Channel: Issues for Drupal core
Viewing all articles
Browse latest Browse all 295555

Broken aria-labelledby IDREF in book navigation

$
0
0

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

  1. 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.)
  2. 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.
  3. Put $settings['extension_discovery_scan_tests'] = TRUE; in your setting.php file. Then you can enable the Stable or Stable9 themes directly, to confirm the behaviour of the templates from these themes.

Viewing all articles
Browse latest Browse all 295555


<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>