Skip to content

Commit

Permalink
fixed issue with video recording mimeType
Browse files Browse the repository at this point in the history
  • Loading branch information
TobiasDuelli committed Jul 30, 2024
1 parent d2d3bb7 commit 44bdc89
Showing 1 changed file with 24 additions and 9 deletions.
33 changes: 24 additions & 9 deletions src/GleapScreenRecorder.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,12 +27,25 @@ export class GleapScreenRecorder {
}

getSupportedMimeType() {
if (MediaRecorder.isTypeSupported("video/mp4")) {
return "video/mp4";
}
if (MediaRecorder.isTypeSupported("video/webm;codecs=h264")) {
return "video/webm;codecs=h264";
// List of MIME types in order of preference
const types = [
"video/webm",
"audio/webm",
"video/webm;codecs=vp8",
"video/webm;codecs=daala",
"video/webm;codecs=h264",
"audio/webm;codecs=opus",
"video/mp4",
];

// Iterate through the list and return the first supported type
for (const type of types) {
if (MediaRecorder.isTypeSupported(type)) {
return type;
}
}

// If no types are supported, return a default or handle as needed
return "video/webm";
}

Expand Down Expand Up @@ -64,7 +77,7 @@ export class GleapScreenRecorder {
displaySurface: "monitor",
},
selfBrowserSurface: "include",
audio: true
audio: true,
})
.then(function (displayStream) {
self.stream = displayStream;
Expand Down Expand Up @@ -184,7 +197,7 @@ export class GleapScreenRecorder {

var recordedChunks = [];
this.mediaRecorder = new MediaRecorder(stream, {
mimeType: this.getSupportedMimeType()
mimeType: this.getSupportedMimeType(),
});
this.isRecording = true;
this.recordTime = 0;
Expand Down Expand Up @@ -226,8 +239,10 @@ export class GleapScreenRecorder {
type: this.getSupportedMimeType(),
});

this.file = new File([completeBlob], `screen-recording.${this.getSupportedMimeType() === "video/mp4" ? 'mp4' : "webm"}`, {
type: this.getSupportedMimeType(),
const mimeType = this.getSupportedMimeType();
const extension = mimeType.includes("mp4") ? "mp4" : "webm";
this.file = new File([completeBlob], `screen-recording.${extension}`, {
type: mimeType,
});

const previewVideoElement = document.querySelector(
Expand Down

0 comments on commit 44bdc89

Please sign in to comment.