add tests for recent upload fixes (#3143)

* 18f876b
* 80ddf35

test/e2e/tests/uploads.spec.js

@@ -209,3 +209,84 @@ test("issue 3115 - cancelled upload is not re-added", async ({ page }) => {
   // we should see one uploaded file in the list
   await expect(page.locator("ul li")).toHaveCount(1);
 });
+
+test("submitting invalid form multiple times doesn't crash", async ({ page }) => {
+  // https://github.com/phoenixframework/phoenix_live_view/pull/3133#issuecomment-1962439904
+  await page.goto("/upload");
+  await syncLV(page);
+
+  const logs = [];
+  page.on("console", (e) => logs.push(e.text()));
+
+  await page.locator("#upload-form input").setInputFiles([
+    {
+      name: "file.txt",
+      mimeType: "text/plain",
+      buffer: Buffer.from("this is a test")
+    },
+    {
+      name: "file.md",
+      mimeType: "text/markdown",
+      buffer: Buffer.from("## this is a markdown file")
+    },
+    {
+      name: "file2.md",
+      mimeType: "text/markdown",
+      buffer: Buffer.from("## this is another markdown file")
+    }
+  ]);
+  await syncLV(page);
+  await page.getByRole("button", { name: "Upload" }).click();
+  await page.getByRole("button", { name: "Upload" }).click();
+  await syncLV(page);
+
+  await expect(logs).not.toEqual(expect.arrayContaining([expect.stringMatching("view crashed")]));
+  await expect(page.locator(".alert")).toContainText("You have selected too many files");
+});
+
+test("auto upload - can submit files after fixing too many files error", async ({ page }) => {
+  // https://github.com/phoenixframework/phoenix_live_view/commit/80ddf356faaded097358a784c2515c50c345713e
+  await page.goto("/upload?auto_upload=1");
+  await syncLV(page);
+
+  const logs = [];
+  page.on("console", (e) => logs.push(e.text()));
+
+  await page.locator("#upload-form input").setInputFiles([
+    {
+      name: "file.txt",
+      mimeType: "text/plain",
+      buffer: Buffer.from("this is a test")
+    },
+    {
+      name: "file.md",
+      mimeType: "text/markdown",
+      buffer: Buffer.from("## this is a markdown file")
+    },
+    {
+      name: "file2.md",
+      mimeType: "text/markdown",
+      buffer: Buffer.from("## this is another markdown file")
+    }
+  ]);
+  // before the fix, this already failed because the phx-change-loading class was not removed
+  // because undoRefs failed
+  await syncLV(page);
+  await expect(logs).not.toEqual(
+    expect.arrayContaining([
+      expect.stringMatching("no preflight upload response returned with ref")
+    ])
+  );
+
+  // too many files
+  await expect(page.locator("ul li")).toHaveCount(0);
+  await expect(page.locator(".alert")).toContainText("You have selected too many files");
+  // now remove the file that caused the error
+  await page.locator('article').filter({ hasText: "file2.md" }).getByLabel("cancel").click();
+  // now we can upload the files
+  await page.getByRole("button", { name: "Upload" }).click();
+  await syncLV(page);
+
+  await expect(page.locator(".alert")).not.toBeVisible();
+  await expect(page.locator("ul li")).toHaveCount(2);
+});