Failed to execute 'attachShadow' on 'Element': Shadow root cannot be created on a host which already hosts a shadow tree

[smikula]

When doing some debugging in a related area, I noticed this error happening within react-shadow:

Failed to execute 'attachShadow' on 'Element': Shadow root cannot be created on a host which already hosts a shadow tree

With some digging, it appears that the code attempts to attach the shadow DOM on every render of the component (in the useLayoutEffect here).

Fortunately things still seem to work in most cases because the error is caught and there's some code that tries again to apply the adopted style sheets, but I'm sure this isn't the intended behavior. Shouldn't you keep track of whether the shadow has been attached and only do it once?

I'm not preciesly sure what the best fix is for the problem, but if you want I can come up with a PR for it.

[maus2maus]

Yes, I found the same issue -- when the component is remounted by React 18. And in my case the code execution is abrupted despite there is a try-catch inside the library. Would be great to fix it