From 846f76a56fd37d8920638f4d34718e69b7e5e67f Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 1 Feb 2026 01:56:58 +0000
Subject: [PATCH] Add copy to clipboard button for response body in CORS Fetch
 Tester

https://claude.ai/code/session_01R4jg9mhHPSUkdfxtnEmP6f
---
 cors-fetch.html | 86 +++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 80 insertions(+), 6 deletions(-)

diff --git a/cors-fetch.html b/cors-fetch.html
index b16af29..6c10dca 100644
--- a/cors-fetch.html
+++ b/cors-fetch.html
@@ -444,12 +444,45 @@
       font-weight: 600;
     }
 
+    /* Body toolbar (format toggle + copy button) */
+    .body-toolbar {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 8px;
+      margin-bottom: 8px;
+    }
+
+    .copy-btn {
+      background: #e5e7eb;
+      color: #374151;
+      border: none;
+      border-radius: 6px;
+      padding: 5px 12px;
+      font-size: 0.82rem;
+      font-weight: 500;
+      cursor: pointer;
+      display: inline-flex;
+      align-items: center;
+      gap: 5px;
+      min-height: 30px;
+      transition: background 0.15s;
+    }
+
+    .copy-btn:hover {
+      background: #d1d5db;
+    }
+
+    .copy-btn.copied {
+      background: #dcfce7;
+      color: #166534;
+    }
+
     /* JSON format toggle */
     .format-toggle-row {
       display: flex;
       align-items: center;
       gap: 8px;
-      margin-bottom: 8px;
     }
 
     .format-toggle-row label {
@@ -701,11 +734,17 @@ <h1>CORS Fetch Tester</h1>
         Body
         <small>Shown as text (UTF-8)</small>
       </div>
-      <div id="format-toggle-container" class="format-toggle-row hidden">
-        <label>
-          <span id="format-toggle" class="toggle-switch active"></span>
-          <span>Format JSON</span>
-        </label>
+      <div class="body-toolbar">
+        <div id="format-toggle-container" class="format-toggle-row hidden">
+          <label>
+            <span id="format-toggle" class="toggle-switch active"></span>
+            <span>Format JSON</span>
+          </label>
+        </div>
+        <button type="button" class="copy-btn" id="copy-body-btn" title="Copy response body to clipboard">
+          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>
+          <span id="copy-body-label">Copy</span>
+        </button>
       </div>
       <pre id="body-output">// Response body will appear here</pre>
 
@@ -758,6 +797,10 @@ <h1>CORS Fetch Tester</h1>
     const formatToggleContainer = document.getElementById("format-toggle-container");
     const formatToggle = document.getElementById("format-toggle");
 
+    // Copy button
+    const copyBodyBtn = document.getElementById("copy-body-btn");
+    const copyBodyLabel = document.getElementById("copy-body-label");
+
     // Inline images
     const inlineImagesSection = document.getElementById("inline-images-section");
     const inlineImagesGrid = document.getElementById("inline-images-grid");
@@ -784,6 +827,37 @@ <h1>CORS Fetch Tester</h1>
       updateBodyDisplay();
     });
 
+    // Copy body to clipboard
+    copyBodyBtn.addEventListener("click", async () => {
+      const text = bodyOutput.textContent;
+      if (!text) return;
+      try {
+        await navigator.clipboard.writeText(text);
+        copyBodyBtn.classList.add("copied");
+        copyBodyLabel.textContent = "Copied!";
+        setTimeout(() => {
+          copyBodyBtn.classList.remove("copied");
+          copyBodyLabel.textContent = "Copy";
+        }, 1500);
+      } catch {
+        // Fallback for older browsers or insecure contexts
+        const textarea = document.createElement("textarea");
+        textarea.value = text;
+        textarea.style.position = "fixed";
+        textarea.style.opacity = "0";
+        document.body.appendChild(textarea);
+        textarea.select();
+        document.execCommand("copy");
+        document.body.removeChild(textarea);
+        copyBodyBtn.classList.add("copied");
+        copyBodyLabel.textContent = "Copied!";
+        setTimeout(() => {
+          copyBodyBtn.classList.remove("copied");
+          copyBodyLabel.textContent = "Copy";
+        }, 1500);
+      }
+    });
+
     function updateBodyDisplay() {
       if (responseIsJson) {
         bodyOutput.textContent = showFormatted ? responseBodyFormatted : responseBodyRaw;