konnosDashboard
ResultCell.test.tsx56 lines · main
1import { fireEvent, screen } from '@testing-library/react'
2import userEvent from '@testing-library/user-event'
3import { expect, test, vi } from 'vitest'
4
5import { ResultCell } from '@/components/interfaces/SQLEditor/UtilityPanel/ResultCell'
6import { customRender as render } from '@/tests/lib/custom-render'
7
8const noop = () => {}
9
10test('renders the formatted cell value', () => {
11 render(<ResultCell column="name" value="alice" onContextMenu={noop} onExpand={noop} />)
12 expect(screen.getByText('alice')).toBeTruthy()
13})
14
15test('renders NULL for null values', () => {
16 render(<ResultCell column="name" value={null} onContextMenu={noop} onExpand={noop} />)
17 expect(screen.getByText('NULL')).toBeTruthy()
18})
19
20test('does not render the expand button for short string values', () => {
21 render(<ResultCell column="name" value="alice" onContextMenu={noop} onExpand={noop} />)
22 expect(screen.queryByRole('button', { name: 'View full cell content' })).toBeNull()
23})
24
25test('renders the expand button for object values', () => {
26 render(<ResultCell column="data" value={{ nested: true }} onContextMenu={noop} onExpand={noop} />)
27 expect(screen.getByRole('button', { name: 'View full cell content' })).toBeTruthy()
28})
29
30test('renders the expand button for long string values', () => {
31 render(<ResultCell column="bio" value={'a'.repeat(120)} onContextMenu={noop} onExpand={noop} />)
32 expect(screen.getByRole('button', { name: 'View full cell content' })).toBeTruthy()
33})
34
35test('clicking the expand button calls onExpand with column and value', async () => {
36 const onExpand = vi.fn()
37 const value = { nested: true }
38 render(<ResultCell column="data" value={value} onContextMenu={noop} onExpand={onExpand} />)
39
40 await userEvent.click(screen.getByRole('button', { name: 'View full cell content' }))
41
42 expect(onExpand).toHaveBeenCalledTimes(1)
43 expect(onExpand).toHaveBeenCalledWith('data', value)
44})
45
46test('right-clicking the cell calls onContextMenu with column and value', () => {
47 const onContextMenu = vi.fn()
48 render(<ResultCell column="name" value="alice" onContextMenu={onContextMenu} onExpand={noop} />)
49
50 fireEvent.contextMenu(screen.getByText('alice'))
51
52 expect(onContextMenu).toHaveBeenCalledTimes(1)
53 const [, column, value] = onContextMenu.mock.calls[0]
54 expect(column).toBe('name')
55 expect(value).toBe('alice')
56})