ERROR : The node to be removed is not a child of this node.

[MatthewDlr]

Hello,

I recently updated my angular app to version 17.2.0 along with ngx-smart-modal version 14.0.3.
I noticed than, now I have many errors in the console with solely this error message:

ERROR DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
at Ae._destroyModal ...
at Ae.removeModal ...
at Ae._deleteModal ...

The thing is that ngx-smart-modal is working great, and the modals are correctly shown, I just have this error on every page, even when no modal is triggered. I would like to know if it's an issue or just a misconfiguration from my app?

Oh and last thing, since the update, I had to import the CSS using the following import, because all imports shown in the documentation didn't work. @import "../node_modules/ngx-smart-modal/styles/ngx-smart-modal.scss"

Thanks.

[dancharlton9]

@MatthewDlr did you manage to resolve this? I am experiencing the same issue.

[MatthewDlr]

Hey,
Unfortunately, the problem is still there for me also. But angular is hiding the errors in production mode and the modals are still working (just 2x slower) so I just stopped trying.

[dancharlton9]

Ah nightmare.
I have just been through the process or migrating to the latest version which involved implement ViewContainerRef which was painful. If we can't get rid of this error I think we will just need to move away from this plugin entirely.

[MatthewDlr]

I'm also considering moving away from this plugin, but it's a huge work 😔

[dancharlton9]

As part of migrating from version 7 to the latest version we encapsulated this plugin within a service that we manage. That way, if they choose to change the create method signature again we can mitigate. Should make swapping out slightly more straightforward but still a load of work.

[maximelafarie]

Hi, there,

The problem you're having is definitely a problem on the ngx-smart-modal side. I've added an extra check to a batch of current fixes to avoid this problem.

🖖

[maximelafarie]

@MatthewDlr for style import, you can do it like this:

@import "~ngx-smart-modal/styles/ngx-smart-modal.css";
// or
@import "~ngx-smart-modal/styles/ngx-smart-modal.scss";

[MatthewDlr]

Hey! No problem (and congrats 🎉).
It's still awesome that you're continuing to support this project.