IntegrationOverviewTab.test.tsx85 lines · main

1	import { screen } from '@testing-library/dom'
2	import { mockAnimationsApi } from 'jsdom-testing-mocks'
3	import { beforeEach, describe, expect, it, vi } from 'vitest'
4
5	import { IntegrationOverviewTab } from './IntegrationOverviewTab'
6	import { customRender } from '@/tests/lib/custom-render'
7	import { routerMock } from '@/tests/lib/route-mock'
8
9	mockAnimationsApi()
10
11	vi.mock('../Landing/Integrations.constants', () => ({
12	INTEGRATIONS: [
13	{
14	id: 'test-integration',
15	name: 'Test Integration',
16	requiredExtensions: ['pg_net'],
17	},
18	],
19	}))
20
21	vi.mock('framer-motion', async (importOriginal) => {
22	const actual = (await importOriginal()) as any
23	return {
24	...actual,
25	motion: {
26	...actual.motion,
27	div: ({ children, ...props }: any) => <div {...props}>{children}</div>,
28	},
29	}
30	})
31
32	const mockExtensions = vi.fn()
33
34	vi.mock('@/data/database-extensions/database-extensions-query', () => ({
35	useDatabaseExtensionsQuery: () => ({ data: mockExtensions() }),
36	}))
37
38	vi.mock('@/hooks/misc/useSelectedProject', () => ({
39	useSelectedProjectQuery: () => ({
40	data: { ref: 'default', connectionString: 'postgres://localhost' },
41	}),
42	useIsOrioleDb: () => false,
43	}))
44
45	vi.mock('common', async (importOriginal) => {
46	const actual = (await importOriginal()) as any
47	return {
48	...actual,
49	useParams: () => ({ id: 'test-integration', ref: 'default' }),
50	}
51	})
52
53	vi.mock('./MarkdownContent', () => ({
54	MarkdownContent: () => null,
55	}))
56
57	describe('IntegrationOverviewTab', () => {
58	beforeEach(() => {
59	routerMock.setCurrentUrl('/project/default/integrations/test-integration/overview')
60	mockExtensions.mockReturnValue([
61	{ name: 'pg_net', installed_version: null, default_version: '0.6.0' },
62	])
63	})
64
65	it('does not disable actions when hideRequiredExtensionsSection is true and extensions are uninstalled', () => {
66	customRender(
67	<IntegrationOverviewTab
68	hideRequiredExtensionsSection
69	actions={<button>Enable webhooks</button>}
70	/>
71	)
72
73	const actionsArea = screen.getByText('Enable webhooks').closest('[aria-disabled]')
74	expect(actionsArea).toHaveAttribute('aria-disabled', 'false')
75	expect(actionsArea).not.toHaveClass('opacity-25')
76	})
77
78	it('disables actions when extensions are uninstalled and hideRequiredExtensionsSection is false', () => {
79	customRender(<IntegrationOverviewTab actions={<button>Enable integration</button>} />)
80
81	const actionsArea = screen.getByText('Enable integration').closest('[aria-disabled]')
82	expect(actionsArea).toHaveAttribute('aria-disabled', 'true')
83	expect(actionsArea).toHaveClass('opacity-25')
84	})
85	})