Modal Dialog and closable Notification

[Edit: I confused “modal” and “non-modal”]

I have a modal Dialog where the user is to perform some action.
Since it is modal, the user can close it by clicking outside.

If something goes wrong while the Dialog is open, I display a closable Notification.
When the user clicks to close the Notification, the Dialog is also closed.

This is logical, since I did click “outside” the Dialog, but it is not what I want.
Any way to get around it?
I still want click outside the Dialog to close it though.

Theorie Not tested: if you add the notification inside the dialog (dialog.add(notification)) it might work…

Related: fix: prevent closing overlays when interacting with notifications by sissbruecker · Pull Request #3208 · vaadin/web-components · GitHub

Tried it. Didn’t help

That one is done and closed, so whatever it did didn’t help for my case.

I see that the new popover attribute and <dialog> are mainline now.
Maybe Vaadin should switch to those?

I see that the new popover attribute and are mainline now.
Maybe Vaadin should switch to those?

It is an idea worth of thought, and it has been discussed every now and then. The problem is that it would be major breaking change. It would require to rewrite many components and maybe also to change some behaviors that are not compatible vaadin-overlay vs. dialog element.