Merge pull request #3311 from SillyTavern/fix-http-copy Fix copy actions for non-HTTPS/localhost

df28c2c676d62d2e9791839d336a5aa823b210ec

Cohee <18619528+Cohee1207@users.noreply.github.com>

Signed

public/script.js+9 -16 Viewed

     isTrueBoolean,
     toggleDrawer,
     isElementInViewport,
+    copyText,
 } from './scripts/utils.js';
 import { debounce_timeout } from './scripts/constants.js';

     const codeBlocks = $(messageElement).find('pre code');
     for (let i = 0; i < codeBlocks.length; i++) {
         hljs.highlightElement(codeBlocks.get(i));
-        if (navigator.clipboard !== undefined) {
         const copyButton = document.createElement('i');
         copyButton.classList.add('fa-solid', 'fa-copy', 'code-copy', 'interactable');
         copyButton.title = 'Copy code';
         codeBlocks.get(i).appendChild(copyButton);
-            copyButton.addEventListener('pointerup', function (event) {
+        copyButton.addEventListener('pointerup', async function () {
-                navigator.clipboard.writeText(codeBlocks.get(i).innerText);
+            const text = codeBlocks.get(i).innerText;
+            await copyText(text);
             toastr.info(t`Copied!`, '', { timeOut: 2000 });
         });
+    }
+}
-}
 /**

     } else {
         diffPrevPrompt.style.display = 'none';
+    }
-    popup.dlg.querySelector('#copyPromptToClipboard').addEventListener('click', function () {
+    popup.dlg.querySelector('#copyPromptToClipboard').addEventListener('pointerup', async function () {
         let rawPrompt = itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt;
         let rawPromptValues = rawPrompt;

             rawPromptValues = rawPrompt.map(x => x.content).join('\n');
+        }
-        navigator.clipboard.writeText(rawPromptValues);
+        await copyText(rawPromptValues);
         toastr.info(t`Copied!`);
     });

         //console.log(logMessage);
         try {
-            await navigator.clipboard.writeText(logMessage);
+            await copyText(logMessage);
             toastr.info('Your ST API setup data has been copied to the clipboard.');
         } catch (error) {
             toastr.error('Failed to copy ST Setup to clipboard:', error);

         setTimeout(function () { $('#shadow_select_chat_popup').css('display', 'none'); }, animation_duration);
     });
-    if (navigator.clipboard === undefined) {
+    $(document).on('pointerup', '.mes_copy', async function () {
-        // No clipboard support
-        $('.mes_copy').remove();
-    }
-    else {
-        $(document).on('pointerup', '.mes_copy', function () {
         if (this_chid !== undefined || selected_group || name2 === neutralCharacterName) {
             try {
                 const messageId = $(this).closest('.mes').attr('mesid');
                 const text = chat[messageId]['mes'];
-                    navigator.clipboard.writeText(text);
+                await copyText(text);
                 toastr.info('Copied!', '', { timeOut: 2000 });
             } catch (err) {
                 console.error('Failed to copy: ', err);
+            }
+        }
     });
-    }
     $(document).on('pointerup', '.mes_prompt', async function () {
         let mesIdForItemization = $(this).closest('.mes').attr('mesId');

@@ -11483,4 +11477,3 @@ jQuery(async function () {
11483		11477
11484	initCustomSelectedSamplers();	11478	initCustomSelectedSamplers();
11485	});	11479	});
11486

public/scripts/utils.js+20 -0 Viewed

+}
 /**
+ * Copy text to clipboard. Use navigator.clipboard.writeText if available, otherwise use document.execCommand.
+ * @param {string} text - The text to copy to the clipboard.
+ * @returns {Promise<void>} A promise that resolves when the text has been copied to the clipboard.
+ */
+export function copyText(text) {
+    if (navigator.clipboard) {
+        return navigator.clipboard.writeText(text);
+    }
+    const parent = document.querySelector('dialog[open]:last-of-type') ?? document.body;
+    const textArea = document.createElement('textarea');
+    textArea.value = text;
+    parent.appendChild(textArea);
+    textArea.focus();
+    textArea.select();
+    document.execCommand('copy');
+    parent.removeChild(textArea);
+}
+/**
  * Map of debounced functions to their timers.
  * Weak map is used to avoid memory leaks.
  * @type {WeakMap<function, any>}