A FormData polyfill
npm install formdata-polyfill
This doesn't monkey patch xhr#send like Rob--W did here. However this provides you a way to convert the entire form to a blob and send it with xhr or fetch.
fd = new FormData(form)
xhr.send(fd._blob())
xhr.send(fd) // This don't work... Needs to be a native FormData
Another possible solution is to convert the form to a native FormData but then you would lose all the other methods not supported by the original FormData.
fd = new FormData(form)
fd._asNative() // returns a native formData with all the fields
If you wish to monkey patch XHR to make it work out of the box then you have to do it yourself
import FormData from 'formdata-polyfill'
XMLHttpRequest = class extends XMLHttpRequest {
send(data) {
super.send(data instanceof FormData ? data._blob() : data)
}
}
The current status of the native FormData is this
This lib provides you all the function others don't include
append
with filenamedelete()
,get()
,getAll()
,has()
,set()
entries()
,keys()
,values()
, and support offor...of
- Available in web workers (yes, just include it...)
The reason why Rob--W's version didn't work for me was that it only works in web workers due to FileReaderSync beeing used. I did it with constructing new chunks with the blob constructor instead.
new Blob([string, blob, file, etc])