-
Notifications
You must be signed in to change notification settings - Fork 1
/
CategorySelector.test.tsx
38 lines (35 loc) · 1.15 KB
/
CategorySelector.test.tsx
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
import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import React from "react";
import { QuizStore } from "../store/quiz";
import { QuizContext } from "../store/QuizProvider";
import CategorySelector from "./CategorySelector";
const categories = [
{ id: 1, name: "Wombats" },
{ id: 2, name: "Aardvarks" },
];
test("renders the correct number of options", () => {
const mockStore = { categoryId: 1 };
render(
<QuizContext.Provider value={mockStore as QuizStore}>
<CategorySelector categories={categories} />
</QuizContext.Provider>
);
const categorySelector = screen.getByRole("combobox", {
name: /choose a trivia category/i,
});
expect(categorySelector).toHaveLength(categories.length);
});
test("updates categoryId in store", () => {
const mockStore = { categoryId: 0 };
render(
<QuizContext.Provider value={mockStore as QuizStore}>
<CategorySelector categories={categories} />
</QuizContext.Provider>
);
userEvent.selectOptions(
screen.getByRole("combobox", { name: /choose a trivia category/i }),
"2"
);
expect(mockStore.categoryId).toBe(2);
});