Hey,
I have the issue that if a user uses the Google Translate in Chrome (and likely also other similar extensions), I get a client-side error (likely) once I update a specific element (button).

The following error is printed to the console:

NotFoundError: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.

I can only assume that it comes from the following snippet:

{error &&
  <div className="gap-1 text-red-400 text-sm">
    <HiExclamation className="inline size-4 mr-1" />
    {error}
  </div>
}

<Button
  ref={button}
  variant={state === State.Success ? "success" : "secondary"}
  className={cn(error && "cursor-not-allowed", state === State.Success && "cursor-not-allowed", "font-medium w-full")}
  disabled={!!error || state === State.Success}
>
  {state === State.Loading
    ? <TailSpin stroke="#d4d4d4" strokeWidth={8} className="relative h-3 w-3 overflow-visible" />
    : <HiFingerPrint />
  }
  {state === State.Success
    ? "Verification successful"
    : "Complete verification"
  }
</Button>

https://cdn.discordapp.com/attachments/939999913406787654/1318849922258436097/Screencast_From_2024-12-18_08-58-17.mp4?ex=6763d234&is=676280b4&hm=c859c268478ea59abb58749af7d193bb6ac11b3404a3409c4c90c64036080687&