diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base_js.html.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base_js.html.twig index e501ebe58bc5d..646a650387d22 100644 --- a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base_js.html.twig +++ b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base_js.html.twig @@ -13,6 +13,7 @@ constructor() { this.#createTabs(); this.#createToggles(); + this.#createCopyToClipboard(); this.#convertDateTimesToUserTimezone(); } @@ -161,18 +162,41 @@ }); }); - /* Prevents from disallowing clicks on "copy to clipboard" elements inside toggles */ - const copyToClipboardElements = toggle.querySelectorAll('span[data-clipboard-text]'); - copyToClipboardElements.forEach((copyToClipboardElement) => { - copyToClipboardElement.addEventListener('click', (e) => { - e.stopPropagation(); - }); - }); - toggle.setAttribute('data-processed', 'true'); }); } + #createCopyToClipboard() { + if (!navigator.clipboard) { + return; + } + + const copyToClipboardElements = document.querySelectorAll('[data-clipboard-text]'); + + copyToClipboardElements.forEach((copyToClipboardElement) => { + copyToClipboardElement.classList.remove('hidden'); + + copyToClipboardElement.addEventListener('click', (e) => { + /* Prevents from disallowing clicks on "copy to clipboard" elements inside toggles */ + e.stopPropagation(); + + navigator.clipboard.writeText(copyToClipboardElement.getAttribute('data-clipboard-text')); + + let oldContent = copyToClipboardElement.textContent; + + copyToClipboardElement.textContent = `✅ Copied!`; + copyToClipboardElement.disabled = true; + copyToClipboardElement.classList.add('status-success'); + + setTimeout(() => { + copyToClipboardElement.textContent = oldContent; + copyToClipboardElement.disabled = false; + copyToClipboardElement.classList.remove('status-success'); + }, 7000); + }); + }); + } + #convertDateTimesToUserTimezone() { const userTimezoneName = Intl.DateTimeFormat().resolvedOptions().timeZone; diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/toolbar_js.html.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/toolbar_js.html.twig index 90f254c1d65ef..6171d5dc918ad 100644 --- a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/toolbar_js.html.twig +++ b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/toolbar_js.html.twig @@ -50,33 +50,6 @@ }; } - if (navigator.clipboard) { - document.addEventListener('readystatechange', () => { - if (document.readyState !== 'complete') { - return; - } - - document.querySelectorAll('[data-clipboard-text]').forEach(function (element) { - removeClass(element, 'hidden'); - element.addEventListener('click', function () { - navigator.clipboard.writeText(element.getAttribute('data-clipboard-text')); - - if (element.classList.contains("label")) { - let oldContent = element.textContent; - - element.textContent = "✅ Copied!"; - element.classList.add("status-success"); - - setTimeout(() => { - element.textContent = oldContent; - element.classList.remove("status-success"); - }, 7000); - } - }); - }); - }); - } - var request = function(url, onSuccess, onError, payload, options, tries) { var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP'); options = options || {};