Failed to construct 'URL': Invalid URL

I am trying to compress and resize a video in my vue application, but have run into a few headaches, where I am getting errors I cant quite any documentation on (Error compress video: TypeError: Failed to construct 'URL': Invalid URL).
```

import { FFmpeg } from '@ffmpeg/ffmpeg';
import { fetchFile } from '@ffmpeg/util';

const _ffmpeg = ref(new FFmpeg());

const compressVideo = async (file: File) => {
const fileName = file.name;
const fileData = await fetchFile(file);

await _ffmpeg.value.load();

_ffmpeg.value.writeFile(fileName, fileData);

try {
await _ffmpeg.value.exec([
'-i',
fileName,
'-vf',
'scale=720:-1',
'-b:v',
'1000k',
'-c:v',
'libx264',
'-crf',
'23',
'-preset',
'medium',
'output.mp4',
]);

// Read the compressed file
const data = await _ffmpeg.value.readFile('output.mp4');

// Create a Blob from the compressed file data
const compressedBlob = new Blob([data], { type: 'video/mp4' });

// Optional: Create a downloadable link
const url = URL.createObjectURL(compressedBlob);
const link = document.createElement('a');
link.href = url;
link.download = 'compressed_' + fileName;
link.click();

// Clean up
URL.revokeObjectURL(url);

console.log('Video compressed successfully');
} catch (error) {
console.error('Compression failed:', error);
}
};
```
I am using it like so when the user selects a video file using an input file element:
```

const target = e.target as HTMLInputElement;
const newFile = target.files[0];
try {
const test = await compressVideo(file);
console.log('the resized file', newFile)
} catch (error) {
console.log('Error compress video:', error);
}
```
The error I am getting is: Error compress video: TypeError: Failed to construct 'URL': Invalid URL

What am I doing wrong?