Question:

Im using this exact code in both the scenarios.

var msg = new SpeechSynthesisUtterance(); var voices = window.speechSynthesis.getVoices(); msg.voice = voices[1]; msg.text = "hello world"; msg.lang = 'en-US'; speechSynthesis.speak(msg);

If I run this in the chrome console I get a female voice. But if I put the exact code in an index.html and run it, it plays a male voice. Could any one please clarify why this difference occurs. Thanks in advance.

Found the Root cause. <a href="https://stackoverflow.com/questions/21513706/getting-the-list-of-voices-in-speechsynthesis-of-chrome-web-speech-api" rel="nofollow">Getting the list of voices in speechSynthesis of Chrome (Web Speech API)</a>

The calls are async, so when I try to run in index.html the voices array is empty. As I suggested when I run this and then use the speak it works fine.

var msg; var voices; var timer = setInterval(function() { voices = speechSynthesis.getVoices(); console.log(voices); if (voices.length !== 0) { msg = new SpeechSynthesisUtterance(); msg.voice = voices[0]; speechSynthesis.speak(msg); msg.lang = 'en-US'; clearInterval(timer); } }, 200); timer(); speechSynthesis.speak("hello world");