Failed to execute 'insertAdjacentHTML' on 'Element': The element has no parent.

[nabi]

Hello. When I use this plugin in react like this,

export function Comments() {
  return (
    <section
      className="w-full mt-8 print:hidden"
      ref={(element) => {
        if (!element) return;
        const script = document.createElement("script");
        script.setAttribute("src", "https://utteranc.es/client.js");
        script.setAttribute("repo", "KimPinot/plog-comments");
        script.setAttribute("issue-term", "pathname");
        script.setAttribute("label", "comment :speech_balloon:");
        script.setAttribute("theme", "github-light");
        script.setAttribute("crossorigin", "anonymous");
        script.setAttribute("async", "true");
        element.replaceChildren(script);
      }}
    />
  );
}

This error always shown :(

Uncaught DOMException: Failed to execute 'insertAdjacentHTML' on 'Element': The element has no parent.
    at https://utteranc.es/client.js:1:1821
    at https://utteranc.es/client.js:1:2220

Then, How can I fix it?

[Shafqat]

This is working for me