Como obter a lista de vozes no discursoSíntese do Chrome (Web Speech API)

O HTML a seguir mostra a matriz vazia no console no primeiro clique:

<!DOCTYPE html>
<html>
    <head>
        <script>
            function test(){
                console.log(window.speechSynthesis.getVoices())
            }
        </script>
    </head>
    <body>
        <a href="#" onclick="test()">Test</a>
    </body>
</html>

No segundo clique, você receberá a lista esperada.

Se você adicionaronload evento para chamar esta função (<body onload="test()">), então você pode obter o resultado correto no primeiro clique. Observe que a primeira chamada emonload ainda não funciona corretamente. Ele retorna vazio no carregamento da página, mas funciona depois.

Questões:

Uma vez que pode serum inseto na versão beta, desisti das perguntas "Por que".

Agora, a questão é se você deseja acessarwindow.speechSynthesis no carregamento da página:

Qual é o melhor truque para esse problema?Como você pode ter certeza de que ele carregaráspeechSynthesis, no carregamento da página?

Antecedentes e testes:

Eu estava testando os novos recursos da Web Speech API, e cheguei a esse problema no meu código:

<script type="text/javascript">
$(document).ready(function(){
    // Browser support messages. (You might need Chrome 33.0 Beta)
    if (!('speechSynthesis' in window)) {
      alert("You don't have speechSynthesis");
    }

    var voices = window.speechSynthesis.getVoices();
    console.log(voices) // []

    $("#test").on('click', function(){
        var voices = window.speechSynthesis.getVoices();
        console.log(voices); // [SpeechSynthesisVoice, ...]
    });
});
</script>
<a id="test" href="#">click here if 'ready()' didn't work</a>

Minha pergunta era: por quewindow.speechSynthesis.getVoices() retornar matriz vazia, depois que a página for carregada eonready função é acionada? Como você pode ver se clicar no link, a mesma função retorna uma variedade de vozes disponíveis do Chrome,onclick tigre?

Parece que o Chrome carregawindow.speechSynthesis após o carregamento da página!

O problema não está emready evento. Se eu remover a linhavar voice=... deready função, para o primeiro clique, mostra uma lista vazia no console. Mas o segundo clique funciona bem.

Parecewindow.speechSynthesis precisa de mais tempo para carregar após a primeira chamada. Você precisa chamá-lo duas vezes! Além disso, você precisa esperar e deixá-lo carregar antes da segunda chamadawindow.speechSynthesis. Por exemplo, o código a seguir mostra duas matrizes vazias no console se você executá-lo pela primeira vez:

// First speechSynthesis call
var voices = window.speechSynthesis.getVoices();
console.log(voices);

// Second speechSynthesis call
voices = window.speechSynthesis.getVoices();
console.log(voices);

questionAnswers(10)

yourAnswerToTheQuestion