Page refreshes on POST request

Question

My js code records a voice clip, and then sends it to a local flask server to process it with a fetch POST request, however, the page refreshes both when the clip is sent, and again when it's processed completely, which I dont particularly care for, as it makes debugging among other things much harder.

Here is the function which records the audio:

recordButton.onmousedown = e => {
  
  console.log('Recording...');
  audioChunks = [];
  navigator.mediaDevices.getUserMedia({ audio: true })
      .then(stream => {
          rec = new MediaRecorder(stream);
          rec.ondataavailable = e => {
              audioChunks.push(e.data);
              if (rec.state == "inactive") {
                  let blob = new Blob(audioChunks, { type: 'audio/mpeg-3' });
                  recordedAudio.src = URL.createObjectURL(blob);
                  inputAudio = recordedAudio.src
                  recordedAudio.controls = true;
                  sendData(blob);
              }
          }
          rec.start();
      });
};

And here is the function that sends it:

async function sendData(data) {

    const formData = new FormData();
    
    formData.append('audio', data);
    console.log("audio appended")
    fetch('http://127.0.0.1:5000/upload-audio', {
        method: 'POST',
        body: formData
    })
    .then(response => response.json())
    console.log("audio downloaded")
    .then(data => {
        console.log(data.response);
        // Download audio response file
        
        console.log("audio downloaded")
    })
    .catch(error => {
        console.error('Error:', error);
    });
    
}

Can you please identify what the problem is?

Ive tried using things such as e.prevent default to no success.