Strange errors on some DIalogs.

[chdenat]

Hi there.

I got some strange errors using SlDialogs. Some are working nice, some others not.

The errors:

 this.modal.activate is not a function
 this.modal.deactivate is not a function

The dialog opens but when I want to close it I get this error.

chunk.Y3QGZJLX.js:142 
 Uncaught (in promise) TypeError: this.modal.deactivate is not a function
    at SlDialog.handleOpenChange (chunk.Y3QGZJLX.js:142:18)

And I can't close it.

My environment is Vite 6, React 19

Any idea to fix this ? Thx

[claviska]

We're probably going to need a repro of this, unfortunately. Are you using the latest version?

[chdenat]

Yes I'm on the latest version.
I'm trying to find the differences between my modals that might explain why some are working and why others not.

This a problem of focus I think. I removed some react components not yet updated (and they won't be) and replace them by JS code and got the errors.

[claviska]

Oh if you're using external dialogs make sure you're calling modal.activateExternal and modal.deactivateExternal. The error above says:

this.modal.deactivate is not a function

But this.modal.deactivateExternal should exist.

[chdenat]

Yes I've checked in the code.

But the good news is that I've found a workaround (or perhaps it is the correct usage). By changing my DOM stack order it works without any error... The dialogs are now on the top (they were not, but with some css pointer-events rules).

Some dialogs are also closing now with Blocked aria-hidden on an element because its descendant retained focus. error but I think that I have to fix some autofocus.

[chdenat]

Hi,

This error was due to a modal property in SlDialog definition.
In React18, no warnings, but it fails in React19.