title: Can not copy text into Clipboard - JavaScript
body: <p>I am trying to copy <strong>csv</strong> based data (from <em>SlickGrid</em>), in to system clipboard.
  For small chunks of data it is working fine, but when I have large set of data it is unable to copy into system clipboard.</p>
  
  <p>Here is the code use to perform copy:</p>
  
  <pre><code>copyTextToClipboard: function (text) {
      var textArea = document.createElement('textarea');
  
      // Hide textArea
      textArea.style.position = 'fixed';
      textArea.style.top = 0;
      textArea.style.left = 0;
      textArea.style.width = '2em';
      textArea.style.height = '2em';
      textArea.style.padding = 0;
      textArea.style.border = 'none';
      textArea.style.outline = 'none';
      textArea.style.boxShadow = 'none';
      textArea.style.background = 'transparent';
  
      textArea.value = text;
      document.body.appendChild(textArea);
      textArea.select();
  
      try {
          var successful = document.execCommand('copy');
          var msg = successful ? 'successful' : 'unsuccessful';
          console.log('Copying text command was ' + msg);
      } catch (err) {
          alert('Oops, unable to copy to clipboard');
      }
  
      document.body.removeChild(textArea);
  }
  </code></pre>
  
  <p>When I pass large <strong>csv</strong> based text into function, I always get:</p>
  
  <blockquote>
    <p>'Copying text command was unsuccessful'</p>
  </blockquote>
  
  <p>Sample CSV based text passed into 'copyTextToClipboard' function which fails to copy in clipboard
  <a href="https://i.stack.imgur.com/b092z.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/b092z.png" alt="enter image description here"></a></p>
  
  <p>Another interesting thing here, is when I use Developer tool and step over each line it properly copies the same data into Clipboard.</p>