fix(reveal): mark correct aria-haspopup value for modal opening controls

The correct value for `aria-haspopup` for dialog controlling
elements is "dialog", not "true" which indicates a menu element.
See: https://www.w3.org/TR/wai-aria-1.1/#dialog

diff --git a/js/foundation.reveal.js b/js/foundation.reveal.js
index b20b04e327574a2554bf9457835f715f572003d2..baacfbbf850ccfaaff24a659678c56511c351b83 100644 (file)
--- a/js/foundation.reveal.js
+++ b/js/foundation.reveal.js
@@ -55,7 +55,7 @@ class Reveal extends Plugin {
     this.$anchor = $(`[data-open="${this.id}"]`).length ? $(`[data-open="${this.id}"]`) : $(`[data-toggle="${this.id}"]`);
     this.$anchor.attr({
       'aria-controls': this.id,
-      'aria-haspopup': true,
+      'aria-haspopup': 'dialog',
       'tabindex': 0
     });
 

diff --git a/test/javascript/components/reveal.js b/test/javascript/components/reveal.js
index 1c20797a8ec1dacd08bb0e9436398c75bfa551fc..224e88891621a76d2a4b0af3626cbee632d4d272 100644 (file)
--- a/test/javascript/components/reveal.js
+++ b/test/javascript/components/reveal.js
@@ -48,7 +48,7 @@ describe('Reveal', function() {
       var $anchor = $('<button data-open="exampleModal1">Open</button>').appendTo('body');
       plugin = new Foundation.Reveal($html, {});
 
-      $anchor.should.have.attr('aria-haspopup', 'true');
+      $anchor.should.have.attr('aria-haspopup', 'dialog');
       $anchor.should.have.attr('aria-controls', $html.attr('id'));
 
       $anchor.remove();