| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src=../../media-resources/video-test.js></script> |
| <script> |
| if (window.testRunner) { |
| testRunner.dumpAsText(); |
| testRunner.waitUntilDone(); |
| } |
| |
| const redColor = new Uint8ClampedArray([255, 0, 0, 255]); |
| const greenColor = new Uint8ClampedArray([0, 255, 0, 255]); |
| |
| function arraysAreApproximatelyEqual(array, expected, tolerance) { |
| for (var index in array) { |
| if (Math.abs(array[index] - expected[index]) <= tolerance) |
| continue; |
| return false; |
| } |
| return true; |
| } |
| |
| |
| async function shouldBecomeColor(color) { |
| return new Promise((resolve, reject) => { |
| let interval = setInterval(() => { |
| var canvas = document.createElement('canvas'); |
| canvas.width = video.videoWidth; |
| canvas.height = video.videoHeight; |
| let context = canvas.getContext('2d'); |
| context.drawImage(video, 0, 0, canvas.width, canvas.height); |
| let foundColor = context.getImageData(canvas.width / 2, canvas.height / 2, 1, 1).data; |
| if (arraysAreApproximatelyEqual(foundColor, color, 25)) { |
| clearInterval(interval); |
| logResult(true, `video became equal to ${ color }`); |
| resolve(); |
| } |
| }, 1000); |
| }); |
| } |
| |
| async function start() { |
| if (!window.internals) { |
| consoleWrite('This test requires WebKit Internals'); |
| endTest(); |
| return; |
| } |
| |
| video = document.getElementById('video'); |
| |
| run('internals.setOverridePreferredDynamicRangeMode(video, "Standard")'); |
| run('video.src = "../resources/hls/hdr.m3u8"'); |
| |
| await shouldBecomeColor(redColor); |
| |
| run('internals.setOverridePreferredDynamicRangeMode(video, "DolbyVisionPQ")'); |
| |
| await shouldBecomeColor(greenColor); |
| |
| run('internals.setOverridePreferredDynamicRangeMode(video, "Standard")'); |
| |
| await shouldBecomeColor(redColor); |
| |
| endTest(); |
| } |
| </script> |
| </head> |
| <body onload="start()"> |
| <video id="video" autoplay muted></video> |
| </body> |
| </html> |