test(mvp1): add owner invariants and media form coverage

apps/admin/src/components/media/media-upload-form.test.tsx

@@ -0,0 +1,84 @@
+/* @vitest-environment jsdom */
+
+import { fireEvent, render, screen, waitFor } from "@testing-library/react"
+import { afterEach, describe, expect, it, vi } from "vitest"
+
+import { MediaUploadForm } from "./media-upload-form"
+
+describe("MediaUploadForm", () => {
+  afterEach(() => {
+    vi.restoreAllMocks()
+  })
+
+  it("updates accepted MIME list based on selected media type", () => {
+    render(<MediaUploadForm />)
+
+    const fileInput = screen.getByLabelText("File") as HTMLInputElement
+    const typeSelect = screen.getByLabelText("Type") as HTMLSelectElement
+
+    expect(fileInput.accept).toContain("image/jpeg")
+
+    fireEvent.change(typeSelect, { target: { value: "video" } })
+
+    expect(fileInput.accept).toContain("video/mp4")
+    expect(fileInput.accept).not.toContain("image/jpeg")
+  })
+
+  it("shows API error message when upload fails", async () => {
+    const fetchMock = vi.spyOn(globalThis, "fetch").mockResolvedValue({
+      ok: false,
+      json: async () => ({ message: "Invalid file type" }),
+    } as Response)
+
+    render(<MediaUploadForm />)
+
+    const form = screen.getByRole("button", { name: "Upload media" }).closest("form")
+
+    if (!form) {
+      throw new Error("Upload form not found")
+    }
+
+    const fileInput = screen.getByLabelText("File") as HTMLInputElement
+    fireEvent.change(fileInput, {
+      target: {
+        files: [new File(["x"], "demo.png", { type: "image/png" })],
+      },
+    })
+
+    fireEvent.submit(form)
+
+    await waitFor(() => {
+      expect(screen.queryByText("Invalid file type")).not.toBeNull()
+    })
+
+    expect(fetchMock).toHaveBeenCalledWith(
+      "/api/media/upload",
+      expect.objectContaining({ method: "POST" }),
+    )
+  })
+
+  it("shows network error message when request throws", async () => {
+    vi.spyOn(globalThis, "fetch").mockRejectedValue(new Error("network down"))
+
+    render(<MediaUploadForm />)
+
+    const form = screen.getByRole("button", { name: "Upload media" }).closest("form")
+
+    if (!form) {
+      throw new Error("Upload form not found")
+    }
+
+    const fileInput = screen.getByLabelText("File") as HTMLInputElement
+    fireEvent.change(fileInput, {
+      target: {
+        files: [new File(["x"], "demo.png", { type: "image/png" })],
+      },
+    })
+
+    fireEvent.submit(form)
+
+    await waitFor(() => {
+      expect(screen.queryByText("Upload request failed. Please retry.")).not.toBeNull()
+    })
+  })
+})