svelte-headlessui icon indicating copy to clipboard operation
svelte-headlessui copied to clipboard

Nested dialog, html hidden style not disappearing bug

Open smblee opened this issue 3 years ago • 0 comments
trafficstars

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch @rgossiaux/[email protected] for the project I'm working on.

With nested Dialogs + svelte animations, I noticed hidden flag not being removed due to race conditions of how Dialogs close/unmount.

Here is the diff that solved my problem:

diff --git a/node_modules/@rgossiaux/svelte-headlessui/components/dialog/Dialog.svelte b/node_modules/@rgossiaux/svelte-headlessui/components/dialog/Dialog.svelte
index 03ab5c5..bbfb7a0 100644
--- a/node_modules/@rgossiaux/svelte-headlessui/components/dialog/Dialog.svelte
+++ b/node_modules/@rgossiaux/svelte-headlessui/components/dialog/Dialog.svelte
@@ -135,6 +135,9 @@ $: _cleanupScrollLock = (() => {
         return;
     if (!mounted)
         return;
+    if (document.documentElement.style.overflow === 'hidden') {
+        return;
+    }
     let overflow = document.documentElement.style.overflow;
     let paddingRight = document.documentElement.style.paddingRight;
     let scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;

This issue body was partially generated by patch-package.

smblee avatar Sep 28 '22 17:09 smblee