Skip to content

Commit e409516

Browse files
stif59100stif59100
committed
fix(web-hosting): fix tests
ref: #PUWEBPT-86 Signed-off-by: stif59100 <[email protected]>
1 parent c21b713 commit e409516

34 files changed

+1113
-283
lines changed

‎packages/manager/apps/web-hosting/src/components/badgeStatus/BadgeStatus.spec.tsx‎

Lines changed: 33 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,46 @@
1+
import React, { ComponentType } from 'react';
2+
3+
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
4+
import { render, screen } from '@testing-library/react';
5+
import { I18nextProvider } from 'react-i18next';
16
import { describe, expect, it, vi } from 'vitest';
27

38
import { BADGE_COLOR } from '@ovh-ux/muk';
49

510
import { DnsStatus, GitStatus, ServiceStatus } from '@/data/types/status';
6-
import { render, screen } from '@/utils/test.provider';
11+
import { createWrapper, i18n } from '@/utils/test.provider';
712

813
import { BadgeStatus } from '../badgeStatus/BadgeStatus.component';
914

15+
const testQueryClient = new QueryClient({
16+
defaultOptions: {
17+
mutations: {
18+
retry: false,
19+
},
20+
queries: {
21+
retry: false,
22+
},
23+
},
24+
});
25+
26+
const RouterWrapper = createWrapper();
27+
28+
const Wrappers = ({ children }: { children: React.ReactElement }) => {
29+
return (
30+
<RouterWrapper>
31+
<QueryClientProvider client={testQueryClient}>
32+
<I18nextProvider i18n={i18n}>{children}</I18nextProvider>
33+
</QueryClientProvider>
34+
</RouterWrapper>
35+
);
36+
};
37+
1038
describe('BadgeStatus component', () => {
1139
it('should open the href in a new tab when clicked', () => {
1240
const openSpy = vi.spyOn(window, 'open').mockImplementation((): Window | null => null);
13-
render(<BadgeStatus itemStatus={DnsStatus.CONFIGURED} href="https://example.com" />);
41+
render(<BadgeStatus itemStatus={DnsStatus.CONFIGURED} href="https://example.com" />, {
42+
wrapper: Wrappers as ComponentType,
43+
});
1444
const component = screen.getByTestId('badge-status-DNS_CONFIGURED');
1545
component.click();
1646
expect(openSpy).toHaveBeenCalledWith('https://example.com', '_blank');
@@ -30,7 +60,7 @@ describe('BadgeStatus component', () => {
3060
];
3161

3262
testCases.forEach(({ status, color }) => {
33-
render(<BadgeStatus itemStatus={status} />);
63+
render(<BadgeStatus itemStatus={status} />, { wrapper: Wrappers as ComponentType });
3464
const badge = screen.getByTestId(`badge-status-${status}`);
3565
expect(badge).toHaveAttribute('color', color);
3666
});

‎packages/manager/apps/web-hosting/src/components/tabsPanel/TabsPanel.spec.tsx‎

Lines changed: 11 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -26,14 +26,14 @@ const tabs = [
2626
];
2727

2828
describe('TabsPanel component', () => {
29-
it('should render correctly with first tab active', () => {
29+
it('should render correctly with first tab active', async () => {
3030
vi.mocked(useLocation).mockReturnValue({
3131
pathname: '/1',
3232
search: '',
3333
hash: '',
3434
key: '',
35-
state: '',
36-
});
35+
state: null,
36+
} as ReturnType<typeof useLocation>);
3737

3838
const { getByText, container } = render(<TabsPanel tabs={tabs} />);
3939

@@ -42,11 +42,10 @@ describe('TabsPanel component', () => {
4242
const link1 = getByText('1');
4343
const link2 = getByText('2');
4444

45-
return waitFor(() => {
46-
expect(link1).toHaveAttribute('is-selected', 'true');
47-
}).then(() => {
48-
expect(link2).toHaveAttribute('is-selected', 'false');
45+
await waitFor(() => {
46+
expect(link1).toHaveAttribute('aria-selected', 'true');
4947
});
48+
expect(link2).toHaveAttribute('aria-selected', 'false');
5049
});
5150

5251
it('should render correctly with second tab active', async () => {
@@ -55,8 +54,8 @@ describe('TabsPanel component', () => {
5554
search: '',
5655
hash: '',
5756
key: '',
58-
state: '',
59-
});
57+
state: null,
58+
} as ReturnType<typeof useLocation>);
6059

6160
const { getByText, container } = render(<TabsPanel tabs={tabs} />);
6261

@@ -65,10 +64,9 @@ describe('TabsPanel component', () => {
6564
const link1 = getByText('1');
6665
const link2 = getByText('2');
6766

68-
return waitFor(() => {
69-
expect(link1).toHaveAttribute('is-selected', 'false');
70-
}).then(() => {
71-
expect(link2).toHaveAttribute('is-selected', 'true');
67+
await waitFor(() => {
68+
expect(link2).toHaveAttribute('aria-selected', 'true');
7269
});
70+
expect(link1).toHaveAttribute('aria-selected', 'false');
7371
});
7472
});

‎packages/manager/apps/web-hosting/src/components/topBar/TopBar.spec.tsx‎

Lines changed: 28 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,40 @@
1-
import React from 'react';
1+
import React, { ComponentType } from 'react';
22

33
import '@testing-library/jest-dom';
4+
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
45
import { render, screen } from '@testing-library/react';
6+
import { I18nextProvider } from 'react-i18next';
57
import { describe, it } from 'vitest';
68

79
import Topbar from '@/components/topBar/TopBar.component';
8-
import { wrapper } from '@/utils/test.provider';
10+
import { createWrapper, i18n } from '@/utils/test.provider';
11+
12+
const testQueryClient = new QueryClient({
13+
defaultOptions: {
14+
mutations: {
15+
retry: false,
16+
},
17+
queries: {
18+
retry: false,
19+
},
20+
},
21+
});
22+
23+
const RouterWrapper = createWrapper();
24+
25+
const Wrappers = ({ children }: { children: React.ReactElement }) => {
26+
return (
27+
<RouterWrapper>
28+
<QueryClientProvider client={testQueryClient}>
29+
<I18nextProvider i18n={i18n}>{children}</I18nextProvider>
30+
</QueryClientProvider>
31+
</RouterWrapper>
32+
);
33+
};
934

1035
describe('Topbar component', () => {
1136
it('should display Topbar component', () => {
12-
render(<Topbar />, { wrapper });
37+
render(<Topbar />, { wrapper: Wrappers as ComponentType });
1338
const orderSsl = screen.getByTestId('order-ssl');
1439
const importrSsl = screen.getByTestId('import-ssl');
1540
expect(orderSsl).toBeInTheDocument();

‎packages/manager/apps/web-hosting/src/hooks/localSeo/useDatagridColumn.spec.tsx‎

Lines changed: 32 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,42 @@
1+
import React, { ComponentType } from 'react';
2+
3+
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
14
import { renderHook } from '@testing-library/react';
5+
import { I18nextProvider } from 'react-i18next';
26
import { describe, it } from 'vitest';
37

8+
import { createWrapper, i18n } from '@/utils/test.provider';
9+
410
import useDatagridColumn from './useDatagridColumn';
511

12+
const testQueryClient = new QueryClient({
13+
defaultOptions: {
14+
mutations: {
15+
retry: false,
16+
},
17+
queries: {
18+
retry: false,
19+
},
20+
},
21+
});
22+
23+
const RouterWrapper = createWrapper();
24+
25+
const Wrappers = ({ children }: { children: React.ReactElement }) => {
26+
return (
27+
<RouterWrapper>
28+
<QueryClientProvider client={testQueryClient}>
29+
<I18nextProvider i18n={i18n}>{children}</I18nextProvider>
30+
</QueryClientProvider>
31+
</RouterWrapper>
32+
);
33+
};
34+
635
describe('useDatagridColumn', () => {
736
it('should return correct columns', () => {
8-
const { result } = renderHook(() => useDatagridColumn());
37+
const { result } = renderHook(() => useDatagridColumn(), {
38+
wrapper: Wrappers as ComponentType,
39+
});
940

1041
const columns = result.current;
1142

‎packages/manager/apps/web-hosting/src/hooks/ssl/useDatagridColumn.spec.tsx‎

Lines changed: 32 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,42 @@
1+
import React, { ComponentType } from 'react';
2+
3+
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
14
import { renderHook } from '@testing-library/react';
5+
import { I18nextProvider } from 'react-i18next';
26
import { describe, it } from 'vitest';
37

8+
import { createWrapper, i18n } from '@/utils/test.provider';
9+
410
import useDatagridColumn from '@/hooks/ssl/useDatagridColumn';
511

12+
const testQueryClient = new QueryClient({
13+
defaultOptions: {
14+
mutations: {
15+
retry: false,
16+
},
17+
queries: {
18+
retry: false,
19+
},
20+
},
21+
});
22+
23+
const RouterWrapper = createWrapper();
24+
25+
const Wrappers = ({ children }: { children: React.ReactElement }) => {
26+
return (
27+
<RouterWrapper>
28+
<QueryClientProvider client={testQueryClient}>
29+
<I18nextProvider i18n={i18n}>{children}</I18nextProvider>
30+
</QueryClientProvider>
31+
</RouterWrapper>
32+
);
33+
};
34+
635
describe('useDatagridColumn', () => {
736
it('should return correct columns', () => {
8-
const { result } = renderHook(() => useDatagridColumn());
37+
const { result } = renderHook(() => useDatagridColumn(), {
38+
wrapper: Wrappers as ComponentType,
39+
});
940

1041
const columns = result.current;
1142

‎packages/manager/apps/web-hosting/src/hooks/useEmailsUrl.spec.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
import { renderHook, waitFor } from '@testing-library/react';
22

3+
import { wrapper } from '@/utils/test.provider';
4+
35
import { useEmailsUrl } from './useEmailsUrl';
46

57
describe('useEmailsUrl', () => {
68
it('should return the correct hosting URL without path', async () => {
7-
const { result } = renderHook(() => useEmailsUrl('test-service'));
9+
const { result } = renderHook(() => useEmailsUrl('test-service'), {
10+
wrapper,
11+
});
812
await waitFor(() => {
913
expect(result.current).toBe('test-url');
1014
});

‎packages/manager/apps/web-hosting/src/hooks/useHostingUrl.spec.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
import { renderHook, waitFor } from '@testing-library/react';
22

3+
import { wrapper } from '@/utils/test.provider';
4+
35
import { useHostingUrl } from './useHostingUrl';
46

57
describe('useHostingUrl', () => {
68
it('should return the correct hosting URL without path', async () => {
7-
const { result } = renderHook(() => useHostingUrl('test-service'));
9+
const { result } = renderHook(() => useHostingUrl('test-service'), {
10+
wrapper,
11+
});
812
await waitFor(() => {
913
expect(result.current).toBe('test-url');
1014
});

‎packages/manager/apps/web-hosting/src/pages/dashboard/OrderDomain.page.spec.tsx‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,15 @@
1+
import React, { ComponentType } from 'react';
2+
13
import { fireEvent, render, screen } from '@testing-library/react';
24
import { beforeEach, describe, expect, it, vi } from 'vitest';
35

46
import { navigate } from '@/utils/test.setup';
7+
import { createTestWrapper } from '@/utils/test.provider';
58

69
import OrderDomainModal from './OrderDomain.page';
710

11+
const Wrappers = createTestWrapper();
12+
813
vi.mock('@/constants', async (importActual) => {
914
const actual = await importActual<typeof import('@/constants')>();
1015
return {
@@ -24,7 +29,7 @@ describe('OrderDomainModal', () => {
2429
});
2530

2631
it('display radio button and validate button is disabled', () => {
27-
const { container } = render(<OrderDomainModal />);
32+
const { container } = render(<OrderDomainModal />, { wrapper: Wrappers as ComponentType });
2833

2934
const orderRadio = container.querySelector('ods-radio[value="ORDER"]');
3035
const attachRadio = container.querySelector('ods-radio[value="ATTACH"]');
@@ -36,7 +41,7 @@ describe('OrderDomainModal', () => {
3641
});
3742

3843
it('select ORDER : activate button and open order page and close modal', () => {
39-
const { container } = render(<OrderDomainModal />);
44+
const { container } = render(<OrderDomainModal />, { wrapper: Wrappers as ComponentType });
4045

4146
const primaryBtn = screen.getByTestId('primary-button');
4247
expect(primaryBtn.getAttribute('is-disabled')).toBe('true');
@@ -67,7 +72,7 @@ describe('OrderDomainModal', () => {
6772
});
6873

6974
it('select ATTACH : activate validate button and navigate to addDomain', () => {
70-
const { container } = render(<OrderDomainModal />);
75+
const { container } = render(<OrderDomainModal />, { wrapper: Wrappers as ComponentType });
7176

7277
const primaryBtn = screen.getByTestId('primary-button');
7378
const attachRadio = container.querySelector('ods-radio[value="ATTACH"]');
@@ -89,7 +94,7 @@ describe('OrderDomainModal', () => {
8994
});
9095

9196
it('cancel button close modal', () => {
92-
render(<OrderDomainModal />);
97+
render(<OrderDomainModal />, { wrapper: Wrappers as ComponentType });
9398

9499
fireEvent.click(screen.getByTestId('secondary-button'));
95100
expect(navigate).toHaveBeenCalled();

‎packages/manager/apps/web-hosting/src/pages/dashboard/layout.spec.tsx‎

Lines changed: 31 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,42 @@
1-
import React from 'react';
1+
import React, { ComponentType } from 'react';
22

3+
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
4+
import { render, waitFor } from '@testing-library/react';
5+
import { I18nextProvider } from 'react-i18next';
36
import { describe, expect } from 'vitest';
47

5-
import { render, waitFor } from '@/utils/test.provider';
8+
import { createWrapper, i18n } from '@/utils/test.provider';
69

710
import Layout from './layout';
811

12+
const testQueryClient = new QueryClient({
13+
defaultOptions: {
14+
mutations: {
15+
retry: false,
16+
},
17+
queries: {
18+
retry: false,
19+
},
20+
},
21+
});
22+
23+
const RouterWrapper = createWrapper();
24+
25+
const Wrappers = ({ children }: { children: React.ReactElement }) => {
26+
return (
27+
<RouterWrapper>
28+
<QueryClientProvider client={testQueryClient}>
29+
<I18nextProvider i18n={i18n}>{children}</I18nextProvider>
30+
</QueryClientProvider>
31+
</RouterWrapper>
32+
);
33+
};
34+
935
describe('Layout', () => {
1036
it('should render correctly', async () => {
11-
const { queryByTestId, container } = render(<Layout />);
37+
const { queryByTestId, container } = render(<Layout />, {
38+
wrapper: Wrappers as ComponentType,
39+
});
1240

1341
await waitFor(() => {
1442
expect(queryByTestId('spinner')).toBeNull();

0 commit comments

Comments
 (0)