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

Change the dialog modal heading from span to h1 with the uiDialogTitleHeadingLevel option added in jQuery UI 1.14.1

$
0
0

Problem/Motivation

jQuery UI 1.14.1 has been released three days ago: https://github.com/jquery/jquery-ui/releases/tag/1.14.1. It is fixing a few bugs and in particular it is adding an option for setting the heading level for dialog modal titles. In Drupal titles are still just wrapped in a span element which is semantically wrong.

Steps to reproduce

Proposed resolution

  1. Update to jQuery 1.14.1 (*got updated in #3493146: Update all JavaScript dependencies which cause no changes
  2. Use the uiDialogTitleHeadingLevel option available with jQuery UI 1.14.1 by setting it to uiDialogTitleHeadingLevel: 1 updating core/misc/dialog/dialog.jquery-ui.js

In regards of point 2, with the default value of 0 the dialog modal would stick to using the span element for wrapping the title element. In the issue summary of the corresponding issue https://github.com/jquery/jquery-ui/issues/2271 i've provided a few links to a discussion and more resources. But it has to be noted, and i am there in line with james scholes who is an a11y engineer and blind screenreader user, if you are in a dialog modal which is using the dialog element and or the aria-modal attribute (which drupal does since 10.3.0/11.0.0 by updating to jquery 1.14.0 https://github.com/jquery/jquery-ui/issues/2246) then the elements outside the dialog element are excluded from the accessibility object model and therefore the h1 is the first, and sometimes only heading element inside of the dialog modal.

Remaining tasks

User interface changes

Introduced terminology

API changes

Data model changes

Release notes snippet


Viewing all articles
Browse latest Browse all 293926

Trending Articles



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