Quicktime - The document "video.mov Could Not be Opened

Question

I am working on a program that allows you to screen record a screen after clicking a button. Once the recording is finished, a user is able to download the video by clicking another button. When attempting to open the video with Quicktime Player, it appears that it is unable to be opened. Here is the main.js snippet that shows how the blob is created, as well as the blob console logged out.

function handleDataAvailable (e) {
    chunks.push(e.data);
}

function handleStop (e) {
const blob = new Blob(chunks, { 'type' : 'video/mp4' });
chunks = [];

downloadButton.href = URL.createObjectURL(blob);
downloadButton.download = 'video.mp4';
downloadButton.disabled = false;

recordedVideo.src = URL.createObjectURL(blob);
recordedVideo.load();
recordedVideo.onloadeddata = function() {
    const rc = document.querySelector(".recorded-video-wrap");
    rc.classList.remove("hidden");
    rc.scrollIntoView({ behavior: "smooth", block: "start" });

    recordedVideo.play();
}

stream.getTracks().forEach((track) => track.stop());
audio.getTracks().forEach((track) => track.stop());

console.log('Recording stopped');
}

Warning from Quicktime

Blob log