Switch to fetch from axios broke File/Blob uploads

[klarose]

Bug

webdav-client uploads {} instead of actual File contents when presented with a File object.

Reproduction

Either create a Blob by hand, or use a Form to grab a file from disk, then pass that object as the data parameter to putFileContents.

Discussion

A project I'm working on is using a fork of ngx-filemanager for interacting with webdav servers as a client. This is a web-based package. When you choose to upload a file, it basically defines a local Form, takes the resulting File object, and passes it to webdav-client.client.putFileContents. With pre-5.X verions of webdav-client this was fine. However, with newer versions, it has started doing a PUT of {} to the server.

I dug in to this and it looks like requestDataToFetchBody is to blame. In particular, it maps the input data to a fetch-appropriate body based on the type of the object. Its fall through case is to translate the object to a JSON string. You can see how this behaves by just doing this in a browser console:

let foo = new File([1, 2, 3], 'foobar')
undefined
JSON.stringify(foo)
'{}'

Workaround

Use Blob.arrayBuffer() to translate the file contents into something that works. Big downside is that large files can exhaust the browser's memory.

Desired Behaviour

Stream the contents to the server by accepting the File object as-is.

I think that if this package could just recognise File or Blob-like objects, and pass them as-is as the body, it'd be great. The current workaround has big performance implications. Fetch can naturally stream File/Blob objects, so if we just passed them in as-is, it should work.