Download Functionality Failing with "Internet Connection Error"

[Brielle28]

Bug Report: Download Functionality Not Working (Internet Connection Error)

Description:

I am facing an issue with the download functionality in the application. When I try to download a recording, I receive an "internet connection error" in the download history, and the download does not proceed as expected.

Steps to Reproduce:

1. Download Function:
   Here’s the downloadRecording function that I am using to handle the download:

   const downloadRecording = (recordingUrl, fileName) => {
       const a = document.createElement("a");
       a.href = recordingUrl;
       a.download = `${fileName}.mp3`; // Use the provided file name
       a.click(); // Trigger the download
   };

2. Using the Download Function:
   In the component where the user can download a recording, I’m using the following code to find the selected recording and call the downloadRecording function:

   const { downloadRecording, recordings } = useContext(UserContext);
   
   const selectedRecording = recordings.find(
       (recording) => recording.id === audioId
   );
   
   action.icon === "Download" ? (
       <div
           onClick={() => {
               // Only download if a specific recording is found
               if (selectedRecording) {
                   console.log("Downloading:", {
                       url: selectedRecording.url,
                       name: selectedRecording.name,
                   });
                   downloadRecording(
                       selectedRecording.url,
                       selectedRecording.name
                   );
               } else {
                   console.error("No recording found for ID:", audioId);
                   alert("Recording not found. Please try again.");
               }
           }}
           style={{ cursor: "pointer" }}
       >
           {Content}
       </div>
   );

Expected Behavior:

The recording should download successfully when the "Download" option is clicked, with the file being saved as fileName.mp3.

Actual Behavior:

The download fails with an "internet connection error" message in the download history, and the download does not proceed.

Troubleshooting Steps Taken:

1. I’ve logged the selectedRecording.url and selectedRecording.name to verify that the correct values are being passed to the downloadRecording function.
2. The file does not download, and the error message appears, which suggests there may be an issue with how the blob URL is being handled.