JSFiddle - React, Tailwind, and code Playground

HTML

<a id='download' download>download</a><br>

<video id='video' autoplay controls playsinline>

JavaScript

let blobs = [];
let blob;
navigator.mediaDevices.getUserMedia({ audio: true, video: true}).then(s => {
    const recorder = new MediaRecorder(s);
    recorder.start(1000);
    recorder.ondataavailable = (e) => {
       console.log("data");
       console.log(e.data);
       blobs.push(e.data);
    };
    setTimeout(() => {
       recorder.stop();
    }, 10000);
    recorder.onstop = () => {
        console.log("stop");
    		blob = new Blob(blobs, {type: recorder.mimeType});
        console.log(blob);
        const url = URL.createObjectURL(blob);
        video.src = url;
        download.href = url;
    };
});