HelpOptionsList.test.tsx80 lines · main

1	import { screen } from '@testing-library/react'
2	import userEvent from '@testing-library/user-event'
3	import { beforeEach, describe, expect, it, vi } from 'vitest'
4
5	import { HelpOptionsList } from './HelpOptionsList'
6	import { DOCS_URL } from '@/lib/constants'
7	import { customRender } from '@/tests/lib/custom-render'
8	import { routerMock } from '@/tests/lib/route-mock'
9
10	const { takeBreadcrumbSnapshotMock } = vi.hoisted(() => ({
11	takeBreadcrumbSnapshotMock: vi.fn(),
12	}))
13
14	vi.mock('react-inlinesvg', () => ({
15	__esModule: true,
16	default: () => null,
17	}))
18
19	vi.mock('@/lib/breadcrumbs', () => ({
20	takeBreadcrumbSnapshot: takeBreadcrumbSnapshotMock,
21	}))
22
23	describe('HelpOptionsList', () => {
24	beforeEach(() => {
25	routerMock.setCurrentUrl('/')
26	takeBreadcrumbSnapshotMock.mockReset()
27	vi.restoreAllMocks()
28	})
29
30	it('navigates to support after invoking the click callback by default', async () => {
31	const onSupportClick = vi.fn()
32
33	customRender(
34	<HelpOptionsList
35	isPlatform
36	projectRef="project-1"
37	supportLinkQueryParams={{ projectRef: 'project-1' }}
38	onSupportClick={onSupportClick}
39	/>
40	)
41
42	await userEvent.click(screen.getByRole('button', { name: /contact support/i }))
43
44	expect(onSupportClick).toHaveBeenCalledTimes(1)
45	expect(takeBreadcrumbSnapshotMock).toHaveBeenCalledTimes(1)
46	expect(routerMock.asPath).toBe('/support/new?projectRef=project-1')
47	})
48
49	it('allows the support callback to suppress navigation', async () => {
50	customRender(
51	<HelpOptionsList
52	isPlatform
53	projectRef="project-1"
54	supportLinkQueryParams={{ projectRef: 'project-1' }}
55	onSupportClick={() => false}
56	/>
57	)
58
59	await userEvent.click(screen.getByRole('button', { name: /contact support/i }))
60
61	expect(takeBreadcrumbSnapshotMock).not.toHaveBeenCalled()
62	expect(routerMock.asPath).toBe('/')
63	})
64
65	it('renders docs as an external link', () => {
66	customRender(
67	<HelpOptionsList
68	isPlatform
69	projectRef="project-1"
70	supportLinkQueryParams={{ projectRef: 'project-1' }}
71	/>
72	)
73
74	const docsOption = screen.getByRole('link', { name: /docs/i })
75
76	expect(docsOption).toHaveAttribute('href', `${DOCS_URL}/`)
77	expect(docsOption).toHaveAttribute('target', '_blank')
78	expect(docsOption).toHaveAttribute('rel', 'noreferrer noopener')
79	})
80	})