Skip to content

Commit 9b55188

Browse files
committed
test(jest v30): fixes after review
1 parent 1026e07 commit 9b55188

File tree

18 files changed

+870
-525
lines changed

18 files changed

+870
-525
lines changed

packages/charts/react-charts/library/src/components/AreaChart/AreaChart.test.tsx

Lines changed: 17 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -9,26 +9,25 @@ expect.extend(toHaveNoViolations);
99

1010
const originalRAF = window.requestAnimationFrame;
1111
const originalGetComputedStyle = window.getComputedStyle;
12+
const originalGetBoundingClientRect = window.Element.prototype.getBoundingClientRect;
1213

1314
function updateChartWidthAndHeight() {
1415
jest.useFakeTimers();
1516
Object.defineProperty(window, 'requestAnimationFrame', {
1617
writable: true,
1718
value: (callback: FrameRequestCallback) => callback(0),
1819
});
19-
window.Element.prototype.getBoundingClientRect = () =>
20-
({
21-
bottom: 44,
22-
height: 50,
23-
left: 10,
24-
right: 35.67,
25-
top: 20,
26-
width: 650,
27-
x: 10,
28-
y: 20,
29-
} as DOMRect);
30-
31-
window.getComputedStyle = (element: Element) => {
20+
window.Element.prototype.getBoundingClientRect = jest.fn().mockReturnValue({
21+
bottom: 44,
22+
height: 50,
23+
left: 10,
24+
right: 35.67,
25+
top: 20,
26+
width: 650,
27+
x: 10,
28+
y: 20,
29+
} as DOMRect);
30+
window.getComputedStyle = jest.fn().mockImplementation(element => {
3231
const style = originalGetComputedStyle(element);
3332
return {
3433
...style,
@@ -41,12 +40,13 @@ function updateChartWidthAndHeight() {
4140
return style.getPropertyValue(prop);
4241
},
4342
} as CSSStyleDeclaration;
44-
};
43+
});
4544
}
4645

4746
function sharedAfterEach() {
4847
jest.useRealTimers();
4948
window.requestAnimationFrame = originalRAF;
49+
window.Element.prototype.getBoundingClientRect = originalGetBoundingClientRect;
5050
window.getComputedStyle = originalGetComputedStyle;
5151
}
5252

@@ -650,7 +650,9 @@ describe('AreaChart - Accessibility tests', () => {
650650
test('Should pass accessibility tests', async () => {
651651
const { container } = render(<AreaChart data={chartData} />);
652652
let axeResults;
653-
axeResults = await axe(container);
653+
await act(async () => {
654+
axeResults = await axe(container);
655+
});
654656
expect(axeResults).toHaveNoViolations();
655657
});
656658
});

packages/charts/react-charts/library/src/components/DeclarativeChart/DeclarativeChartRTL.test.tsx

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ describe.skip('DeclarativeChart', () => {
1616
);
1717

1818
const originalRAF = window.requestAnimationFrame;
19+
const originalGetBoundingClientRect = window.HTMLElement.prototype.getBoundingClientRect;
1920

2021
beforeEach(() => {
2122
resetIdsForTests();
@@ -25,12 +26,22 @@ describe.skip('DeclarativeChart', () => {
2526
writable: true,
2627
value: (callback: FrameRequestCallback) => callback(0),
2728
});
28-
window.HTMLElement.prototype.getBoundingClientRect = jest.fn().mockReturnValue({ width: 600, height: 350 });
29+
window.HTMLElement.prototype.getBoundingClientRect = jest.fn().mockReturnValue({
30+
bottom: 350,
31+
height: 350,
32+
left: 0,
33+
right: 600,
34+
top: 0,
35+
width: 600,
36+
x: 0,
37+
y: 0,
38+
} as DOMRect);
2939
});
3040

3141
afterEach(() => {
3242
jest.useRealTimers();
3343
window.requestAnimationFrame = originalRAF;
44+
window.HTMLElement.prototype.getBoundingClientRect = originalGetBoundingClientRect;
3445
});
3546

3647
test('Should render areachart in DeclarativeChart', () => {

packages/charts/react-charts/library/src/components/GanttChart/GanttChart.test.tsx

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -13,23 +13,25 @@ expect.extend(toHaveNoViolations);
1313

1414
const originalRAF = window.requestAnimationFrame;
1515
const originalGetComputedStyle = window.getComputedStyle;
16+
const originalGetBoundingClientRect = window.HTMLElement.prototype.getBoundingClientRect;
1617

1718
function updateChartWidthAndHeight() {
1819
jest.useFakeTimers();
1920
Object.defineProperty(window, 'requestAnimationFrame', {
2021
writable: true,
2122
value: (callback: FrameRequestCallback) => callback(0),
2223
});
23-
window.HTMLElement.prototype.getBoundingClientRect = () =>
24-
({
25-
bottom: 44,
26-
height: 350,
27-
left: 10,
28-
right: 35.67,
29-
top: 20,
30-
width: 600,
31-
} as DOMRect);
32-
window.getComputedStyle = (element: Element) => {
24+
window.HTMLElement.prototype.getBoundingClientRect = jest.fn().mockReturnValue({
25+
bottom: 44,
26+
height: 350,
27+
left: 10,
28+
right: 35.67,
29+
top: 20,
30+
width: 600,
31+
x: 10,
32+
y: 20,
33+
} as DOMRect);
34+
window.getComputedStyle = jest.fn().mockImplementation(element => {
3335
const style = originalGetComputedStyle(element);
3436
return {
3537
...style,
@@ -42,7 +44,7 @@ function updateChartWidthAndHeight() {
4244
return style.getPropertyValue(prop);
4345
},
4446
} as CSSStyleDeclaration;
45-
};
47+
});
4648
}
4749

4850
beforeEach(() => {
@@ -53,6 +55,7 @@ beforeEach(() => {
5355
afterEach(() => {
5456
cleanup();
5557
window.requestAnimationFrame = originalRAF;
58+
window.HTMLElement.prototype.getBoundingClientRect = originalGetBoundingClientRect;
5659
window.getComputedStyle = originalGetComputedStyle;
5760
jest.useRealTimers();
5861
});

packages/charts/react-charts/library/src/components/GroupedVerticalBarChart/GroupedVerticalBarChart.test.tsx

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -24,23 +24,25 @@ beforeAll(() => {
2424

2525
const originalRAF = window.requestAnimationFrame;
2626
const originalGetComputedStyle = window.getComputedStyle;
27+
const originalGetBoundingClientRect = window.Element.prototype.getBoundingClientRect;
2728

2829
function updateChartWidthAndHeight() {
2930
jest.useFakeTimers();
3031
Object.defineProperty(window, 'requestAnimationFrame', {
3132
writable: true,
3233
value: (callback: FrameRequestCallback) => callback(0),
3334
});
34-
window.Element.prototype.getBoundingClientRect = () =>
35-
({
36-
bottom: 44,
37-
height: 50,
38-
left: 10,
39-
right: 35.67,
40-
top: 20,
41-
width: 650,
42-
} as DOMRect);
43-
window.getComputedStyle = (element: Element) => {
35+
window.Element.prototype.getBoundingClientRect = jest.fn().mockReturnValue({
36+
bottom: 44,
37+
height: 50,
38+
left: 10,
39+
right: 35.67,
40+
top: 20,
41+
width: 650,
42+
x: 10,
43+
y: 20,
44+
} as DOMRect);
45+
window.getComputedStyle = jest.fn().mockImplementation(element => {
4446
const style = originalGetComputedStyle(element);
4547
return {
4648
...style,
@@ -53,11 +55,12 @@ function updateChartWidthAndHeight() {
5355
return style.getPropertyValue(prop);
5456
},
5557
} as CSSStyleDeclaration;
56-
};
58+
});
5759
}
5860
function sharedAfterEach() {
5961
jest.useRealTimers();
6062
window.requestAnimationFrame = originalRAF;
63+
window.Element.prototype.getBoundingClientRect = originalGetBoundingClientRect;
6164
window.getComputedStyle = originalGetComputedStyle;
6265
}
6366

packages/charts/react-charts/library/src/components/HeatMapChart/HeatMapChart.test.tsx

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -26,23 +26,25 @@ beforeAll(() => {
2626

2727
const originalRAF = window.requestAnimationFrame;
2828
const originalGetComputedStyle = window.getComputedStyle;
29+
const originalGetBoundingClientRect = window.Element.prototype.getBoundingClientRect;
2930

3031
function updateChartWidthAndHeight() {
3132
jest.useFakeTimers();
3233
Object.defineProperty(window, 'requestAnimationFrame', {
3334
writable: true,
3435
value: (callback: FrameRequestCallback) => callback(0),
3536
});
36-
window.Element.prototype.getBoundingClientRect = () =>
37-
({
38-
bottom: 44,
39-
height: 50,
40-
left: 10,
41-
right: 35.67,
42-
top: 20,
43-
width: 650,
44-
} as DOMRect);
45-
window.getComputedStyle = (element: Element) => {
37+
window.Element.prototype.getBoundingClientRect = jest.fn().mockReturnValue({
38+
bottom: 44,
39+
height: 50,
40+
left: 10,
41+
right: 35.67,
42+
top: 20,
43+
width: 650,
44+
x: 10,
45+
y: 20,
46+
} as DOMRect);
47+
window.getComputedStyle = jest.fn().mockImplementation(element => {
4648
const style = originalGetComputedStyle(element);
4749
return {
4850
...style,
@@ -55,11 +57,12 @@ function updateChartWidthAndHeight() {
5557
return style.getPropertyValue(prop);
5658
},
5759
} as CSSStyleDeclaration;
58-
};
60+
});
5961
}
6062
function sharedAfterEach() {
6163
jest.useRealTimers();
6264
window.requestAnimationFrame = originalRAF;
65+
window.Element.prototype.getBoundingClientRect = originalGetBoundingClientRect;
6366
window.getComputedStyle = originalGetComputedStyle;
6467
}
6568

packages/charts/react-charts/library/src/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.test.tsx

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -206,23 +206,25 @@ beforeAll(() => {
206206

207207
const originalRAF = window.requestAnimationFrame;
208208
const originalGetComputedStyle = window.getComputedStyle;
209+
const originalGetBoundingClientRect = window.Element.prototype.getBoundingClientRect;
209210

210211
function updateChartWidthAndHeight() {
211212
jest.useFakeTimers();
212213
Object.defineProperty(window, 'requestAnimationFrame', {
213214
writable: true,
214215
value: (callback: FrameRequestCallback) => callback(0),
215216
});
216-
window.Element.prototype.getBoundingClientRect = () =>
217-
({
218-
bottom: 44,
219-
height: 50,
220-
left: 10,
221-
right: 35.67,
222-
top: 20,
223-
width: 650,
224-
} as DOMRect);
225-
window.getComputedStyle = (element: Element) => {
217+
window.Element.prototype.getBoundingClientRect = jest.fn().mockReturnValue({
218+
bottom: 44,
219+
height: 50,
220+
left: 10,
221+
right: 35.67,
222+
top: 20,
223+
width: 650,
224+
x: 10,
225+
y: 20,
226+
} as DOMRect);
227+
window.getComputedStyle = jest.fn().mockImplementation(element => {
226228
const style = originalGetComputedStyle(element);
227229
return {
228230
...style,
@@ -235,11 +237,12 @@ function updateChartWidthAndHeight() {
235237
return style.getPropertyValue(prop);
236238
},
237239
} as CSSStyleDeclaration;
238-
};
240+
});
239241
}
240242
function sharedAfterEach() {
241243
jest.useRealTimers();
242244
window.requestAnimationFrame = originalRAF;
245+
window.Element.prototype.getBoundingClientRect = originalGetBoundingClientRect;
243246
window.getComputedStyle = originalGetComputedStyle;
244247
}
245248

0 commit comments

Comments
 (0)