formData: set default filename for Blob to <blob> (#5907)

3 files changed, 30 insertions, 3 deletions

diff --git a/cli/js/web/form_data.ts b/cli/js/web/form_data.ts
index 5fab02553..055694517 100644
--- a/cli/js/web/form_data.ts
+++ b/cli/js/web/form_data.ts
@@ -22,7 +22,7 @@ class FormDataBase {
     if (value instanceof domFile.DomFileImpl) {
       this[dataSymbol].push([name, value]);
     } else if (value instanceof blob.DenoBlob) {
-      const dfile = new domFile.DomFileImpl([value], filename || name, {
+      const dfile = new domFile.DomFileImpl([value], filename || "blob", {
         type: value.type,
       });
       this[dataSymbol].push([name, dfile]);
@@ -96,7 +96,7 @@ class FormDataBase {
           if (value instanceof domFile.DomFileImpl) {
             this[dataSymbol][i][1] = value;
           } else if (value instanceof blob.DenoBlob) {
-            const dfile = new domFile.DomFileImpl([value], filename || name, {
+            const dfile = new domFile.DomFileImpl([value], filename || "blob", {
               type: value.type,
             });
             this[dataSymbol][i][1] = dfile;
@@ -117,7 +117,7 @@ class FormDataBase {
       if (value instanceof domFile.DomFileImpl) {
         this[dataSymbol].push([name, value]);
       } else if (value instanceof blob.DenoBlob) {
-        const dfile = new domFile.DomFileImpl([value], filename || name, {
+        const dfile = new domFile.DomFileImpl([value], filename || "blob", {
           type: value.type,
         });
         this[dataSymbol].push([name, dfile]);
diff --git a/cli/tests/unit/fetch_test.ts b/cli/tests/unit/fetch_test.ts
index 4a4212c0c..2738eba5e 100644
--- a/cli/tests/unit/fetch_test.ts
+++ b/cli/tests/unit/fetch_test.ts
@@ -359,6 +359,24 @@ unitTest(
   }
 );
 
+unitTest(
+  { perms: { net: true } },
+  async function fetchInitFormDataBlobFilenameBody(): Promise<void> {
+    const form = new FormData();
+    form.append("field", "value");
+    form.append("file", new Blob([new TextEncoder().encode("deno")]));
+    const response = await fetch("http://localhost:4545/echo_server", {
+      method: "POST",
+      body: form,
+    });
+    const resultForm = await response.formData();
+    assertEquals(form.get("field"), resultForm.get("field"));
+    const file = resultForm.get("file");
+    assert(file instanceof File);
+    assertEquals(file.name, "blob");
+  }
+);
+
 unitTest({ perms: { net: true } }, async function fetchUserAgent(): Promise<
   void
 > {
diff --git a/cli/tests/unit/form_data_test.ts b/cli/tests/unit/form_data_test.ts
index 5344d8512..f25818eee 100644
--- a/cli/tests/unit/form_data_test.ts
+++ b/cli/tests/unit/form_data_test.ts
@@ -99,6 +99,15 @@ unitTest(function formDataSetEmptyBlobSuccess(): void {
   */
 });
 
+unitTest(function formDataBlobFilename(): void {
+  const formData = new FormData();
+  const content = new TextEncoder().encode("deno");
+  formData.set("a", new Blob([content]));
+  const file = formData.get("a");
+  assert(file instanceof File);
+  assertEquals(file.name, "blob");
+});
+
 unitTest(function formDataParamsForEachSuccess(): void {
   const init = [
     ["a", "54"],