When calling getUserMedia on Safari (V 17.0) on MacOS 13.6 Safari UI freezes until the promise is resolved. It appears that user interactions are still happening, but nothing is displayed until getUserMedia resolves or rejects. A quick test to show the behavior can be done by running the following html from a local file. Click on the getUserMedia button then try to increase the counter. Nothing happens until the promise is resolved, but every click will be counted.
<html>
<body>
<button onclick=add()>Increase Counter</button>
<p id="counter">0</p>
<button onclick=gum()>getUserMedia</button>
<script type="text/javascript">
var counter = 0
function add() {
counter ++
document.getElementById("counter").innerHTML = counter
}
async function gum() {
await navigator.mediaDevices.getUserMedia({video:true,audio:true})
}
</script>
</body>
</html>
This makes for a bad user experience while doing things like collecting device names etc that should be able to happen in the background. Any work around to this? Or is this just a bug in how Safari runs getUserMedia?