| <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| <html> |
| <head> |
| <canvas id="canvas1" width=320px height=240px></canvas> |
| <video id="video" autoplay></video> |
| <canvas id="canvas2" width=320px height=240px></canvas> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <script src ="routines.js"></script> |
| <script> |
| |
| var color = "green"; |
| |
| function printCanvas() |
| { |
| var context = canvas1.getContext("2d"); |
| context.fillStyle = color; |
| context.fillRect(0, 0, canvas1.width, canvas1.height); |
| } |
| |
| function printRectangleEvery50ms() |
| { |
| printCanvas(); |
| setTimeout(printRectangleEvery50ms, 50); |
| } |
| |
| function testCanvas(testName, canvas, isSame, count) |
| { |
| var array1 = canvas.getContext("2d").getImageData(20, 20, 60, 60).data; |
| if (count === undefined) |
| count = 0; |
| canvas2.getContext("2d").drawImage(video, 0 ,0); |
| array2 = canvas2.getContext("2d").getImageData(20, 20, 60, 60).data; |
| var isEqual = true; |
| var index = 0; |
| for (index = 0; index < array1.length; ++index) { |
| // Rough comparison since we are compressing data. |
| // This test still catches errors since we are going from green to blue to red. |
| if (Math.abs(array1[index] - array2[index]) > 100) { |
| isEqual = false; |
| continue; |
| } |
| } |
| if (isEqual === isSame) |
| return Promise.resolve(); |
| |
| if (count === 20) |
| return Promise.reject(testName + " failed, expected " + JSON.stringify(array1) + " but got " + JSON.stringify(array2)); |
| |
| return waitFor(100).then(() => { |
| return testCanvas(testName, canvas, isSame, ++count); |
| }); |
| } |
| |
| promise_test((test) => { |
| printRectangleEvery50ms(); |
| return new Promise((resolve, reject) => { |
| createConnections((firstConnection) => { |
| var stream = canvas1.captureStream(); |
| firstConnection.addTrack(stream.getVideoTracks()[0], stream); |
| }, (secondConnection) => { |
| secondConnection.ontrack = (trackEvent) => { |
| assert_true(trackEvent.track instanceof MediaStreamTrack); |
| assert_true(trackEvent.receiver instanceof RTCRtpReceiver); |
| assert_true(Array.isArray(trackEvent.streams), "Array.isArray() should return true"); |
| assert_true(Object.isFrozen(trackEvent.streams), "Object.isFrozen() should return true"); |
| resolve(trackEvent.streams[0]); |
| }; |
| }); |
| setTimeout(() => reject("Test timed out"), 5000); |
| }).then((stream) => { |
| video.srcObject = stream; |
| return video.play(); |
| }); |
| }, "Setting up the connection"); |
| |
| promise_test((test) => { |
| return testCanvas("test 1", canvas1, true); |
| }, "Checking canvas is green"); |
| |
| promise_test((test) => { |
| color = "red"; |
| printCanvas() |
| return testCanvas("test 2", canvas1, true); |
| }, "Checking canvas is red"); |
| |
| |
| promise_test((test) => { |
| color = "green"; |
| printCanvas(); |
| return testCanvas("test 3", canvas1, true); |
| }, "Checking canvas is green again"); |
| |
| promise_test((test) => { |
| canvas1.width = 640; |
| canvas1.height = 480; |
| printCanvas(); |
| return waitForVideoSize(video, 640, 480); |
| }, "Checking canvas size change"); |
| </script> |
| </head> |
| </html> |
