Solución:
No tengo muy claro lo que realmente sucede aquí …
Parece que hay un desajuste en cuanto a lo que debe usarse entre los value y el textContent propiedades de su área de texto.
Chrome parece usar siempre value, mientras que Firefox usa textContent.
btn.onclick = e => {
const txt = document.createElement('textarea');
document.body.appendChild(txt);
txt.value="from value"; // chrome uses this
txt.textContent="from textContent"; // FF uses this
var sel = getSelection();
var range = document.createRange();
range.selectNode(txt);
sel.removeAllRanges();
sel.addRange(range);
if(document.execCommand('copy')){
console.log('copied');
}
document.body.removeChild(txt);
}<button id="btn">Copy!</button>
<textarea>You can paste here
</textarea>Dado que Chrome no mira el textContent propiedad, Rango # selectNodeContents no seleccionará nada en este navegador …
Sin embargo, puede utilizar Rango # selectNode que debería devolver el mismo resultado en este caso y solucionará el problema.
document.getElementById('btn').addEventListener('click', function(){
var textarea = document.createElement('textarea');
textarea.textContent="copied text";
document.body.appendChild(textarea);
var selection = document.getSelection();
var range = document.createRange();
// range.selectNodeContents(textarea);
range.selectNode(textarea);
selection.removeAllRanges();
selection.addRange(range);
console.log('copy success', document.execCommand('copy'));
selection.removeAllRanges();
document.body.removeChild(textarea);
})<button id="btn">copy</button>
<textarea>You can paste here</textarea>Para las personas que lean esta pregunta en 2020, si tienen problemas con document.execCommand('copy'), puede intentar utilizar la API del Portapapeles.
Por Mozilla:
Hay dos formas en que las extensiones del navegador pueden interactuar con el portapapeles del sistema: el método Document.execCommand () y la API de portapapeles asincrónica moderna.
También por Mozilla, document.execCommand() ahora está obsoleto:
Esta característica está obsoleta. Aunque todavía puede funcionar en algunos navegadores, se desaconseja su uso ya que podría eliminarse en cualquier momento. Trate de evitar su uso.
Con la API del portapapeles, escribir texto en el portapapeles es particularmente fácil:
const textToCopy = 'Hello there!'
navigator.clipboard.writeText(textToCopy)
.then(() => { alert(`Copied!`) })
.catch((error) => { alert(`Copy failed! ${error}`) })
Más información:
Discusión de Mozilla sobre los dos sistemas de portapapeles
Discusión de Google sobre los dos sistemas de portapapeles
Otra buena discusión sobre la API del Portapapeles
Puedo usar