modal extension: delayed removal of backdrop causes problems with new modals

[daumling]

Describe the bug The backdrop is removed within a setTimeout() call that kicks in after the animation ends. If a modal is closed, closely followed by another modal, the backdrop is removed even if the new modal is still open. Closing the new modal causes an exception, because the next setTimeout() attempts to remove the backdrop, which does not exist anymore.

To Reproduce Create JS code that opens a new modal right after a modal has been closed. Maybe use a jspanelclosed event handler. It is important that the new modal appears before the backdrop removal animation ends.

Note that I did not manage to reproduce this behavior consistently. It always works, for some reason, if the follow-up modal contains a text field, and input events are processed.

Expected behavior removeBackdrop() should not attempt to remove the backdrop if any modal is active.

Desktop (please complete the following information):

• OS: Mac OS 12.3.1
• Browser: Chrome 101
• Version 4.13.0

[Flyer53]

I cannot reproduce the issue at all. Neither in Firefox, nor Chrome using code like:

jsPanel.modal.create({
  onclosed: ()=>{
    jsPanel.modal.create();
  }
});

Each modal panel has its own modal backdrop with an id value tied to the proper modal panel. So it should not be possible that a wrong backdrop is removed. Even if you have two modals open at the same time you have two modal backdrops. The only issue I see is that with the code above the second modal's backdrop has a "wrong" opacity value because the first backdrop is still there. Normally a modal backdrop has an opacity of 0.65. From the second on it's 0.15. This can be avoided with a small delay before the second modal is created.

[daumling]

Actually, it was a beginner's error from my side :(

I used document.write() to display a dialog result right after closing the first dialog, which messed up the DOM.

Closing.