Uploads failing with "MissingFile: No files were uploaded" error.

[zazz-ops]

Link to reproduction

No response

Describe the Bug

I'm attempting to upload files via the RESTful API from within my mocha tests and no matter how I configure the fetch request to the create (POST) endpoint of my media collection I get the same error: MissingFile: No files were uploaded.

However I am very much providing the file in accordance with the "instructions" from the docs here and from what I can glean from the tutorial here.

To Reproduce

Here's what my test looks like in mocha:

Here's what the console.log results are when I log the file and formData:

And here's the result I get no matter what Content-Type I provide, no matter whether I use a Blob or a Buffer or format the body (called data in my nova sugar wrapper) to be formData:

How do I upload a file using the REST api in node.js/TypeScript?

I have to say, the more I use Payload the less I like it. The documentation is severely lacking and is wasting an enormous amount of my time to evaluate even the simplest of CMS functionalities, and the error-handling is Mickey Mouse at best. When can we expect Payload to be production-ready?

Payload Version

2.8.1

Adapters and Plugins

No response

[zazz-ops]

I found the "solution" to this ... similar to uploading in the browser, you need to explicitly remove the Content-Type header from you request before sending it.

This is contrary to what is stated in the docs:

Seems like the docs need to be corrected to state that a Content-Type multipart/form-data header should not be included in your request at all.

Additionally, Payload's error messaging needs to be greatly improved. The error message "No files were uploaded" is uselessly vague. Especially considering that the issue had nothing to the do with the file being uploaded.

[iamacup]

in case anyone else comes across this - here is code i used to upload files to payload when you also have values on the collection that you need to be recorded - not just the file.

    const form = new FormData();
    const file = Bun.file(filePath);
    form.append("file", file);

    // OK so this is an undocumented feature i found after i pulled all my hair out
    // the below commented out assignments of the form.append for all values in the
    // body data works apart from for complex objects which just completely fuck up
    // so hopefully this carries on working i guess?
    form.append("_payload", JSON.stringify(bodyData));

    // Object.keys(bodyData).forEach((key) => {
    //   if (typeof bodyData[key] === "object" && bodyData[key] !== null) {
    //     form.append(key, JSON.stringify(bodyData[key]));
    //   } else {
    //     form.append(key, bodyData[key]);
    //   }
    // });

    const options = {
      method: "POST",
      body: form,
      headers: {
        Authorization: `JWT ${await getAuthToken()}`,
      },
    };

    const response = await fetch(url, options);