diff --git a/js/src/modal.js b/js/src/modal.js index e2365aca7907..695ac569b812 100644 --- a/js/src/modal.js +++ b/js/src/modal.js @@ -223,6 +223,7 @@ const Modal = (($) => { } this._element.style.display = 'block' + this._element.removeAttribute('aria-hidden') this._element.scrollTop = 0 if (transition) { @@ -290,6 +291,7 @@ const Modal = (($) => { _hideModal() { this._element.style.display = 'none' + this._element.setAttribute('aria-hidden', 'true') this._showBackdrop(() => { $(document.body).removeClass(ClassName.OPEN) this._resetAdjustments() diff --git a/js/tests/unit/modal.js b/js/tests/unit/modal.js index f3297641bdd8..28c1e0ec7428 100644 --- a/js/tests/unit/modal.js +++ b/js/tests/unit/modal.js @@ -233,6 +233,23 @@ $(function () { .bootstrapModal('show') }) + QUnit.test('should remove aria-hidden attribute when shown, add it back when hidden', function (assert) { + assert.expect(3) + var done = assert.async() + + $('
') + .on('shown.bs.modal', function () { + assert.notOk($('#modal-test').is('[aria-hidden]'), 'aria-hidden attribute removed') + $(this).bootstrapModal('hide') + }) + .on('hidden.bs.modal', function () { + assert.ok($('#modal-test').is('[aria-hidden]'), 'aria-hidden attribute added') + assert.strictEqual($('#modal-test').attr('aria-hidden'), 'true', 'correct aria-hidden="true" added') + done() + }) + .bootstrapModal('show') + }) + QUnit.test('should close reopened modal with [data-dismiss="modal"] click', function (assert) { assert.expect(2) var done = assert.async()