@mui/internal-test-utils 1.0.6 → 1.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/.tsbuildinfo +1 -1
- package/build/createRenderer.d.ts +114 -3
- package/build/createRenderer.d.ts.map +1 -1
- package/build/createRenderer.js +3 -3
- package/build/createRenderer.js.map +1 -1
- package/build/describeConformance.d.ts +1 -1
- package/build/describeConformance.d.ts.map +1 -1
- package/build/describeConformance.js +48 -45
- package/build/describeConformance.js.map +1 -1
- package/build/fireDiscreteEvent.d.ts.map +1 -1
- package/build/fireDiscreteEvent.js +4 -24
- package/build/fireDiscreteEvent.js.map +1 -1
- package/build/flushMicrotasks.d.ts.map +1 -1
- package/build/flushMicrotasks.js +1 -4
- package/build/flushMicrotasks.js.map +1 -1
- package/build/index.d.ts +3 -1
- package/build/index.d.ts.map +1 -1
- package/build/index.js +5 -2
- package/build/index.js.map +1 -1
- package/build/reactMajor.d.ts +3 -0
- package/build/reactMajor.d.ts.map +1 -0
- package/build/reactMajor.js +28 -0
- package/build/reactMajor.js.map +1 -0
- package/package.json +8 -8
- package/src/createRenderer.tsx +4 -3
- package/src/describeConformance.tsx +49 -46
- package/src/fireDiscreteEvent.ts +2 -2
- package/src/flushMicrotasks.ts +1 -4
- package/src/index.ts +3 -1
- package/src/reactMajor.ts +3 -0
- package/build/userEvent.d.ts +0 -8
- package/build/userEvent.d.ts.map +0 -1
- package/build/userEvent.js +0 -61
- package/build/userEvent.js.map +0 -1
- package/src/userEvent.ts +0 -35
|
@@ -41,7 +41,7 @@ export interface ConformanceOptions {
|
|
|
41
41
|
refInstanceof: any;
|
|
42
42
|
after?: () => void;
|
|
43
43
|
inheritComponent?: React.ElementType;
|
|
44
|
-
render: (node: React.ReactElement<any>) => MuiRenderResult
|
|
44
|
+
render: (node: React.ReactElement<any>) => MuiRenderResult | Promise<MuiRenderResult>;
|
|
45
45
|
only?: Array<keyof typeof fullSuite>;
|
|
46
46
|
skip?: Array<keyof typeof fullSuite | 'classesRoot'>;
|
|
47
47
|
testComponentsRootPropWith?: string;
|
|
@@ -94,7 +94,7 @@ export function testClassName(
|
|
|
94
94
|
element: React.ReactElement<any>,
|
|
95
95
|
getOptions: () => ConformanceOptions,
|
|
96
96
|
) {
|
|
97
|
-
it('applies the className to the root component', () => {
|
|
97
|
+
it('applies the className to the root component', async () => {
|
|
98
98
|
const { render } = getOptions();
|
|
99
99
|
|
|
100
100
|
if (!render) {
|
|
@@ -104,7 +104,7 @@ export function testClassName(
|
|
|
104
104
|
const className = randomStringValue();
|
|
105
105
|
const testId = randomStringValue();
|
|
106
106
|
|
|
107
|
-
const { getByTestId } = render(
|
|
107
|
+
const { getByTestId } = await render(
|
|
108
108
|
React.cloneElement(element, { className, 'data-testid': testId }),
|
|
109
109
|
);
|
|
110
110
|
|
|
@@ -121,7 +121,7 @@ export function testComponentProp(
|
|
|
121
121
|
getOptions: () => ConformanceOptions,
|
|
122
122
|
) {
|
|
123
123
|
describe('prop: component', () => {
|
|
124
|
-
it('can render another root component with the `component` prop', () => {
|
|
124
|
+
it('can render another root component with the `component` prop', async () => {
|
|
125
125
|
const { render, testComponentPropWith: component = 'em' } = getOptions();
|
|
126
126
|
if (!render) {
|
|
127
127
|
throwMissingPropError('render');
|
|
@@ -130,7 +130,7 @@ export function testComponentProp(
|
|
|
130
130
|
const testId = randomStringValue();
|
|
131
131
|
|
|
132
132
|
if (typeof component === 'string') {
|
|
133
|
-
const { getByTestId } = render(
|
|
133
|
+
const { getByTestId } = await render(
|
|
134
134
|
React.cloneElement(element, { component, 'data-testid': testId }),
|
|
135
135
|
);
|
|
136
136
|
expect(getByTestId(testId)).not.to.equal(null);
|
|
@@ -138,7 +138,7 @@ export function testComponentProp(
|
|
|
138
138
|
} else {
|
|
139
139
|
const componentWithTestId = (props: {}) =>
|
|
140
140
|
React.createElement(component, { ...props, 'data-testid': testId });
|
|
141
|
-
const { getByTestId } = render(
|
|
141
|
+
const { getByTestId } = await render(
|
|
142
142
|
React.cloneElement(element, {
|
|
143
143
|
component: componentWithTestId,
|
|
144
144
|
}),
|
|
@@ -156,7 +156,7 @@ export function testPropsSpread(
|
|
|
156
156
|
element: React.ReactElement<any>,
|
|
157
157
|
getOptions: () => ConformanceOptions,
|
|
158
158
|
) {
|
|
159
|
-
it(`spreads props to the root component`, () => {
|
|
159
|
+
it(`spreads props to the root component`, async () => {
|
|
160
160
|
// type def in ConformanceOptions
|
|
161
161
|
const { render } = getOptions();
|
|
162
162
|
|
|
@@ -168,7 +168,7 @@ export function testPropsSpread(
|
|
|
168
168
|
const value = randomStringValue();
|
|
169
169
|
const testId = randomStringValue();
|
|
170
170
|
|
|
171
|
-
const { getByTestId } = render(
|
|
171
|
+
const { getByTestId } = await render(
|
|
172
172
|
React.cloneElement(element, { [testProp]: value, 'data-testid': testId }),
|
|
173
173
|
);
|
|
174
174
|
|
|
@@ -187,7 +187,7 @@ export function describeRef(
|
|
|
187
187
|
getOptions: () => ConformanceOptions,
|
|
188
188
|
) {
|
|
189
189
|
describe('ref', () => {
|
|
190
|
-
it(`attaches the ref`, () => {
|
|
190
|
+
it(`attaches the ref`, async () => {
|
|
191
191
|
// type def in ConformanceOptions
|
|
192
192
|
const { render, refInstanceof } = getOptions();
|
|
193
193
|
|
|
@@ -197,7 +197,7 @@ export function describeRef(
|
|
|
197
197
|
|
|
198
198
|
const ref = React.createRef();
|
|
199
199
|
|
|
200
|
-
render(React.cloneElement(element, { ref }));
|
|
200
|
+
await render(React.cloneElement(element, { ref }));
|
|
201
201
|
|
|
202
202
|
expect(ref.current).to.be.instanceof(refInstanceof);
|
|
203
203
|
});
|
|
@@ -211,7 +211,7 @@ export function testRootClass(
|
|
|
211
211
|
element: React.ReactElement<any>,
|
|
212
212
|
getOptions: () => ConformanceOptions,
|
|
213
213
|
) {
|
|
214
|
-
it('applies the root class to the root component if it has this class', () => {
|
|
214
|
+
it('applies the root class to the root component if it has this class', async () => {
|
|
215
215
|
const { classes, render, skip } = getOptions();
|
|
216
216
|
if (classes.root == null) {
|
|
217
217
|
return;
|
|
@@ -219,7 +219,7 @@ export function testRootClass(
|
|
|
219
219
|
|
|
220
220
|
const className = randomStringValue();
|
|
221
221
|
const classesRootClassname = randomStringValue();
|
|
222
|
-
const { container } = render(
|
|
222
|
+
const { container } = await render(
|
|
223
223
|
React.cloneElement(element, {
|
|
224
224
|
className,
|
|
225
225
|
classes: { ...classes, root: `${classes.root} ${classesRootClassname}` },
|
|
@@ -273,7 +273,7 @@ function testSlotsProp(element: React.ReactElement<any>, getOptions: () => Confo
|
|
|
273
273
|
));
|
|
274
274
|
|
|
275
275
|
forEachSlot(slots, (slotName, slotOptions) => {
|
|
276
|
-
it(`allows overriding the ${slotName} slot with a component using the slots.${slotName} prop`, () => {
|
|
276
|
+
it(`allows overriding the ${slotName} slot with a component using the slots.${slotName} prop`, async () => {
|
|
277
277
|
if (!render) {
|
|
278
278
|
throwMissingPropError('render');
|
|
279
279
|
}
|
|
@@ -284,7 +284,7 @@ function testSlotsProp(element: React.ReactElement<any>, getOptions: () => Confo
|
|
|
284
284
|
[slotName]: slotComponent,
|
|
285
285
|
};
|
|
286
286
|
|
|
287
|
-
const { queryByTestId } = render(React.cloneElement(element, { slots: components }));
|
|
287
|
+
const { queryByTestId } = await render(React.cloneElement(element, { slots: components }));
|
|
288
288
|
const renderedElement = queryByTestId('custom');
|
|
289
289
|
expect(renderedElement).not.to.equal(null);
|
|
290
290
|
if (slotOptions.expectedClassName) {
|
|
@@ -293,7 +293,7 @@ function testSlotsProp(element: React.ReactElement<any>, getOptions: () => Confo
|
|
|
293
293
|
});
|
|
294
294
|
|
|
295
295
|
if (slotOptions.testWithElement !== null) {
|
|
296
|
-
it(`allows overriding the ${slotName} slot with an element using the slots.${slotName} prop`, () => {
|
|
296
|
+
it(`allows overriding the ${slotName} slot with an element using the slots.${slotName} prop`, async () => {
|
|
297
297
|
if (!render) {
|
|
298
298
|
throwMissingPropError('render');
|
|
299
299
|
}
|
|
@@ -310,7 +310,7 @@ function testSlotsProp(element: React.ReactElement<any>, getOptions: () => Confo
|
|
|
310
310
|
},
|
|
311
311
|
};
|
|
312
312
|
|
|
313
|
-
const { queryByTestId } = render(
|
|
313
|
+
const { queryByTestId } = await render(
|
|
314
314
|
React.cloneElement(element, { slots: components, slotProps }),
|
|
315
315
|
);
|
|
316
316
|
|
|
@@ -328,7 +328,7 @@ function testSlotsProp(element: React.ReactElement<any>, getOptions: () => Confo
|
|
|
328
328
|
if (testLegacyComponentsProp) {
|
|
329
329
|
it(`allows overriding the ${slotName} slot with a component using the components.${capitalize(
|
|
330
330
|
slotName,
|
|
331
|
-
)} prop`, () => {
|
|
331
|
+
)} prop`, async () => {
|
|
332
332
|
if (!render) {
|
|
333
333
|
throwMissingPropError('render');
|
|
334
334
|
}
|
|
@@ -339,7 +339,7 @@ function testSlotsProp(element: React.ReactElement<any>, getOptions: () => Confo
|
|
|
339
339
|
[capitalize(slotName)]: slotComponent,
|
|
340
340
|
};
|
|
341
341
|
|
|
342
|
-
const { queryByTestId } = render(React.cloneElement(element, { components }));
|
|
342
|
+
const { queryByTestId } = await render(React.cloneElement(element, { components }));
|
|
343
343
|
const renderedElement = queryByTestId('custom');
|
|
344
344
|
expect(renderedElement).not.to.equal(null);
|
|
345
345
|
if (slotOptions.expectedClassName) {
|
|
@@ -349,7 +349,7 @@ function testSlotsProp(element: React.ReactElement<any>, getOptions: () => Confo
|
|
|
349
349
|
|
|
350
350
|
it(`prioritizes the 'slots.${slotName}' over components.${capitalize(
|
|
351
351
|
slotName,
|
|
352
|
-
)} if both are defined`, () => {
|
|
352
|
+
)} if both are defined`, async () => {
|
|
353
353
|
if (!render) {
|
|
354
354
|
throwMissingPropError('render');
|
|
355
355
|
}
|
|
@@ -386,7 +386,7 @@ function testSlotsProp(element: React.ReactElement<any>, getOptions: () => Confo
|
|
|
386
386
|
[slotName]: ComponentForSlotsProp,
|
|
387
387
|
};
|
|
388
388
|
|
|
389
|
-
const { queryByTestId } = render(
|
|
389
|
+
const { queryByTestId } = await render(
|
|
390
390
|
React.cloneElement(element, { components, slots: slotOverrides }),
|
|
391
391
|
);
|
|
392
392
|
|
|
@@ -397,7 +397,7 @@ function testSlotsProp(element: React.ReactElement<any>, getOptions: () => Confo
|
|
|
397
397
|
if (slotOptions.testWithElement !== null) {
|
|
398
398
|
it(`allows overriding the ${slotName} slot with an element using the components.${capitalize(
|
|
399
399
|
slotName,
|
|
400
|
-
)} prop`, () => {
|
|
400
|
+
)} prop`, async () => {
|
|
401
401
|
if (!render) {
|
|
402
402
|
throwMissingPropError('render');
|
|
403
403
|
}
|
|
@@ -414,7 +414,7 @@ function testSlotsProp(element: React.ReactElement<any>, getOptions: () => Confo
|
|
|
414
414
|
},
|
|
415
415
|
};
|
|
416
416
|
|
|
417
|
-
const { queryByTestId } = render(
|
|
417
|
+
const { queryByTestId } = await render(
|
|
418
418
|
React.cloneElement(element, { components, componentsProps }),
|
|
419
419
|
);
|
|
420
420
|
|
|
@@ -439,14 +439,14 @@ function testSlotPropsProp(element: React.ReactElement<any>, getOptions: () => C
|
|
|
439
439
|
}
|
|
440
440
|
|
|
441
441
|
forEachSlot(slots, (slotName, slotOptions) => {
|
|
442
|
-
it(`sets custom properties on the ${slotName} slot's element with the slotProps.${slotName} prop`, () => {
|
|
442
|
+
it(`sets custom properties on the ${slotName} slot's element with the slotProps.${slotName} prop`, async () => {
|
|
443
443
|
const slotProps = {
|
|
444
444
|
[slotName]: {
|
|
445
445
|
'data-testid': 'custom',
|
|
446
446
|
},
|
|
447
447
|
};
|
|
448
448
|
|
|
449
|
-
const { queryByTestId } = render(React.cloneElement(element, { slotProps }));
|
|
449
|
+
const { queryByTestId } = await render(React.cloneElement(element, { slotProps }));
|
|
450
450
|
const slotComponent = queryByTestId('custom');
|
|
451
451
|
expect(slotComponent).not.to.equal(null);
|
|
452
452
|
|
|
@@ -456,7 +456,7 @@ function testSlotPropsProp(element: React.ReactElement<any>, getOptions: () => C
|
|
|
456
456
|
});
|
|
457
457
|
|
|
458
458
|
if (slotOptions.expectedClassName) {
|
|
459
|
-
it(`merges the class names provided in slotsProps.${slotName} with the built-in ones`, () => {
|
|
459
|
+
it(`merges the class names provided in slotsProps.${slotName} with the built-in ones`, async () => {
|
|
460
460
|
const slotProps = {
|
|
461
461
|
[slotName]: {
|
|
462
462
|
'data-testid': 'custom',
|
|
@@ -464,7 +464,7 @@ function testSlotPropsProp(element: React.ReactElement<any>, getOptions: () => C
|
|
|
464
464
|
},
|
|
465
465
|
};
|
|
466
466
|
|
|
467
|
-
const { getByTestId } = render(React.cloneElement(element, { slotProps }));
|
|
467
|
+
const { getByTestId } = await render(React.cloneElement(element, { slotProps }));
|
|
468
468
|
|
|
469
469
|
expect(getByTestId('custom')).to.have.class(slotOptions.expectedClassName);
|
|
470
470
|
expect(getByTestId('custom')).to.have.class(slotProps[slotName].className);
|
|
@@ -472,14 +472,14 @@ function testSlotPropsProp(element: React.ReactElement<any>, getOptions: () => C
|
|
|
472
472
|
}
|
|
473
473
|
|
|
474
474
|
if (testLegacyComponentsProp) {
|
|
475
|
-
it(`sets custom properties on the ${slotName} slot's element with the componentsProps.${slotName} prop`, () => {
|
|
475
|
+
it(`sets custom properties on the ${slotName} slot's element with the componentsProps.${slotName} prop`, async () => {
|
|
476
476
|
const componentsProps = {
|
|
477
477
|
[slotName]: {
|
|
478
478
|
'data-testid': 'custom',
|
|
479
479
|
},
|
|
480
480
|
};
|
|
481
481
|
|
|
482
|
-
const { queryByTestId } = render(React.cloneElement(element, { componentsProps }));
|
|
482
|
+
const { queryByTestId } = await render(React.cloneElement(element, { componentsProps }));
|
|
483
483
|
const slotComponent = queryByTestId('custom');
|
|
484
484
|
expect(slotComponent).not.to.equal(null);
|
|
485
485
|
|
|
@@ -488,7 +488,7 @@ function testSlotPropsProp(element: React.ReactElement<any>, getOptions: () => C
|
|
|
488
488
|
}
|
|
489
489
|
});
|
|
490
490
|
|
|
491
|
-
it(`prioritizes the 'slotProps.${slotName}' over componentsProps.${slotName} if both are defined`, () => {
|
|
491
|
+
it(`prioritizes the 'slotProps.${slotName}' over componentsProps.${slotName} if both are defined`, async () => {
|
|
492
492
|
const componentsProps = {
|
|
493
493
|
[slotName]: {
|
|
494
494
|
'data-testid': 'custom',
|
|
@@ -503,7 +503,7 @@ function testSlotPropsProp(element: React.ReactElement<any>, getOptions: () => C
|
|
|
503
503
|
},
|
|
504
504
|
};
|
|
505
505
|
|
|
506
|
-
const { queryByTestId } = render(
|
|
506
|
+
const { queryByTestId } = await render(
|
|
507
507
|
React.cloneElement(element, { componentsProps, slotProps }),
|
|
508
508
|
);
|
|
509
509
|
const slotComponent = queryByTestId('custom');
|
|
@@ -525,14 +525,14 @@ function testSlotPropsCallback(
|
|
|
525
525
|
}
|
|
526
526
|
|
|
527
527
|
forEachSlot(slots, (slotName) => {
|
|
528
|
-
it(`sets custom properties on the ${slotName} slot's element with the slotProps.${slotName} callback`, () => {
|
|
528
|
+
it(`sets custom properties on the ${slotName} slot's element with the slotProps.${slotName} callback`, async () => {
|
|
529
529
|
const slotProps = {
|
|
530
530
|
[slotName]: (ownerState: Record<string, any>) => ({
|
|
531
531
|
'data-testid': ownerState.className,
|
|
532
532
|
}),
|
|
533
533
|
};
|
|
534
534
|
|
|
535
|
-
const { queryByTestId } = render(
|
|
535
|
+
const { queryByTestId } = await render(
|
|
536
536
|
React.cloneElement(element, { slotProps, className: 'custom' }),
|
|
537
537
|
);
|
|
538
538
|
const slotComponent = queryByTestId('custom');
|
|
@@ -550,7 +550,7 @@ function testComponentsProp(
|
|
|
550
550
|
getOptions: () => ConformanceOptions,
|
|
551
551
|
) {
|
|
552
552
|
describe('prop components:', () => {
|
|
553
|
-
it('can render another root component with the `components` prop', () => {
|
|
553
|
+
it('can render another root component with the `components` prop', async () => {
|
|
554
554
|
const { render, testComponentsRootPropWith: component = 'em' } = getOptions();
|
|
555
555
|
if (!render) {
|
|
556
556
|
throwMissingPropError('render');
|
|
@@ -558,7 +558,7 @@ function testComponentsProp(
|
|
|
558
558
|
|
|
559
559
|
const testId = randomStringValue();
|
|
560
560
|
|
|
561
|
-
const { getByTestId } = render(
|
|
561
|
+
const { getByTestId } = await render(
|
|
562
562
|
React.cloneElement(element, { components: { Root: component }, 'data-testid': testId }),
|
|
563
563
|
);
|
|
564
564
|
expect(getByTestId(testId)).not.to.equal(null);
|
|
@@ -576,7 +576,7 @@ function testThemeDefaultProps(
|
|
|
576
576
|
getOptions: () => ConformanceOptions,
|
|
577
577
|
) {
|
|
578
578
|
describe('theme default components:', () => {
|
|
579
|
-
it("respect theme's defaultProps", () => {
|
|
579
|
+
it("respect theme's defaultProps", async () => {
|
|
580
580
|
const testProp = 'data-id';
|
|
581
581
|
const { muiName, render, ThemeProvider, createTheme } = getOptions();
|
|
582
582
|
|
|
@@ -606,7 +606,7 @@ function testThemeDefaultProps(
|
|
|
606
606
|
},
|
|
607
607
|
});
|
|
608
608
|
|
|
609
|
-
const { container } = render(<ThemeProvider theme={theme}>{element}</ThemeProvider>);
|
|
609
|
+
const { container } = await render(<ThemeProvider theme={theme}>{element}</ThemeProvider>);
|
|
610
610
|
|
|
611
611
|
expect(container.firstChild).to.have.attribute(testProp, 'testProp');
|
|
612
612
|
});
|
|
@@ -622,7 +622,7 @@ function testThemeStyleOverrides(
|
|
|
622
622
|
getOptions: () => ConformanceOptions,
|
|
623
623
|
) {
|
|
624
624
|
describe('theme style overrides:', () => {
|
|
625
|
-
it("respect theme's styleOverrides custom state", function test() {
|
|
625
|
+
it("respect theme's styleOverrides custom state", async function test() {
|
|
626
626
|
if (/jsdom/.test(window.navigator.userAgent)) {
|
|
627
627
|
this.skip();
|
|
628
628
|
}
|
|
@@ -666,7 +666,7 @@ function testThemeStyleOverrides(
|
|
|
666
666
|
return;
|
|
667
667
|
}
|
|
668
668
|
|
|
669
|
-
const { container } = render(
|
|
669
|
+
const { container } = await render(
|
|
670
670
|
<ThemeProvider theme={theme}>
|
|
671
671
|
{React.cloneElement(element, {
|
|
672
672
|
[testStateOverrides.prop]: testStateOverrides.value,
|
|
@@ -677,7 +677,7 @@ function testThemeStyleOverrides(
|
|
|
677
677
|
expect(container.firstChild).to.toHaveComputedStyle(testStyle);
|
|
678
678
|
});
|
|
679
679
|
|
|
680
|
-
it("respect theme's styleOverrides slots", function test() {
|
|
680
|
+
it("respect theme's styleOverrides slots", async function test() {
|
|
681
681
|
if (/jsdom/.test(window.navigator.userAgent)) {
|
|
682
682
|
this.skip();
|
|
683
683
|
}
|
|
@@ -742,7 +742,7 @@ function testThemeStyleOverrides(
|
|
|
742
742
|
},
|
|
743
743
|
});
|
|
744
744
|
|
|
745
|
-
const { container, setProps } = render(
|
|
745
|
+
const { container, setProps } = await render(
|
|
746
746
|
<ThemeProvider theme={theme}>{element}</ThemeProvider>,
|
|
747
747
|
);
|
|
748
748
|
|
|
@@ -788,7 +788,7 @@ function testThemeStyleOverrides(
|
|
|
788
788
|
}
|
|
789
789
|
});
|
|
790
790
|
|
|
791
|
-
it('overrideStyles does not replace each other in slots', function test() {
|
|
791
|
+
it('overrideStyles does not replace each other in slots', async function test() {
|
|
792
792
|
if (/jsdom/.test(window.navigator.userAgent)) {
|
|
793
793
|
this.skip();
|
|
794
794
|
}
|
|
@@ -844,7 +844,7 @@ function testThemeStyleOverrides(
|
|
|
844
844
|
return;
|
|
845
845
|
}
|
|
846
846
|
|
|
847
|
-
render(
|
|
847
|
+
await render(
|
|
848
848
|
<ThemeProvider theme={theme}>
|
|
849
849
|
{React.cloneElement(element, {
|
|
850
850
|
[testStateOverrides.prop]: testStateOverrides.value,
|
|
@@ -866,7 +866,7 @@ function testThemeStyleOverrides(
|
|
|
866
866
|
*/
|
|
867
867
|
function testThemeVariants(element: React.ReactElement<any>, getOptions: () => ConformanceOptions) {
|
|
868
868
|
describe('theme variants:', () => {
|
|
869
|
-
it("respect theme's variants", function test() {
|
|
869
|
+
it("respect theme's variants", async function test() {
|
|
870
870
|
if (/jsdom/.test(window.navigator.userAgent)) {
|
|
871
871
|
this.skip();
|
|
872
872
|
}
|
|
@@ -910,7 +910,7 @@ function testThemeVariants(element: React.ReactElement<any>, getOptions: () => C
|
|
|
910
910
|
},
|
|
911
911
|
});
|
|
912
912
|
|
|
913
|
-
const { getByTestId } = render(
|
|
913
|
+
const { getByTestId } = await render(
|
|
914
914
|
<ThemeProvider theme={theme}>
|
|
915
915
|
{React.cloneElement(element, { ...testVariantProps, 'data-testid': 'with-props' })}
|
|
916
916
|
{React.cloneElement(element, { 'data-testid': 'without-props' })}
|
|
@@ -921,7 +921,7 @@ function testThemeVariants(element: React.ReactElement<any>, getOptions: () => C
|
|
|
921
921
|
expect(getByTestId('without-props')).not.to.toHaveComputedStyle(testStyle);
|
|
922
922
|
});
|
|
923
923
|
|
|
924
|
-
it('supports custom variant', function test() {
|
|
924
|
+
it('supports custom variant', async function test() {
|
|
925
925
|
if (/jsdom/.test(window.navigator.userAgent)) {
|
|
926
926
|
this.skip();
|
|
927
927
|
}
|
|
@@ -954,7 +954,7 @@ function testThemeVariants(element: React.ReactElement<any>, getOptions: () => C
|
|
|
954
954
|
},
|
|
955
955
|
});
|
|
956
956
|
|
|
957
|
-
const { getByTestId } = render(
|
|
957
|
+
const { getByTestId } = await render(
|
|
958
958
|
<ThemeProvider theme={theme}>
|
|
959
959
|
{React.cloneElement(element, { variant: 'unknown', 'data-testid': 'custom-variant' })}
|
|
960
960
|
</ThemeProvider>,
|
|
@@ -1034,8 +1034,11 @@ function describeConformance(
|
|
|
1034
1034
|
});
|
|
1035
1035
|
window.matchMedia = () =>
|
|
1036
1036
|
({
|
|
1037
|
+
// Keep mocking legacy methods because @mui/material v5 still uses them
|
|
1037
1038
|
addListener: () => {},
|
|
1039
|
+
addEventListener: () => {},
|
|
1038
1040
|
removeListener: () => {},
|
|
1041
|
+
removeEventListener: () => {},
|
|
1039
1042
|
}) as unknown as MediaQueryList;
|
|
1040
1043
|
});
|
|
1041
1044
|
afterEach(() => {
|
package/src/fireDiscreteEvent.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
1
|
import { configure, fireEvent, getConfig } from '@testing-library/react';
|
|
2
|
+
import reactMajor from './reactMajor';
|
|
3
3
|
|
|
4
4
|
const noWrapper = (callback: () => void) => callback();
|
|
5
5
|
|
|
@@ -8,7 +8,7 @@ const noWrapper = (callback: () => void) => callback();
|
|
|
8
8
|
* @returns {void}
|
|
9
9
|
*/
|
|
10
10
|
function withMissingActWarningsIgnored(callback: () => void) {
|
|
11
|
-
if (
|
|
11
|
+
if (reactMajor >= 18) {
|
|
12
12
|
callback();
|
|
13
13
|
return;
|
|
14
14
|
}
|
package/src/flushMicrotasks.ts
CHANGED
|
@@ -1,8 +1,5 @@
|
|
|
1
1
|
import { act } from './createRenderer';
|
|
2
2
|
|
|
3
3
|
export default async function flushMicrotasks() {
|
|
4
|
-
|
|
5
|
-
// This is only needed for JSDOM and causes issues in real browsers
|
|
6
|
-
await act(async () => {});
|
|
7
|
-
}
|
|
4
|
+
await act(async () => {});
|
|
8
5
|
}
|
package/src/index.ts
CHANGED
|
@@ -13,11 +13,13 @@ export {
|
|
|
13
13
|
} from './focusVisible';
|
|
14
14
|
export {} from './initMatchers';
|
|
15
15
|
export * as fireDiscreteEvent from './fireDiscreteEvent';
|
|
16
|
-
export * as userEvent from './userEvent';
|
|
17
16
|
export { default as flushMicrotasks } from './flushMicrotasks';
|
|
17
|
+
export { default as reactMajor } from './reactMajor';
|
|
18
18
|
|
|
19
19
|
/**
|
|
20
20
|
* Set to true if console logs during [lifecycles that are invoked twice in `React.StrictMode`](https://reactjs.org/docs/strict-mode.html#detecting-unexpected-side-effects) are suppressed.
|
|
21
21
|
* Useful for asserting on `console.warn` or `console.error` via `toErrorDev()`.
|
|
22
|
+
* TODO: Refactor to use reactMajor when fixing the React 17 cron test.
|
|
23
|
+
* https://github.com/mui/material-ui/issues/43153
|
|
22
24
|
*/
|
|
23
25
|
export const strictModeDoubleLoggingSuppressed = React.version.startsWith('17');
|
package/build/userEvent.d.ts
DELETED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { fireEvent } from './createRenderer';
|
|
2
|
-
export declare function touch(target: Element): void;
|
|
3
|
-
export declare const mousePress: (...args: Parameters<(typeof fireEvent)['mouseUp']>) => void;
|
|
4
|
-
export declare function keyPress(target: Element, options: {
|
|
5
|
-
key: string;
|
|
6
|
-
[key: string]: any;
|
|
7
|
-
}): void;
|
|
8
|
-
//# sourceMappingURL=userEvent.d.ts.map
|
package/build/userEvent.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"userEvent.d.ts","sourceRoot":"","sources":["../src/userEvent.ts"],"names":[],"mappings":"AAEA,OAAO,EAAO,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAElD,wBAAgB,KAAK,CAAC,MAAM,EAAE,OAAO,GAAG,IAAI,CAG3C;AAED,eAAO,MAAM,UAAU,EAAE,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,OAAO,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,KAAK,IAchF,CAAC;AAEF,wBAAgB,QAAQ,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,GAAG,IAAI,CAS5F"}
|
package/build/userEvent.js
DELETED
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
-
exports.keyPress = exports.mousePress = exports.touch = void 0;
|
|
27
|
-
const React = __importStar(require("react"));
|
|
28
|
-
const fireDiscreteEvent_1 = require("./fireDiscreteEvent");
|
|
29
|
-
const createRenderer_1 = require("./createRenderer");
|
|
30
|
-
function touch(target) {
|
|
31
|
-
createRenderer_1.fireEvent.touchStart(target);
|
|
32
|
-
createRenderer_1.fireEvent.touchEnd(target);
|
|
33
|
-
}
|
|
34
|
-
exports.touch = touch;
|
|
35
|
-
const mousePress = (target, options) => {
|
|
36
|
-
if (React.version.startsWith('18')) {
|
|
37
|
-
createRenderer_1.fireEvent.mouseDown(target, options);
|
|
38
|
-
createRenderer_1.fireEvent.mouseUp(target, options);
|
|
39
|
-
createRenderer_1.fireEvent.click(target, options);
|
|
40
|
-
}
|
|
41
|
-
else {
|
|
42
|
-
(0, fireDiscreteEvent_1.mouseDown)(target, options);
|
|
43
|
-
(0, fireDiscreteEvent_1.mouseUp)(target, options);
|
|
44
|
-
(0, fireDiscreteEvent_1.click)(target, options);
|
|
45
|
-
(0, createRenderer_1.act)(() => { });
|
|
46
|
-
}
|
|
47
|
-
};
|
|
48
|
-
exports.mousePress = mousePress;
|
|
49
|
-
function keyPress(target, options) {
|
|
50
|
-
if (React.version.startsWith('18')) {
|
|
51
|
-
createRenderer_1.fireEvent.keyDown(target, options);
|
|
52
|
-
createRenderer_1.fireEvent.keyUp(target, options);
|
|
53
|
-
}
|
|
54
|
-
else {
|
|
55
|
-
(0, fireDiscreteEvent_1.keyDown)(target, options);
|
|
56
|
-
(0, fireDiscreteEvent_1.keyUp)(target, options);
|
|
57
|
-
(0, createRenderer_1.act)(() => { });
|
|
58
|
-
}
|
|
59
|
-
}
|
|
60
|
-
exports.keyPress = keyPress;
|
|
61
|
-
//# sourceMappingURL=userEvent.js.map
|
package/build/userEvent.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"userEvent.js","sourceRoot":"","sources":["../src/userEvent.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,2DAAgF;AAChF,qDAAkD;AAElD,SAAgB,KAAK,CAAC,MAAe;IACnC,0BAAS,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;IAC7B,0BAAS,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AAC7B,CAAC;AAHD,sBAGC;AAEM,MAAM,UAAU,GAAiE,CACtF,MAAM,EACN,OAAO,EACP,EAAE;IACF,IAAI,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;QACnC,0BAAS,CAAC,SAAS,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACrC,0BAAS,CAAC,OAAO,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACnC,0BAAS,CAAC,KAAK,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACnC,CAAC;SAAM,CAAC;QACN,IAAA,6BAAS,EAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAC3B,IAAA,2BAAO,EAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACzB,IAAA,yBAAK,EAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACvB,IAAA,oBAAG,EAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IAChB,CAAC;AACH,CAAC,CAAC;AAdW,QAAA,UAAU,cAcrB;AAEF,SAAgB,QAAQ,CAAC,MAAe,EAAE,OAA4C;IACpF,IAAI,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;QACnC,0BAAS,CAAC,OAAO,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACnC,0BAAS,CAAC,KAAK,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACnC,CAAC;SAAM,CAAC;QACN,IAAA,2BAAO,EAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACzB,IAAA,yBAAK,EAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACvB,IAAA,oBAAG,EAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IAChB,CAAC;AACH,CAAC;AATD,4BASC"}
|
package/src/userEvent.ts
DELETED
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { click, mouseDown, mouseUp, keyDown, keyUp } from './fireDiscreteEvent';
|
|
3
|
-
import { act, fireEvent } from './createRenderer';
|
|
4
|
-
|
|
5
|
-
export function touch(target: Element): void {
|
|
6
|
-
fireEvent.touchStart(target);
|
|
7
|
-
fireEvent.touchEnd(target);
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
export const mousePress: (...args: Parameters<(typeof fireEvent)['mouseUp']>) => void = (
|
|
11
|
-
target,
|
|
12
|
-
options,
|
|
13
|
-
) => {
|
|
14
|
-
if (React.version.startsWith('18')) {
|
|
15
|
-
fireEvent.mouseDown(target, options);
|
|
16
|
-
fireEvent.mouseUp(target, options);
|
|
17
|
-
fireEvent.click(target, options);
|
|
18
|
-
} else {
|
|
19
|
-
mouseDown(target, options);
|
|
20
|
-
mouseUp(target, options);
|
|
21
|
-
click(target, options);
|
|
22
|
-
act(() => {});
|
|
23
|
-
}
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
export function keyPress(target: Element, options: { key: string; [key: string]: any }): void {
|
|
27
|
-
if (React.version.startsWith('18')) {
|
|
28
|
-
fireEvent.keyDown(target, options);
|
|
29
|
-
fireEvent.keyUp(target, options);
|
|
30
|
-
} else {
|
|
31
|
-
keyDown(target, options);
|
|
32
|
-
keyUp(target, options);
|
|
33
|
-
act(() => {});
|
|
34
|
-
}
|
|
35
|
-
}
|