Created
July 22, 2021 19:05
-
-
Save kwindla/bc908f503c1a2b36e2a921a9572f109c to your computer and use it in GitHub Desktop.
Chrome 92 WebMediaPlayer breaking change
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <title>chrome 92 media elements bug</title> | |
| </head> | |
| <body> | |
| <div id="local-controls" style="width: 50%; float: left"> | |
| <button onclick="start(badLoop)"> | |
| start bad loop (dies at 75 Chrome 92/desktop) | |
| </button> | |
| <button onclick="start(goodLoop)">start good loop</button> | |
| <hr /> | |
| <canvas id="can" width="640" height="320" style="width: 100%"></canvas> | |
| </div> | |
| <div id="videos" style="margin-left: 50%"></div> | |
| <script> | |
| window.track = null; | |
| window.loopCnt = 0; | |
| async function start(k) { | |
| let stream = await navigator.mediaDevices.getUserMedia({ video: true }); | |
| window.track = stream.getVideoTracks()[0]; | |
| k(); | |
| } | |
| async function badLoop() { | |
| let oldEl = document.getElementById('videos').children[0]; | |
| if (oldEl) { | |
| // oldEl.srcObject = null; | |
| oldEl.remove(); | |
| } | |
| console.log(window.loopCnt++); | |
| let vid = document.createElement('video'); | |
| vid.autoplay = true; | |
| vid.srcObject = new MediaStream([window.track]); | |
| vid.style.width = '100%'; | |
| document.getElementById('videos').append(vid); | |
| setTimeout(badLoop, 100); | |
| } | |
| async function goodLoop() { | |
| let oldEl = document.getElementById('videos').children[0]; | |
| if (oldEl) { | |
| oldEl.srcObject = null; | |
| oldEl.remove(); | |
| } | |
| console.log(window.loopCnt++); | |
| let vid = document.createElement('video'); | |
| vid.autoplay = true; | |
| vid.srcObject = new MediaStream([window.track]); | |
| vid.style.width = '100%'; | |
| document.getElementById('videos').append(vid); | |
| setTimeout(goodLoop, 100); | |
| } | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment