Skip to content

Commit 6e70db2

Browse files
jaywcjlovejaywcjlove
committed
test: fix test case. #69 
1 parent 3738564 commit 6e70db2

File tree

5 files changed

+59
-27
lines changed

5 files changed

+59
-27
lines changed

‎core/src/Container.test.tsx

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1+
import React, { act } from 'react';
12
import userEvent from '@testing-library/user-event';
23
import { screen, render, waitFor } from '@testing-library/react';
34
import JsonView from './';
4-
import React from 'react';
55

66
const avatar = 'https://i.imgur.com/MK3eW3As.jpg';
77
const example = {
@@ -18,14 +18,20 @@ it('renders <JsonView /> Container test case', async () => {
1818
</JsonView>,
1919
);
2020
expect(container.firstElementChild).toBeInstanceOf(Element);
21-
await user.hover(container.lastElementChild!);
21+
// 使用新的 act 用法包裹 hover 操作
22+
await act(async () => {
23+
await user.hover(container.lastElementChild!);
24+
});
2225
const copied = screen.getByTestId('copied');
2326
expect(copied.style).toHaveProperty('height', '1em');
2427
expect(copied.style).toHaveProperty('width', '1em');
2528
expect(copied.style).toHaveProperty('cursor', 'pointer');
2629
expect(copied.style).toHaveProperty('vertical-align', 'middle');
2730
expect(copied.style).toHaveProperty('margin-left', '5px');
28-
await user.unhover(container.lastElementChild!);
31+
// 使用新的 act 用法包裹 unhover 操作
32+
await act(async () => {
33+
await user.unhover(container.lastElementChild!);
34+
});
2935
const countInfo = screen.getByTestId('countInfo');
3036
expect(countInfo.nextElementSibling).toBeNull();
3137
await waitFor(() => {

‎core/src/section/Copied.test.tsx

Lines changed: 28 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import userEvent from '@testing-library/user-event';
22
import { screen, render, waitFor, fireEvent } from '@testing-library/react';
33
import JsonView from '../';
44
import React from 'react';
5-
import { act } from 'react-test-renderer';
5+
import { act } from 'react';
66

77
const avatar = 'https://i.imgur.com/MK3eW3As.jpg';
88
const example = {
@@ -48,13 +48,15 @@ it('render <JsonView />, copy String test case', async () => {
4848
expect(copied.style).toHaveProperty('margin-left', '5px');
4949
expect(copied.getAttribute('fill')).toEqual('var(--w-rjv-copied-color, currentColor)');
5050
expect(copied.tagName).toEqual('svg');
51-
await user.click(copied);
52-
act(() => {
53-
expect(copied.getAttribute('fill')).toEqual('var(--w-rjv-copied-success-color, #28a745)');
51+
await act(async () => {
52+
await user.click(copied);
5453
});
54+
expect(copied.getAttribute('fill')).toEqual('var(--w-rjv-copied-success-color, #28a745)');
5555
// Assertions
5656
expect(navigator.clipboard.writeText).toHaveBeenCalledWith(JSON.stringify(example, null, 2));
57-
await user.unhover(container.lastElementChild!);
57+
await act(async () => {
58+
await user.unhover(container.lastElementChild!);
59+
});
5860
const countInfo = screen.getByTestId('countInfo');
5961
expect(countInfo.nextElementSibling).toBeNull();
6062
await waitFor(() => {
@@ -82,7 +84,9 @@ it('render <JsonView />, copy Number test case', async () => {
8284
fireEvent.mouseEnter(lineDom);
8385
const copied = screen.getAllByTestId('copied')[1];
8486
expect(copied.tagName).toEqual('svg');
85-
await user.click(copied);
87+
await waitFor(async () => {
88+
await user.click(copied);
89+
});
8690
expect(navigator.clipboard.writeText).toHaveBeenCalledWith('123');
8791
jest.restoreAllMocks();
8892
});
@@ -112,7 +116,9 @@ it('render <JsonView.Copied />, copy Number test case', async () => {
112116
const copied = screen.getAllByTestId('copied')[1];
113117
expect(copied.tagName).toEqual('SPAN');
114118
expect(copied.innerHTML).toEqual('xx');
115-
await user.click(copied);
119+
await waitFor(async () => {
120+
await user.click(copied);
121+
});
116122
expect(navigator.clipboard.writeText).toHaveBeenCalledWith('123');
117123
jest.restoreAllMocks();
118124
});
@@ -134,7 +140,9 @@ it('render <JsonView.Copied />, copy NaN test case', async () => {
134140
const lineDom = quote.parentElement?.parentElement!;
135141
fireEvent.mouseEnter(lineDom);
136142
const copied = screen.getAllByTestId('copied')[1];
137-
await user.click(copied);
143+
await waitFor(async () => {
144+
await user.click(copied);
145+
});
138146
expect(navigator.clipboard.writeText).toHaveBeenCalledWith('NaN');
139147
jest.restoreAllMocks();
140148
});
@@ -156,7 +164,9 @@ it('render <JsonView.Copied />, copy Infinity test case', async () => {
156164
const lineDom = quote.parentElement?.parentElement!;
157165
fireEvent.mouseEnter(lineDom);
158166
const copied = screen.getAllByTestId('copied')[1];
159-
await user.click(copied);
167+
await waitFor(async () => {
168+
await user.click(copied);
169+
});
160170
expect(navigator.clipboard.writeText).toHaveBeenCalledWith('Infinity');
161171
jest.restoreAllMocks();
162172
});
@@ -179,7 +189,9 @@ it('render <JsonView.Copied />, copy BigInt test case', async () => {
179189
const lineDom = quote.parentElement?.parentElement!;
180190
fireEvent.mouseEnter(lineDom);
181191
const copied = screen.getAllByTestId('copied')[1];
182-
await user.click(copied);
192+
await waitFor(async () => {
193+
await user.click(copied);
194+
});
183195
expect(navigator.clipboard.writeText).toHaveBeenCalledWith('1000n');
184196
fireEvent.mouseLeave(lineDom);
185197
const bigint = screen.getAllByTestId('bigint')[1];
@@ -202,10 +214,14 @@ it('render <JsonView.Copied />, copy Object with BigInt test case', async () =>
202214
expect(container.firstElementChild).toBeInstanceOf(Element);
203215
fireEvent.mouseEnter(container.lastElementChild!);
204216
const copied = screen.getByTestId('copied');
205-
await user.click(copied);
217+
await waitFor(async () => {
218+
await user.click(copied);
219+
});
206220
// Assertions
207221
expect(navigator.clipboard.writeText).toHaveBeenCalledWith(JSON.stringify(exampleWithBigIntAnswer, null, 2));
208-
await user.unhover(container.lastElementChild!);
222+
await waitFor(async () => {
223+
await user.unhover(container.lastElementChild!);
224+
});
209225
// Restore the original implementation
210226
jest.restoreAllMocks();
211227
});

‎core/src/section/Ellipsis.test.tsx

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import userEvent from '@testing-library/user-event';
2+
import { act } from 'react';
23
import { screen, render, waitFor } from '@testing-library/react';
34
import JsonView from '../';
45
import { Ellipsis } from './Ellipsis';
@@ -24,13 +25,15 @@ it('renders <JsonView.Ellipsis /> test case', async () => {
2425
</JsonView>,
2526
);
2627
expect(container.firstElementChild).toBeInstanceOf(Element);
27-
await user.click(container.lastElementChild?.firstElementChild!);
28-
await waitFor(() => {
29-
const ellipsis = screen.getByTestId('ellipsis');
30-
expect(ellipsis.className).toEqual('w-rjv-ellipsis');
31-
expect(ellipsis.style).toHaveProperty('cursor', 'pointer');
32-
expect(ellipsis.style).toHaveProperty('user-select', 'none');
33-
expect(ellipsis.innerHTML).toEqual('...');
28+
await act(async () => {
29+
await user.click(container.lastElementChild?.firstElementChild!);
30+
await waitFor(() => {
31+
const ellipsis = screen.getByTestId('ellipsis');
32+
expect(ellipsis.className).toEqual('w-rjv-ellipsis');
33+
expect(ellipsis.style).toHaveProperty('cursor', 'pointer');
34+
expect(ellipsis.style).toHaveProperty('user-select', 'none');
35+
expect(ellipsis.innerHTML).toEqual('...');
36+
});
3437
});
3538
});
3639

@@ -44,7 +47,9 @@ it('renders <JsonView.Ellipsis /> children test case', async () => {
4447
</JsonView>,
4548
);
4649
expect(container.firstElementChild).toBeInstanceOf(Element);
47-
await user.click(container.lastElementChild?.firstElementChild!);
50+
await act(async () => {
51+
await user.click(container.lastElementChild?.firstElementChild!);
52+
});
4853
await waitFor(() => {
4954
const ellipsis = screen.getByTestId('ellipsis');
5055
expect(ellipsis.innerHTML).toEqual('xxx');

‎core/src/types/String.test.tsx

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import userEvent from '@testing-library/user-event';
22
import { screen, render } from '@testing-library/react';
3+
import { act } from 'react';
34
import JsonView from '..';
45

56
it('renders <JsonView.String /> test case', async () => {
@@ -27,11 +28,15 @@ it('renders <JsonView.String /> test case', async () => {
2728
expect(type.tagName).toBe('SPAN');
2829
expect(type.innerHTML).toBe('string');
2930
const value = screen.getByTestId('value');
30-
expect(value.className).toBe('w-rjv-value');
31+
expect(value.className).toBe('w-rjv-value w-rjv-value-short');
3132
expect(value.tagName).toBe('SPAN');
3233
expect(value.innerHTML).toBe('Lorem ipsum dolor sit amet. Lo...');
33-
await user.click(value);
34+
await act(async () => {
35+
await user.click(value);
36+
});
3437
expect(value.innerHTML).toBe(demo.string);
35-
await user.click(value);
38+
await act(async () => {
39+
await user.click(value);
40+
});
3641
expect(value.innerHTML).toBe('Lorem ipsum dolor sit amet. Lo...');
3742
});

‎core/src/types/index.test.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ it('renders <JsonView.String /> test case', async () => {
2525
expect(type.tagName).toBe('EM');
2626
expect(type.innerHTML).toBe('string');
2727
const value = screen.getByTestId('str-value');
28-
expect(value.className).toBe('w-rjv-value');
28+
expect(value.className).toBe('w-rjv-value w-rjv-value-short');
2929
expect(value.tagName).toBe('SPAN');
3030
expect(value).toHaveProperty('style.cursor', 'pointer');
3131
});

0 commit comments

Comments
 (0)