1891117.html (1543B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <script> 4 function createFrame(width, height, timestamp) { 5 let duration = 33333; // 30fps 6 let cnv = new OffscreenCanvas(width, height); 7 let ctx = cnv.getContext("2d"); 8 ctx.fillStyle = "#FF0000"; 9 ctx.fillRect(0, 0, width, height); 10 return new VideoFrame(cnv, { timestamp, duration }); 11 } 12 13 document.addEventListener("DOMContentLoaded", async () => { 14 let encoderCallbacks = { error: (e) => {} }; 15 let gotEncoderOutput = new Promise(resolve => { 16 encoderCallbacks.output = (chunk, metadata) => { 17 resolve([metadata.decoderConfig, chunk]); 18 } 19 }); 20 const encoder = new VideoEncoder({ 21 output: encoderCallbacks.output, 22 error: encoderCallbacks.error, 23 }); 24 encoder.configure({ 25 codec: "vp8", 26 width: 640, 27 height: 480, 28 displayWidth: 640, 29 displayHeight: 480, 30 }); 31 encoder.encode(createFrame(640, 480, 0)); 32 let [decoderConfig, chunk] = await gotEncoderOutput; 33 34 let decoderCallbacks = { error: (e) => {} }; 35 let gotDecoderOutput = new Promise(resolve => { 36 decoderCallbacks.output = (frame) => { 37 frame.close(); 38 resolve(); 39 } 40 }); 41 42 const decoder = new VideoDecoder({ 43 output: decoderCallbacks.output, 44 error: decoderCallbacks.error, 45 }); 46 decoder.configure({ ...decoderConfig, optimizeForLatency: true }); 47 decoder.decode(chunk); 48 decoder.configure({ 49 codec: "᩿", 50 width: 2147483648, 51 height: 60, 52 }); 53 54 await gotDecoderOutput; 55 document.documentElement.removeAttribute("class"); 56 }); 57 </script> 58 </html>