Cuando escribo algo en el elemento del área de texto y luego hago clic en el botón de lectura, no se pronuncia nada. La consola no arroja ningún error y tampoco puedo identificar dónde me equivoqué. Fui a la documentación de MDN "SpeechUtterance" y, por lo que puedo decir, he seguido todos los pasos correctos. ¡Ayuda por favor!
const read = document.getElementById("read"); const pause = document.getElementById("pause"); const stop = document.getElementById("stop"); const speed = document.getElementById("speed"); const text = document.getElementById("text"); read.addEventListener("click", () => { readText(text.value) }); pause.addEventListener("click", () => { pauseText(); }); function readText(dummy) { var utterThis = new SpeechSynthesisUtterance(dummy); if(speechSynthesis.speaking && speechSynthesis.paused) { return speechSynthesis.resume() } if(speechSynthesis.speaking) return; console.log(utterThis) console.log(speechSynthesis) utterThis.text = dummy; utterThis.rate = speed.value text.disabled = true; speechSynthesis.speak(utterThis) utterThis.addEventListener("end", () => { text.disabled = false }) } function pauseText() { if(speechSynthesis.speaking) speechSynthesis.pause(); } body { background-color: purple; } textarea { margin-top: 50px; margin: auto; } textarea:focus { background: green; } .container { display: flex; justify-content: center; } <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <link rel="stylesheet" href="index.css"> <title></title> </head> <body> <textarea id="text" name="name" rows="30" cols="100"></textarea> <div class="container"> <label for="speed">Speed</label> <input id="speed" type="number" min="0" step="1" max="10"> <button id="read" type="button" name="button">Read</button> <button id="pause" type="button" name="button">Pause</button> <button id="stop" type="button" name="button">Stop</button> </div> </body> <script src="index.js" charset="utf-8"></script> </html>