title: Copy text function not working when embedded into another page (JavaScript)
body: <p>I have an app that takes a URL as an input, replaces the domain, and returns a new URL in the same input box.</p>
  <p>I added a <strong>copyText function</strong> to copy the new URL to the clipboard. The code works locally, on JSFiddle, and on my S3 account. When I embed the app onto other pages as an iframe, all my functions work except the copyText function. I'm also noticing that function doesn't work here either. What am I doing wrong?</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function copyText() {
    var copyText = document.getElementById("input");
    copyText.select();
    copyText.setSelectionRange(0, 99999); 
    navigator.clipboard.writeText(copyText.value);
    alert("Link copied.");
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;input id="input" type="text" placeholder="Enter text..." autocomplete="off"/&gt;
  &lt;button id="copy" onclick="copyText()"&gt;Copy&lt;/button&gt;</code></pre>
  </div>
  </div>
  </p>
  <p><a href="https://jsfiddle.net/ianjmonk/07dwg6sr/21/#&amp;togetherjs=VPAalw11ob" rel="nofollow noreferrer">https://jsfiddle.net/ianjmonk/07dwg6sr/21/#&amp;togetherjs=VPAalw11ob</a></p>