diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
| commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
| tree | f435a8308119effd964b339f76abb83a57c29483 /dom/media/test/reftest/generateREF.html | |
| parent | Initial commit. (diff) | |
| download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip | |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'dom/media/test/reftest/generateREF.html')
| -rw-r--r-- | dom/media/test/reftest/generateREF.html | 104 |
1 files changed, 104 insertions, 0 deletions
diff --git a/dom/media/test/reftest/generateREF.html b/dom/media/test/reftest/generateREF.html new file mode 100644 index 0000000000..4e26066973 --- /dev/null +++ b/dom/media/test/reftest/generateREF.html @@ -0,0 +1,104 @@ +<!DOCTYPE HTML> +<html> +<head> +<script type="application/javascript"> +</script> +</head> +<body> +<p id="out"></p> +<video id="v1" style="position:absolute; left:0; top:0"></video> +<canvas id="canvas"></canvas> +<script type="application/javascript"> +// READ ME FIRST. +// The script is trying to make a reftest sample for reftest. + +// STEP1. Uncomment the method below that you want to use. If you want to dump +// Nth frame, modify the parameter to the number of frame you want to dump. +//window.onload = function() { setTimeout(dumpFirstFrame, 0); }; +//window.onload = function() { setTimeout(dumpLastFrame, 0); }; +window.onload = function() { setTimeout(function(){dumpNthFrame(15);}, 0); }; + +// STEP2. Set the source of video that you want to capture +const videoSrc = ''; + +// STEP3. Ensure the pref `media.seekToNextFrame.enabled` is on +// STEP4. In a terminal, navigate to the containing folder and start a server with "python -m SimpleHTTPServer 8000" +// STEP5. Open "http://localhost:8000/generateREF.html" in the browser +// STEP6. Copy the base64 image url to your xxx-ref.html + +function drawVideoToInnerHTML(v) { + // This allows to dump content via canvas when the source is cross-origin. + v.crossorigin = "anonymous"; + var canvas = document.getElementById("canvas"); + canvas.width = v.videoWidth; + canvas.height = v.videoHeight; + var ctx = canvas.getContext("2d"); + ctx.drawImage(v, 0, 0, v.videoWidth, v.videoHeight); + var dataURL = canvas.toDataURL(); + document.getElementById("out").innerHTML=dataURL; +} + +function dumpFirstFrame() { + var video = document.getElementById("v1"); + video.src = videoSrc; + video.preload = "metadata"; + + video.addEventListener("loadeddata", function() { + drawVideoToInnerHTML(video); + }); +} + +function dumpNthFrame(n) { + var video = document.getElementById("v1"); + video.src = videoSrc; + video.preload = "metadata"; + const totalFrames = n; + + function checkNthFrame() { + console.log((totalFrames-n+1)+"th Frame time is " + video.currentTime); + n--; + if (n == 0) { + drawVideoToInnerHTML(video); + } else { + video.seekToNextFrame(); + } + } + video.addEventListener("loadeddata", checkNthFrame); + video.addEventListener("seeked", checkNthFrame); +} + +function dumpLastFrame() { + var video = document.getElementById("v1"); + video.src = videoSrc; + video.preload = "metadata"; + video.seenEnded = false; + + // Seek to the end + video.addEventListener("loadeddata", function() { + video.currentTime = video.duration; + video.onseeked = () => { + video.onseeked = null; + callSeekToNextFrame(); + }; + }); + + function callSeekToNextFrame() { + video.seekToNextFrame().then( + () => { + if (!video.seenEnded) + callSeekToNextFrame(); + }, + () => { + // Reach the end, do nothing. + } + ); + } + + video.addEventListener("ended", function() { + video.seenEnded = true; + drawVideoToInnerHTML(video); + }); +} +</script> +</body> +</html> |