| <!DOCTYPE html> |
| <title>Verify drawing video frames to canvas using media stream.</title> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <video></video> |
| <canvas width="1" height="1"></canvas> |
| <script> |
| async_test(function(t) { |
| var video = document.querySelector("video"); |
| var canvas = document.querySelector("canvas"); |
| navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) { |
| // start preview. |
| video.srcObject = stream; |
| video.play(); |
| }, t.unreached_func); |
| |
| video.onplaying = t.step_func_done(function() { |
| var width = canvas.width; |
| var height = canvas.height; |
| var ctx = canvas.getContext("2d"); |
| ctx.fillStyle = "black"; |
| ctx.fillRect(0, 0, width, height); |
| |
| // paint to canvas. |
| ctx.drawImage(video, 0, 0, width, height); |
| var frame = ctx.getImageData(0, 0, width, height); |
| assert_not_equals(frame, null); |
| assert_not_equals(frame.data[0] + frame.data[1] + frame.data[2], 0); |
| }); |
| }); |
| </script> |