|
1 | | -import { render, screen, fireEvent } from '@testing-library/react' |
2 | | -import ListPane from './ListPane' |
3 | | -import { describe, it, expect, vi } from 'vitest' |
| 1 | +import { render, screen, fireEvent } from "@testing-library/react"; |
| 2 | +import ListPane from "./ListPane"; |
| 3 | +import { describe, it, expect, vi } from "vitest"; |
4 | 4 |
|
5 | | -describe('ListPane', () => { |
| 5 | +describe("ListPane", () => { |
6 | 6 | const defaultProps = { |
7 | | - items: [{ id: 1, name: 'Item 1' }, { id: 2, name: 'Item 2' }], |
| 7 | + items: [ |
| 8 | + { id: 1, name: "Item 1" }, |
| 9 | + { id: 2, name: "Item 2" }, |
| 10 | + ], |
8 | 11 | listItems: vi.fn(), |
9 | 12 | clearItems: vi.fn(), |
10 | 13 | setSelectedItem: vi.fn(), |
11 | 14 | renderItem: (item: { name: string }) => <span>{item.name}</span>, |
12 | | - title: 'Test List', |
13 | | - buttonText: 'List Items' |
14 | | - } |
15 | | - |
16 | | - it('renders title correctly', () => { |
17 | | - render(<ListPane {...defaultProps} />) |
18 | | - expect(screen.getByText('Test List')).toBeInTheDocument() |
19 | | - }) |
20 | | - |
21 | | - it('renders list items using renderItem prop', () => { |
22 | | - render(<ListPane {...defaultProps} />) |
23 | | - expect(screen.getByText('Item 1')).toBeInTheDocument() |
24 | | - expect(screen.getByText('Item 2')).toBeInTheDocument() |
25 | | - }) |
26 | | - |
27 | | - it('calls listItems when List Items button is clicked', () => { |
28 | | - render(<ListPane {...defaultProps} />) |
29 | | - fireEvent.click(screen.getByText('List Items')) |
30 | | - expect(defaultProps.listItems).toHaveBeenCalledTimes(1) |
31 | | - }) |
32 | | - |
33 | | - it('calls clearItems when Clear button is clicked', () => { |
34 | | - render(<ListPane {...defaultProps} />) |
35 | | - fireEvent.click(screen.getByText('Clear')) |
36 | | - expect(defaultProps.clearItems).toHaveBeenCalledTimes(1) |
37 | | - }) |
38 | | - |
39 | | - it('calls setSelectedItem when an item is clicked', () => { |
40 | | - render(<ListPane {...defaultProps} />) |
41 | | - fireEvent.click(screen.getByText('Item 1')) |
42 | | - expect(defaultProps.setSelectedItem).toHaveBeenCalledWith(defaultProps.items[0]) |
43 | | - }) |
44 | | - |
45 | | - it('disables Clear button when items array is empty', () => { |
46 | | - render(<ListPane {...defaultProps} items={[]} />) |
47 | | - expect(screen.getByText('Clear')).toBeDisabled() |
48 | | - }) |
49 | | - |
50 | | - it('respects isButtonDisabled prop for List Items button', () => { |
51 | | - render(<ListPane {...defaultProps} isButtonDisabled={true} />) |
52 | | - expect(screen.getByText('List Items')).toBeDisabled() |
53 | | - }) |
54 | | -}) |
| 15 | + title: "Test List", |
| 16 | + buttonText: "List Items", |
| 17 | + }; |
| 18 | + |
| 19 | + it("renders title correctly", () => { |
| 20 | + render(<ListPane {...defaultProps} />); |
| 21 | + expect(screen.getByText("Test List")).toBeInTheDocument(); |
| 22 | + }); |
| 23 | + |
| 24 | + it("renders list items using renderItem prop", () => { |
| 25 | + render(<ListPane {...defaultProps} />); |
| 26 | + expect(screen.getByText("Item 1")).toBeInTheDocument(); |
| 27 | + expect(screen.getByText("Item 2")).toBeInTheDocument(); |
| 28 | + }); |
| 29 | + |
| 30 | + it("calls listItems when List Items button is clicked", () => { |
| 31 | + render(<ListPane {...defaultProps} />); |
| 32 | + fireEvent.click(screen.getByText("List Items")); |
| 33 | + expect(defaultProps.listItems).toHaveBeenCalledTimes(1); |
| 34 | + }); |
| 35 | + |
| 36 | + it("calls clearItems when Clear button is clicked", () => { |
| 37 | + render(<ListPane {...defaultProps} />); |
| 38 | + fireEvent.click(screen.getByText("Clear")); |
| 39 | + expect(defaultProps.clearItems).toHaveBeenCalledTimes(1); |
| 40 | + }); |
| 41 | + |
| 42 | + it("calls setSelectedItem when an item is clicked", () => { |
| 43 | + render(<ListPane {...defaultProps} />); |
| 44 | + fireEvent.click(screen.getByText("Item 1")); |
| 45 | + expect(defaultProps.setSelectedItem).toHaveBeenCalledWith( |
| 46 | + defaultProps.items[0], |
| 47 | + ); |
| 48 | + }); |
| 49 | + |
| 50 | + it("disables Clear button when items array is empty", () => { |
| 51 | + render(<ListPane {...defaultProps} items={[]} />); |
| 52 | + expect(screen.getByText("Clear")).toBeDisabled(); |
| 53 | + }); |
| 54 | + |
| 55 | + it("respects isButtonDisabled prop for List Items button", () => { |
| 56 | + render(<ListPane {...defaultProps} isButtonDisabled={true} />); |
| 57 | + expect(screen.getByText("List Items")).toBeDisabled(); |
| 58 | + }); |
| 59 | +}); |
0 commit comments