File size: 2,321 Bytes
10d1fd4
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
import { MantineProvider } from "@mantine/core";
import { render, screen, waitFor } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import SearchForm from "@/components/Search/Form/SearchForm";

vi.mock("create-pubsub/react", () => ({
  usePubSub: vi.fn((pubSub: unknown) => {
    if (!Array.isArray(pubSub)) {
      return [undefined, vi.fn()];
    }

    const maybeFactory = pubSub[2];
    if (typeof maybeFactory !== "function") {
      return [undefined, vi.fn()];
    }

    return [maybeFactory() ?? undefined, vi.fn()];
  }),
}));

vi.mock("wouter", () => ({
  useLocation: vi.fn(() => ["/", vi.fn()]),
}));

vi.mock("../../../hooks/useSearchHistory", () => ({
  useSearchHistory: vi.fn(() => ({
    addToHistory: vi.fn(),
  })),
}));

vi.mock("../../../hooks/useHistoryRestore", () => ({
  useHistoryRestore: vi.fn(() => ({
    restoreSearch: vi.fn(),
  })),
}));

vi.mock("../History/HistoryButton", () => ({
  default: function HistoryButton() {
    return null;
  },
}));

vi.mock("../../../modules/textGeneration", () => ({
  searchAndRespond: vi.fn(),
}));

vi.mock("../../../modules/querySuggestions", () => ({
  getRandomQuerySuggestion: vi.fn(async () => "Anything you need!"),
}));

const renderSearchForm = (
  query: string,
  updateQuery: (query: string) => void,
) => {
  return render(
    <MantineProvider>
      <SearchForm query={query} updateQuery={updateQuery} />
    </MantineProvider>,
  );
};

const waitForPlaceholder = async () => {
  const textarea = await screen.findByRole("textbox");
  await waitFor(() => {
    expect(textarea).toHaveAttribute("placeholder", "Anything you need!");
  });
  return textarea;
};

describe("SearchForm component", () => {
  it("renders textarea with placeholder when empty", async () => {
    const mockUpdate = vi.fn();
    renderSearchForm("", mockUpdate);
    await waitForPlaceholder();
  });

  it("calls updateQuery on submit", async () => {
    const mockUpdate = vi.fn();
    const user = userEvent.setup();
    renderSearchForm("", mockUpdate);

    const textarea = await waitForPlaceholder();
    await user.type(textarea, "test query");
    const button = screen.getByRole("button", { name: /search/i });
    await user.click(button);

    expect(mockUpdate).toHaveBeenCalledWith("test query");
  });
});