MediaStream error obstructs audio recording from microphone

Question

I'm working on an application that involves audio recording from user microphone, using Web Audio API and MediaStream Recording API. When I trigger Start Recording, browser displays access request to microphone and when I allow it, an error returns on the console instead of starting recording.

Error starting recording: TypeError: MediaRecorder constructor: Argument 1 does not implement interface MediaStream.`

  const audioRef = useRef(null);
  const mediaRecorder = useRef(null);
  const audioChunks = useRef([]);



  const startRecording = async () => {
    try {
  
       const userMediaStream = await navigator.mediaDevices.getUserMedia({ audio: true });
       console.log('User Media Stream:', userMediaStream);
  
       const audioContext = new AudioContext();
       const mediaStreamSource = audioContext.createMediaStreamSource(userMediaStream);
       console.log('Media Stream Source:', mediaStreamSource);

       mediaRecorder.current = new MediaRecorder(mediaStreamSource);

       mediaRecorder.current.ondataavailable = (event) => {
          console.log('Data available:', event.data);
          audioChunks.current.push(event.data);
       };
  
       mediaRecorder.current.onstop = () => {
          console.log('Recording stopped');
          const audioBlob = new Blob(audioChunks.current, { type: 'audio/wav' });
  

          // Send recorded audio data to the server
          sendAudioData(audioBlob);
      };

      mediaRecorder.current.start();

      setRecording(true);
      console.log("Recording started");
    } catch (error) {
      console.error('Error starting recording:', error);
    }
  };



  const stopRecording = () => {
    setRecording(false);

    if (mediaRecorder.current && mediaRecorder.current.state === 'recording') {
      mediaRecorder.current.stop();
    }

    console.log("Recording stopped");
 };

I've tried different debugging methods and tested on multiple browser. All browsers return the same error so it's not caused by compatibility issues. Considering error logs, I've figured out that this is the line causes the error:

mediaRecorder.current = new MediaRecorder(mediaStreamSource);

But I'm still stucked up after spending few hours on trying to fix it.