From: Patrick H. Lauke <redux@splintered.co.uk>
Date: Wed, 5 Dec 2018 18:58:09 +0000 (+0000)
Subject: Add aria-modal to modals (#27780)
X-Git-Tag: v4.2.0~40
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=6c00dd08bc719d3fa5ada8211f65edf3b73c6d1b;p=thirdparty%2Fbootstrap.git

Add aria-modal to modals (#27780)

Dynamically set/remove `aria-modal="true"` when a modal is shown/hidden
---

diff --git a/js/src/modal.js b/js/src/modal.js
index 5dfb64407e..2d4401ff83 100644
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -243,6 +243,7 @@ class Modal {
 
     this._element.style.display = 'block'
     this._element.removeAttribute('aria-hidden')
+    this._element.setAttribute('aria-modal', true)
     this._element.scrollTop = 0
 
     if (transition) {
@@ -314,6 +315,7 @@ class Modal {
   _hideModal() {
     this._element.style.display = 'none'
     this._element.setAttribute('aria-hidden', true)
+    this._element.removeAttribute('aria-modal')
     this._isTransitioning = false
     this._showBackdrop(() => {
       $(document.body).removeClass(ClassName.OPEN)
diff --git a/js/tests/unit/modal.js b/js/tests/unit/modal.js
index 8e67d83a04..782a86eea0 100644
--- a/js/tests/unit/modal.js
+++ b/js/tests/unit/modal.js
@@ -280,6 +280,23 @@ $(function () {
       .bootstrapModal('show')
   })
 
+  QUnit.test('should add aria-modal attribute when shown, remove it again when hidden', function (assert) {
+    assert.expect(3)
+    var done = assert.async()
+
+    $('<div id="modal-test"/>')
+      .on('shown.bs.modal', function () {
+        assert.ok($('#modal-test').is('[aria-modal]'), 'aria-modal attribute added')
+        assert.strictEqual($('#modal-test').attr('aria-modal'), 'true', 'correct aria-modal="true" added')
+        $(this).bootstrapModal('hide')
+      })
+      .on('hidden.bs.modal', function () {
+        assert.notOk($('#modal-test').is('[aria-modal]'), 'aria-modal attribute removed')
+        done()
+      })
+      .bootstrapModal('show')
+  })
+
   QUnit.test('should close reopened modal with [data-dismiss="modal"] click', function (assert) {
     assert.expect(2)
     var done = assert.async()