google-chromegoogle-chrome-extensionrecordrtc

Can't get speaker + microphone audio working with chrome.desktopCapture and RecortRTC


I am trying to build a chrome extension that captures a users screen with their speaker audio (computer audio) and their microphone audio. Using the examples from RecordRTC I have pieced the below together, however when I open the recorded .webm file I am unable to hear any sounds at all.

Is there something else I should be doing to get audio?

Below is the code for my background script with some sections removed to make it more clear. When someone clicks the start record button, the startRecording() function is called.

const OPTIONS = {
  type: 'video',
  disableLogs: false,
  mimeType: 'video/webm'
}

const captureUserMedia = callback => {
  chrome.desktopCapture.chooseDesktopMedia(['screen', 'window', 'audio'], chromeMediaSourceId => {
    const options = {
      audio: {
        mandatory: {
          chromeMediaSource: 'desktop',
          chromeMediaSourceId: chromeMediaSourceId,
          echoCancellation: true
        },
        optional: []
      },
      video: {
        mandatory: {
          chromeMediaSource: 'desktop',
          chromeMediaSourceId: chromeMediaSourceId
        },
        optional: []
      }
    };
    navigator.mediaDevices.getUserMedia(options)
      .then(callback)
      .catch(err => new Error(err));
    });
};

const startRecording = () => {
  captureUserMedia(mediaStream => {
    state.recordData = RecordRTC(mediaStream, OPTIONS);
    state.mediaStream = mediaStream;
    state.recordData.startRecording();
  });
}

const stopRecording = () => {
  state.recordData.stopRecording(function(videoURL) {
    chrome.tabs.create({ url: 'show-video.html?video=' + videoURL });
  });
  state.mediaStream.getTracks().forEach(track => track.stop());
}

Solution

  • Apparently this is not a bug and an issue with MacOS itself. Chrome are aware of it but don't seem to have any plans to fix it: bugs.chromium.org/issue/603259