私は Mobile Safari で音声合成を行っていますが、特に音声中に DOM が操作されている場合、非常に不安定であることがわかりました。iPad 上の iOS 7.1.1 で Safari (または Webview) をクラッシュさせる簡単なテスト ケースを作成しました (ただし、OS X Safari では問題なく動作します)。次の HTML ページがモバイル Safari を強制終了する理由を知っている人はいますか?
<!DOCTYPE html>
<html>
<head>
<title>Speech Bug</title>
<script>
function testFunc()
{
var elem = document.getElementById("textout");
var wordCount = 0, utterance = new SpeechSynthesisUtterance("You'll notice that Safari on iOS will crash after clicking this button several times.");
utterance.onstart = function(event) {
elem.innerHTML = "";
}
utterance.onboundary = function (event) {
elem.innerHTML += ++wordCount + "\n";
elem.scrollTop = wordCount * 22;
}
window.speechSynthesis.speak(utterance);
}
</script>
</head>
<body>
<div id="textout" style="white-space: pre; font-size: 14pt; height: 100px; width: 50px; overflow: auto"></div>
<button onclick="testFunc()">Click to Fail</button>
</body>
</html>