Appending Blob To Form Data Throws TypeError: source.on is not a function

Question

I am having a weird issue with appending a blob to FormData. According to the docs( https://developer.mozilla.org/en-US/docs/Web/API/FormData/append ), the append function can either be a String or Blob. My code is as such:

const blobFromSync = (...args) =>
  import('node-fetch').then(({ blobFromSync }) => blobFromSync(...args));

let file_location = '/path/to/video/file.mp4';

const file = await  blobFromSync(file_location);

const chunkSize = 40000;

for (let start = 0; start < file.size; start += chunkSize) {
            const chunk = file.slice(start, start + chunkSize + 1)
            
            const form = new FormData();
           
            form.append('file', chunk, 'an-id');
}

Console logging the chunk shows it a Blob, but it throws this error:

TypeError: source.on is not a function
    at DelayedStream.create (/Users/xxxxxxxxx/Development/terminal-backend/node_modules/delayed-stream/lib/delayed_stream.js:33:10)
    at CombinedStream.append (/Users/xxxxxxx/Development/terminal-backend/node_modules/combined-stream/lib/combined_stream.js:45:37)
    at FormData.append (/Users/xxxxxxxxx/Development/terminal-backend/node_modules/form-data/lib/form_data.js:75:3)
    at /Users/xxxxxxxxxn/Development/terminal-backend/src/server.js:90:18

What am I overlooking here?

Answer 1

The official documentation on MDN is related to WHATWG FormData API standards which says that form.append accepts Blob as the second argument. Beware that it's just a specification (not an implementation).

The implementation that you're using doesn't support Blob as highlighted in this issue. As also mentioned in the doc.

You can, however, create a Buffer out of your Blob using Buffer.from(<blob>) and it should work.

P.S.: Credits to @Kaiido for pointing out the WHATWG specification and finding the github issue.