Tengo un archivo de reacción, usando un copyText con navigatorClipboard y el comando documentExec. Sin embargo, en Safari, ambos no funcionan cuando la llamada finaliza con el modo asíncrono. Aquí hay un ejemplo creado en codesandbox:
https://codesandbox.io/s/goofy-worker-rypyr?file=/src/App.js
let textArea; const isOS = () => navigator.userAgent.match(/ipad|iphone/i); const selectText = (text) => { textArea = document.createElement("textArea"); textArea.value = text; document.body.appendChild(textArea); if (isOS()) { const range = document.createRange(); range.selectNodeContents(textArea); const selection = window.getSelection(); selection.removeAllRanges(); selection.addRange(range); textArea.setSelectionRange(0, 999999); } else { textArea.select(); } }; const copyToClipboard = () => { const success = document.execCommand("copy"); console.log(success); document.body.removeChild(textArea); }; const copyExecText = (text) => { selectText(text); copyToClipboard(); }; const copyNavText = (text) => { navigator.clipboard.writeText(text).then( () => { console.log("Async: Copying to clipboard was successful!"); }, (err) => { console.error("Async: Could not copy text: ", err); } ); }; export { copyExecText, copyNavText }; const wait = (ms) => new Promise((resolve) => setTimeout(resolve, ms)); const makeCopyText = async () => { await wait(1000); copyNavText("Non Sync copy text with Navigator!"); }; const makeCopyTextExec = async () => { await wait(1000); copyExecText("Non Sync copy text with exec!"); }; <div> <button onClick={makeCopyTextExec}>Async Copy Exec Text</button> <button onClick={makeCopyText}>Copy Nav Text</button> </div>Idealmente, estoy tratando de obtener el contexto de copia de una API (forma asíncrona) y ponerlo en el portapapeles. Safari rechaza ambas funciones de inmediato y no puedo poner el contenido en el Portapapeles. Sin embargo, tanto Chrome como Firefox funcionan bien.
Avíseme si hay alguna forma de hacer que Safari funcione en modo asíncrono.