MDL-67149 Accessibility: Help popups fail WCAG 1.4.13 (Dismissable)
authorsam marshall <s.marshall@open.ac.uk>
Wed, 6 Nov 2019 16:24:27 +0000 (16:24 +0000)
committersam marshall <s.marshall@open.ac.uk>
Wed, 6 Nov 2019 16:24:30 +0000 (16:24 +0000)
It must be possible to dismiss the help popups (popovers) with the
Escape key, without changing focus.

theme/boost/amd/build/loader.min.js
theme/boost/amd/build/loader.min.js.map
theme/boost/amd/src/loader.js

index 494e4d4..4a22221 100644 (file)
Binary files a/theme/boost/amd/build/loader.min.js and b/theme/boost/amd/build/loader.min.js differ
index babf2c5..d45ebc4 100644 (file)
Binary files a/theme/boost/amd/build/loader.min.js.map and b/theme/boost/amd/build/loader.min.js.map differ
index e08e29d..b99c03d 100644 (file)
@@ -23,7 +23,7 @@
  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  * @since      2.9
  */
-define(['jquery', './tether', 'core/event'], function(jQuery, Tether, Event) {
+define(['jquery', './tether', 'core/event', 'core/custom_interaction_events'], function(jQuery, Tether, Event, customEvents) {
 
     window.jQuery = jQuery;
     window.Tether = Tether;
@@ -50,6 +50,14 @@ define(['jquery', './tether', 'core/event'], function(jQuery, Tether, Event) {
             selector: "[data-toggle=popover][data-trigger!=hover]"
         });
 
+        // Popovers must close on Escape for accessibility reasons.
+        customEvents.define(jQuery('body'), [
+            customEvents.events.escape,
+        ]);
+        jQuery('body').on(customEvents.events.escape, '[data-toggle=popover]', function() {
+            jQuery(this).popover('hide');
+        });
+
         jQuery("html").popover({
             container: "body",
             selector: "[data-toggle=popover][data-trigger=hover]",