Skip to content

Commit 34a978f

Browse files
jackpopeAndyPengc12
jackpope
authored and
AndyPengc12
committed
Concurrent rendering for ReactART-test (facebook#28521)
## Summary We need to unblock flipping the default for RTR to be concurrent rendering. Update ReactART-test to use `unstable_isConcurrent` in place. ## How did you test this change? `yarn test packages/react-art/src/__tests__/ReactART-test.js`
1 parent 6fc81c3 commit 34a978f

File tree

1 file changed

+102
-55
lines changed

1 file changed

+102
-55
lines changed

‎packages/react-art/src/__tests__/ReactART-test.js‎

Lines changed: 102 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -24,13 +24,8 @@ import Wedge from 'react-art/Wedge';
2424

2525
// Isolate DOM renderer.
2626
jest.resetModules();
27-
2827
const ReactDOMClient = require('react-dom/client');
29-
const act = require('internal-test-utils').act;
30-
31-
// Isolate test renderer.
32-
jest.resetModules();
33-
const ReactTestRenderer = require('react-test-renderer');
28+
let act = require('internal-test-utils').act;
3429

3530
// Isolate the noop renderer
3631
jest.resetModules();
@@ -449,85 +444,137 @@ describe('ReactART', () => {
449444
});
450445

451446
describe('ReactARTComponents', () => {
452-
it('should generate a <Shape> with props for drawing the Circle', () => {
453-
const circle = ReactTestRenderer.create(
454-
<Circle radius={10} stroke="green" strokeWidth={3} fill="blue" />,
455-
);
447+
let ReactTestRenderer;
448+
beforeEach(() => {
449+
jest.resetModules();
450+
// Isolate test renderer.
451+
ReactTestRenderer = require('react-test-renderer');
452+
act = require('internal-test-utils').act;
453+
});
454+
455+
it('should generate a <Shape> with props for drawing the Circle', async () => {
456+
let circle;
457+
await act(() => {
458+
circle = ReactTestRenderer.create(
459+
<Circle radius={10} stroke="green" strokeWidth={3} fill="blue" />,
460+
{unstable_isConcurrent: true},
461+
);
462+
});
456463
expect(circle.toJSON()).toMatchSnapshot();
457464
});
458465

459-
it('should generate a <Shape> with props for drawing the Rectangle', () => {
460-
const rectangle = ReactTestRenderer.create(
461-
<Rectangle width={50} height={50} stroke="green" fill="blue" />,
462-
);
466+
it('should generate a <Shape> with props for drawing the Rectangle', async () => {
467+
let rectangle;
468+
await act(() => {
469+
rectangle = ReactTestRenderer.create(
470+
<Rectangle width={50} height={50} stroke="green" fill="blue" />,
471+
{unstable_isConcurrent: true},
472+
);
473+
});
463474
expect(rectangle.toJSON()).toMatchSnapshot();
464475
});
465476

466-
it('should generate a <Shape> with positive width when width prop is negative', () => {
467-
const rectangle = ReactTestRenderer.create(
468-
<Rectangle width={-50} height={50} />,
469-
);
477+
it('should generate a <Shape> with positive width when width prop is negative', async () => {
478+
let rectangle;
479+
await act(() => {
480+
rectangle = ReactTestRenderer.create(
481+
<Rectangle width={-50} height={50} />,
482+
{unstable_isConcurrent: true},
483+
);
484+
});
470485
expect(rectangle.toJSON()).toMatchSnapshot();
471486
});
472487

473-
it('should generate a <Shape> with positive height when height prop is negative', () => {
474-
const rectangle = ReactTestRenderer.create(
475-
<Rectangle height={-50} width={50} />,
476-
);
488+
it('should generate a <Shape> with positive height when height prop is negative', async () => {
489+
let rectangle;
490+
await act(() => {
491+
rectangle = ReactTestRenderer.create(
492+
<Rectangle height={-50} width={50} />,
493+
{unstable_isConcurrent: true},
494+
);
495+
});
477496
expect(rectangle.toJSON()).toMatchSnapshot();
478497
});
479498

480-
it('should generate a <Shape> with a radius property of 0 when top left radius prop is negative', () => {
481-
const rectangle = ReactTestRenderer.create(
482-
<Rectangle radiusTopLeft={-25} width={50} height={50} />,
483-
);
499+
it('should generate a <Shape> with a radius property of 0 when top left radius prop is negative', async () => {
500+
let rectangle;
501+
await act(() => {
502+
rectangle = ReactTestRenderer.create(
503+
<Rectangle radiusTopLeft={-25} width={50} height={50} />,
504+
{unstable_isConcurrent: true},
505+
);
506+
});
484507
expect(rectangle.toJSON()).toMatchSnapshot();
485508
});
486509

487-
it('should generate a <Shape> with a radius property of 0 when top right radius prop is negative', () => {
488-
const rectangle = ReactTestRenderer.create(
489-
<Rectangle radiusTopRight={-25} width={50} height={50} />,
490-
);
510+
it('should generate a <Shape> with a radius property of 0 when top right radius prop is negative', async () => {
511+
let rectangle;
512+
await act(() => {
513+
rectangle = ReactTestRenderer.create(
514+
<Rectangle radiusTopRight={-25} width={50} height={50} />,
515+
{unstable_isConcurrent: true},
516+
);
517+
});
491518
expect(rectangle.toJSON()).toMatchSnapshot();
492519
});
493520

494-
it('should generate a <Shape> with a radius property of 0 when bottom right radius prop is negative', () => {
495-
const rectangle = ReactTestRenderer.create(
496-
<Rectangle radiusBottomRight={-30} width={50} height={50} />,
497-
);
521+
it('should generate a <Shape> with a radius property of 0 when bottom right radius prop is negative', async () => {
522+
let rectangle;
523+
await act(() => {
524+
rectangle = ReactTestRenderer.create(
525+
<Rectangle radiusBottomRight={-30} width={50} height={50} />,
526+
{unstable_isConcurrent: true},
527+
);
528+
});
498529
expect(rectangle.toJSON()).toMatchSnapshot();
499530
});
500531

501-
it('should generate a <Shape> with a radius property of 0 when bottom left radius prop is negative', () => {
502-
const rectangle = ReactTestRenderer.create(
503-
<Rectangle radiusBottomLeft={-25} width={50} height={50} />,
504-
);
532+
it('should generate a <Shape> with a radius property of 0 when bottom left radius prop is negative', async () => {
533+
let rectangle;
534+
await act(() => {
535+
rectangle = ReactTestRenderer.create(
536+
<Rectangle radiusBottomLeft={-25} width={50} height={50} />,
537+
{unstable_isConcurrent: true},
538+
);
539+
});
505540
expect(rectangle.toJSON()).toMatchSnapshot();
506541
});
507542

508-
it('should generate a <Shape> where top radius is 0 if the sum of the top radius is greater than width', () => {
509-
const rectangle = ReactTestRenderer.create(
510-
<Rectangle
511-
radiusTopRight={25}
512-
radiusTopLeft={26}
513-
width={50}
514-
height={40}
515-
/>,
516-
);
543+
it('should generate a <Shape> where top radius is 0 if the sum of the top radius is greater than width', async () => {
544+
let rectangle;
545+
await act(() => {
546+
rectangle = ReactTestRenderer.create(
547+
<Rectangle
548+
radiusTopRight={25}
549+
radiusTopLeft={26}
550+
width={50}
551+
height={40}
552+
/>,
553+
{unstable_isConcurrent: true},
554+
);
555+
});
517556
expect(rectangle.toJSON()).toMatchSnapshot();
518557
});
519558

520-
it('should generate a <Shape> with props for drawing the Wedge', () => {
521-
const wedge = ReactTestRenderer.create(
522-
<Wedge outerRadius={50} startAngle={0} endAngle={360} fill="blue" />,
523-
);
559+
it('should generate a <Shape> with props for drawing the Wedge', async () => {
560+
let wedge;
561+
await act(() => {
562+
wedge = ReactTestRenderer.create(
563+
<Wedge outerRadius={50} startAngle={0} endAngle={360} fill="blue" />,
564+
{unstable_isConcurrent: true},
565+
);
566+
});
524567
expect(wedge.toJSON()).toMatchSnapshot();
525568
});
526569

527-
it('should return null if startAngle equals to endAngle on Wedge', () => {
528-
const wedge = ReactTestRenderer.create(
529-
<Wedge outerRadius={50} startAngle={0} endAngle={0} fill="blue" />,
530-
);
570+
it('should return null if startAngle equals to endAngle on Wedge', async () => {
571+
let wedge;
572+
await act(() => {
573+
wedge = ReactTestRenderer.create(
574+
<Wedge outerRadius={50} startAngle={0} endAngle={0} fill="blue" />,
575+
{unstable_isConcurrent: true},
576+
);
577+
});
531578
expect(wedge.toJSON()).toBeNull();
532579
});
533580
});

0 commit comments

Comments
 (0)