Can not record audio

[mbellezi]

If I check "Record Selected Tab only" is the only way to record audio but I can not hear it while recording. Is there a way to listen and record? There is no "Tab capture API" option. Please help!

[nuthinking]

I would love to know if there is a solution for recording audio while playing it too. Thanks!

[muaz-khan]

Please install chrome extension and select "Full Screen + System Audio". (it will be using desktopCapture instead)

PS. tabCapture mutes audios; and we didn't found any fix/hack yet. That's why desktopCaptue can be a good alternative.

[muaz-khan]

Solution for tabCapture API:

Create an HTML5 audio element, set source (i.e. SRC) based on tabCapture stream, and play the audio element during recording. Snippet:

function hackForTabCaptureStream(tabStream) {
    var audio = document.createElement('audio');
    audio.muted = false; // MUST NOT be MUTED
    audio.volume = 1; // MUST be full volume
    audio.src = URL.createObjectURL(tabStream);
    audio.play(); // MUST be playing during recording
}

Fixed #288 as well.

[michaelsmoody]

Good afternoon,

This still seems to be a present issue in the current May 2020 release on the extension web store. Or do I need to continue using the https://github.com/muaz-khan/RecordRTC/issues/297#issuecomment-316267459 recommendation?

Michael

[uffou]

You can create a new audio stream and combine both streams like so

let stream
if (navigator.mediaDevices.getDisplayMedia) {
    stream = await navigator.mediaDevices.getDisplayMedia(displaymediastreamconstraints).catch((event) => {
        console.error(event)
        // store.error = 'Permission denied!'
    })
} else {
    stream = await navigator.getDisplayMedia(displaymediastreamconstraints).catch((event) => {
        console.error(event)
        // store.error = 'Permission denied!'
    })
}

const [videoTrack] = stream.getVideoTracks()
const audioStream = await navigator.mediaDevices.getUserMedia({ audio: true }).catch((event) => {
    throw event
})
const [audioTrack] = audioStream.getAudioTracks()
// displayStream.addTrack(audioTrack); // do stuff
// or
store.stream = new MediaStream([videoTrack, audioTrack]) // do stuff
store.recorder = new RecordRTCPromisesHandler(store.stream, {
    // audio, video, canvas, gif
    type: 'video',
})