fixed issue with audio on screen recording

[TobiasDuelli]

No description provided.

[Copilot]

Pull Request Overview

This PR addresses audio recording issues in screen capture functionality by implementing a more robust audio handling system. The changes ensure audio tracks are properly captured and composed with video streams, fixing problems where audio was not being included in screen recordings.

• Refactored audio handling to use separate streams for display and microphone capture
• Added comprehensive MIME type support with audio codec preferences
• Introduced proper error handling and resource cleanup for all media streams

Reviewed Changes

Copilot reviewed 2 out of 12 changed files in this pull request and generated 4 comments.

File	Description
src/GleapScreenRecorder.js	Major refactoring to fix audio capture by separating display and microphone streams, adding constants, improving error handling, and modernizing syntax
demo/main.js	Configuration changes to commented out development URLs and updated API key

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[Copilot]

[nitpick] Consider using a for...of loop or forEach for better readability: for (const audioTrack of audioTracks) or audioTracks.forEach(audioTrack => { ... })

Suggested change

	for (let i = 0; i < audioTracks.length; i++) {
	const audioTrack = audioTracks[i];
	for (const audioTrack of audioTracks) {

[Copilot]

The MediaRecorder constructor could throw an exception if the MIME type is not supported. Consider wrapping in a try-catch block and providing a fallback MIME type or meaningful error message.

Suggested change

	this.mediaRecorder = new MediaRecorder(stream, {
	mimeType: this.getSupportedMimeType(),
	});
	try {
	this.mediaRecorder = new MediaRecorder(stream, {
	mimeType: this.getSupportedMimeType(),
	});
	} catch (e) {
	// Fallback: try without mimeType or with a common one
	try {
	this.mediaRecorder = new MediaRecorder(stream);
	} catch (fallbackError) {
	// Optionally, try a very common mimeType
	try {
	this.mediaRecorder = new MediaRecorder(stream, {
	mimeType: "video/webm",
	});
	} catch (finalError) {
	// If all attempts fail, show a meaningful error and abort
	alert("Screen recording is not supported in this browser or configuration.");
	this.isRecording = false;
	return;
	}
	}
	}

[Copilot]

[nitpick] This ternary expression is unnecessarily complex. Consider simplifying to: this.audioAvailable = this.stream?.getAudioTracks().length > 0 ?? this.audioAvailable; or use a clearer if-else structure.

Suggested change

	this.audioAvailable = this.stream
	? this.stream.getAudioTracks().length > 0
	: this.audioAvailable;
	this.audioAvailable = this.stream?.getAudioTracks().length > 0 ?? this.audioAvailable;

[Copilot]

Empty catch blocks should be avoided or at least include a comment explaining why the error is being ignored. Consider logging the error for debugging purposes.

Suggested change

	} catch (_) {}
	} catch (error) {
	// Log the error for debugging purposes; stopping may fail if already stopped or in an invalid state.
	console.error("Error stopping mediaRecorder:", error);
	}