Contrib.social

Details elements have incorrect aria-describedby attributes

Open on Drupal.org →
Created on 20 July 2017, over 7 years ago
Updated 30 January 2023, almost 2 years ago

Problem/Motivation

Like all form elements, details elements are assigned an aria-describedby attribute with a value of {element-id}--description. The problem is that the actual description is not given this ID. It is properly assigned for other form elements (at least all that I've tested).

This attribute is set in FormBuilder.php on line 971 (as of 8.3.4):

if (!empty($element['#description'])) {
  $element['#attributes']['aria-describedby'] = $element['#id'] . '--description';
}

The default template for a details element is in the system module's details.html.twig:

{{ description }}

The main theme template is in classy's details.html.twig:

<div class="details-description">{{ description }}</div>

No where is this proper ID being set.

The description attributes seem to be provided in form.inc within template_preprocess_form_element() and template_preprocess_fieldset(), but not within template_preprocess_details().

Tested with Bartik, Classy, and Seven.

Proposed resolution

I think the solution here is to add the same code from template_preprocess_fieldset() to template_preprocess_details(). Then in all details.html.twig, we include something like:

{%- if description.content -%}
  <div{{ description.attributes.addClass('description-details') }}>{{ description.content }}</div>
{%- endif -%}

Remaining tasks

Provide a patch.

User interface changes

aria-describedby attributes will all be correct for details elements by properly wrapping the description in a DIV with the correct ID.

🐛 Bug report
Status

Needs work

Version

10.1 ✨

Component
Render  →

Last updated 2 days ago

Created by

🇺🇸United States mstef

Live updates comments and jobs are added and updated live.
  • Accessibility

    It affects the ability of people with disabilities or special needs (such as blindness or color-blindness) to use Drupal.

  • Needs accessibility review

    Used to alert the accessibility topic maintainer(s) that an issue significantly affects (or has the potential to affect) the accessibility of Drupal, and their signoff is needed (see the governance policy draft for more information). Useful links: Drupal's accessibility standards, the Drupal Core accessibility gate.

Sign in to follow issues

Merge Requests

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024