Target for .modal-open

[bkbillma]

I am building a vue web component that uses bootstrap. All of my css/js is contained inside the web component. When i use the component and open a modal, the .modal-open is added to the body and because my css/js is contained to the web component some css doesn't work and the closing of the modal by clicking on modal background doesn't work.

If i could tell my modals to open with a target of the root of my web component (or if it could somehow detect it is inside of a web component) that should fix the issues.

The same functionality is needed for toasts.

[bkbillma]

Perhaps it could check for a shadowRoot and if there is one attach to first block element or even require us to add a property to the element we want to attach to.

[rohit2sharma95]

@bkbillma As per my understanding, you want to open a modal within a container 🤔
But the modal plugin actually works globally in DOM, so where is the markup placed for modal, does not matter too much
It would be good if you could create a demo on stackblitz with the issue (Or if you could provide a sample code) 😄

I am not much familiar with web components

[spicalous]

This would also be awesome for Ember developers as tests run the app in a container. It would also be awesome if we are able to also specify animation duration.