themesberg / flowbite

Open-source UI component library and front-end development framework based on Tailwind CSS
https://flowbite.com
MIT License
7.3k stars 710 forks source link

Fix modal for turbo-rails #849

Open solilin opened 3 months ago

solilin commented 3 months ago

I'm encountering an issue with the turbo-rails modal implementation. When there's a link inside a modal window, and it's set to turbo_frame: :_top, clicking on it causes turbo-rails to remove the modal. Subsequently, when there's a link on the new page for the modal, the modal doesn't open, resulting in the following error.

This occurs because document.querySelector('[modal-backdrop]') no longer exists.

To address this, I've added a condition to check whether it exists or not.

TypeError: Cannot read properties of null (reading 'remove')
    at __webpack_modules__.16.Modal._destroyBackdropEl (flowbite.turbo.js?asddsd:4146:55)
    at __webpack_modules__.16.Modal.destroy (flowbite.turbo.js?asddsd:4123:18)
    at __webpack_modules__.16.Modal.destroyAndRemoveInstance (flowbite.turbo.js?asddsd:4131:14)
    at __webpack_modules__.423.Instances.addInstance (flowbite.turbo.js?asddsd:5130:44)
    at new Modal (flowbite.turbo.js?asddsd:4109:29)
    at extended.connect (modal_controller.js:23:19)
    at Context.connect (chunk-WZPCIBW5.js?v=6b462b32:1439:23)
    at Module.connectContextForScope (chunk-WZPCIBW5.js?v=6b462b32:1603:13)
    at Router.scopeConnected (chunk-WZPCIBW5.js?v=6b462b32:1975:14)
    at ScopeObserver.elementMatchedValue (chunk-WZPCIBW5.js?v=6b462b32:1884:21)
dv29 commented 2 months ago

I have the same issue but i'm not using turbo-rails. though not sure whats causing this for me