File size: 2,238 Bytes
6a7089a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
import { render, screen, waitFor } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { beforeEach, describe, expect, it, vi } from "vitest";
import CreateProfileModal from "./CreateProfileModal";

vi.mock("../../services/api", () => ({
  createProfile: vi.fn(),
}));

describe("CreateProfileModal", () => {
  beforeEach(() => {
    vi.clearAllMocks();
  });

  it("submits the local form and returns the created profile key", async () => {
    const { createProfile } = await import("../../services/api");
    const onClose = vi.fn();
    const onCreated = vi.fn();

    vi.mocked(createProfile).mockResolvedValue({
      status: "ok",
      id: "prof_work",
      name: "work",
    });

    render(
      <CreateProfileModal
        open={true}
        onClose={onClose}
        onCreated={onCreated}
      />,
    );

    await userEvent.type(
      screen.getByPlaceholderText("e.g. personal, work, scraping"),
      "work",
    );
    await userEvent.type(
      screen.getByPlaceholderText(
        "e.g. I need to access Gmail for the team account",
      ),
      "Team account access",
    );

    await userEvent.click(screen.getByRole("button", { name: "Create" }));

    await waitFor(() => {
      expect(createProfile).toHaveBeenCalledWith({
        name: "work",
        useWhen: "Team account access",
      });
    });
    expect(onClose).toHaveBeenCalledTimes(1);
    expect(onCreated).toHaveBeenCalledWith("prof_work");
  });

  it("resets its local fields when closed and reopened", async () => {
    const { rerender } = render(
      <CreateProfileModal
        open={true}
        onClose={() => {}}
        onCreated={() => {}}
      />,
    );

    const nameInput = screen.getByPlaceholderText(
      "e.g. personal, work, scraping",
    );
    await userEvent.type(nameInput, "scratch");

    rerender(
      <CreateProfileModal
        open={false}
        onClose={() => {}}
        onCreated={() => {}}
      />,
    );

    rerender(
      <CreateProfileModal
        open={true}
        onClose={() => {}}
        onCreated={() => {}}
      />,
    );

    expect(
      screen.getByPlaceholderText("e.g. personal, work, scraping"),
    ).toHaveValue("");
  });
});