fix: support code copy in firefox & safari, close #39

assets/js/code-copy.js

@@ -23,11 +23,25 @@
     if (highlightDiv.querySelector("table")) { // code with line number
       codeToCopy = highlightDiv.querySelector("td:last-child code").textContent;
     }
+    let permissionGranted = true;
     try {
       var result = await navigator.permissions.query({ name: "clipboard-write" });
-      if (result.state == "granted" || result.state == "prompt") {
+      if (result.state != "granted" && result.state != "prompt") {
+        permissionGranted = false;
+      }
+    } catch (_) {
+      // The clipboard-write permission name is not supported in Firefox, only Chromium browsers.
+      // default to true in case of error for firefox
+    }
+
+    try {
+      if (permissionGranted) {
         await navigator.clipboard.writeText(codeToCopy);
+      } else {
+        copyCodeBlockExecCommand(codeToCopy, highlightDiv);
       }
+    } catch (_) {
+      copyCodeBlockExecCommand(codeToCopy, highlightDiv);
     } finally {
       /* Chrome doesn't seem to blur automatically,
          leaving the button in a focused state. */
@@ -38,4 +52,21 @@
       }, 2000);
     }
   }
+
+  function copyCodeBlockExecCommand(codeToCopy, highlightDiv) {
+    const textArea = document.createElement("textArea");
+    textArea.contentEditable = "true";
+    textArea.readOnly = "false";
+    textArea.className = "copyable-text-area";
+    textArea.value = codeToCopy;
+    highlightDiv.insertBefore(textArea, highlightDiv.firstChild);
+    const range = document.createRange();
+    range.selectNodeContents(textArea);
+    const sel = window.getSelection();
+    sel.removeAllRanges();
+    sel.addRange(range);
+    textArea.setSelectionRange(0, 999999);
+    document.execCommand("copy");
+    highlightDiv.removeChild(textArea);
+  }
 })();