From 981fb2764f3fa9f05532ae054d0b762eee526822 Mon Sep 17 00:00:00 2001
From: Oxylibrium <lucy@coder.com>
Date: Thu, 23 Jun 2022 16:35:12 -0400
Subject: [PATCH] fix: add copy fallback for insecure contexts (#2044)

---
 site/src/components/CopyButton/CopyButton.tsx | 23 +++++++++++++++----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/site/src/components/CopyButton/CopyButton.tsx b/site/src/components/CopyButton/CopyButton.tsx
index 80b53d1a7e..0b69ef24d4 100644
--- a/site/src/components/CopyButton/CopyButton.tsx
+++ b/site/src/components/CopyButton/CopyButton.tsx
@@ -29,16 +29,29 @@ export const CopyButton: React.FC<CopyButtonProps> = ({
     try {
       await window.navigator.clipboard.writeText(text)
       setIsCopied(true)
-
       window.setTimeout(() => {
         setIsCopied(false)
       }, 1000)
     } catch (err) {
-      const wrappedErr = new Error("copyToClipboard: failed to copy text to clipboard")
-      if (err instanceof Error) {
-        wrappedErr.stack = err.stack
+      const input = document.createElement("input")
+      input.value = text
+      document.body.appendChild(input)
+      input.focus()
+      input.select()
+      const result = document.execCommand("copy")
+      document.body.removeChild(input)
+      if (result) {
+        setIsCopied(true)
+        window.setTimeout(() => {
+          setIsCopied(false)
+        }, 1000)
+      } else {
+        const wrappedErr = new Error("copyToClipboard: failed to copy text to clipboard")
+        if (err instanceof Error) {
+          wrappedErr.stack = err.stack
+        }
+        console.error(wrappedErr)
       }
-      console.error(wrappedErr)
     }
   }