title: document.execCommand('copy') Command not working in Chrome
body: <p>HTML</p>
  <pre><code>&lt;input type=&quot;text&quot; id=&quot;clipboard&quot;&gt;
  &lt;button class=&quot;share-button&quot;&gt;share&lt;/button&gt;
  </code></pre>
  <p>JS</p>
  <pre><code>  text = 'text to be copied';
  
    document.querySelector('.share-button').addEventListener('click', () =&gt; {
        var element = document.querySelector('#clipboard');
        element.setAttribute(&quot;value&quot;, text);
        console.log(element.value);
        element.select();
        document.execCommand('copy');
  
    });
  </code></pre>
  <p>CSS</p>
  <pre><code>#clipboard {
    position: absolute;
    visibility: hidden;
  }
  </code></pre>
  <p>I am trying to copy text to the clipboard but I don't understand what wrong with my code. I copied the code from MDN documentation.</p>
  <p>When I doing these things it is not working</p>
  <pre><code>#clipboard {
    position: absolute;
  }
  
  // or
  
  #clipboard {
    visibility: hidden
  }
  
  // or
  
  #clipboard {
    display: none
  }
  </code></pre>