bestguy / sveltestrap

Bootstrap 4 & 5 components for Svelte
https://sveltestrap.js.org
MIT License
1.3k stars 180 forks source link

Modal on:opening and on:open events are not firing #578

Open pajohns opened 8 months ago

pajohns commented 8 months ago

I have the following modal component...

<script <script>
    import { Modal } from "sveltestrap";
</script>

<Modal
    on:open={() => console.log('open')}
    on:opening={() => console.log('opening')}
    on:closing={() => console.log('closing')}
    on:close={() => console.log('close')}
    size="xl"
    isOpen={isOpen}
    contentClassName="modal-xl"
>

    <!-- Modal Content -->

</Modal>

When observing the console I note that when the modal is opened there are no log entries, however, when closing both the 'closing' and 'close' events are fired. I notice that they're tied to the on:introstart and on:introend events on the primary modal container but I'm unsure why they wouldn't be firing.

pajohns commented 8 months ago

Update: I was able to work around this problem by removing the {#if _isMounted} line from the Modal.svelte file. It seems that it's a svelte issue with the introstart and introend events not firing if it's nested within double if statements that are being changed at the same time - race condition maybe? I moved them into a single if

{#if isOpen && _isMounted}