1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-08 14:46:34 +02:00

modal: change data-dismiss so that it can be outside of a modal using bs-target (#33403)

* change data-dismiss, so can be outside modal, using a bs-target

* Update site/content/docs/5.0/components/modal.md

Co-authored-by: Gaël Poupard <ffoodd@users.noreply.github.com>
This commit is contained in:
GeoSot
2021-07-19 16:56:05 +03:00
committed by GitHub
parent 06a1ca5623
commit dfafb9a60c
3 changed files with 54 additions and 3 deletions

View File

@@ -249,7 +249,7 @@ describe('Modal', () => {
modal.show()
})
it('should close modal when a click occurred on data-bs-dismiss="modal"', done => {
it('should close modal when a click occurred on data-bs-dismiss="modal" inside modal', done => {
fixtureEl.innerHTML = [
'<div class="modal fade">',
' <div class="modal-dialog">',
@@ -278,6 +278,33 @@ describe('Modal', () => {
modal.show()
})
it('should close modal when a click occurred on a data-bs-dismiss="modal" with "bs-target" outside of modal element', done => {
fixtureEl.innerHTML = [
'<button type="button" data-bs-dismiss="modal" data-bs-target="#modal1"></button>',
'<div id="modal1" class="modal fade">',
' <div class="modal-dialog">',
' </div>',
'</div>'
].join('')
const modalEl = fixtureEl.querySelector('.modal')
const btnClose = fixtureEl.querySelector('[data-bs-dismiss="modal"]')
const modal = new Modal(modalEl)
spyOn(modal, 'hide').and.callThrough()
modalEl.addEventListener('shown.bs.modal', () => {
btnClose.click()
})
modalEl.addEventListener('hidden.bs.modal', () => {
expect(modal.hide).toHaveBeenCalled()
done()
})
modal.show()
})
it('should set .modal\'s scroll top to 0', done => {
fixtureEl.innerHTML = [
'<div class="modal fade">',