Created by: weaverryan
Hi!
This fixes #33946 (closed)
Here is a reproducer: https://weaverryan.github.io/bootstrap-modal-close-reproducer/ Code: https://github.com/weaverryan/bootstrap-modal-close-reproducer/blob/main/index.html#L34-L46
- Click "Launch demo modal"
- Click "Save changes" in the modal.
Then in the console you'll see:
TypeError: Cannot read property 'removeChild' of null (backdrop.js:119)
This occurs if you hide()
a backdrop, but then the HTML of the backdrop is removed from the body while its animation is finishing. From the reproducer:
bootstrap.Modal.getInstance(document.querySelector('#exampleModal')).hide();
document.body.innerHTML = 'Page content changed';
When would this happen? It happens, for example, if you're using Turbo. For example, if you close a modal, then immediately "visit" another page, in reality, that just swaps the body.innerHTML
for the page, which causes backdrop to error when it can't find its parent (after the animation).
Please let me know if you need any more clarification or tweaks to the PR :).
Thanks!