Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Concurrent rendering for ReactART-test #28521

Merged
merged 3 commits into from
Mar 18, 2024
Merged

Concurrent rendering for ReactART-test #28521

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
6a92974
Concurrent rendering for ReactART-test
Mar 7, 2024
bbd13ff
f
Mar 11, 2024
525d5fd
Move comment
Mar 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
157 changes: 102 additions & 55 deletions packages/react-art/src/__tests__/ReactART-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,13 +24,8 @@ import Wedge from 'react-art/Wedge';

// Isolate DOM renderer.
jest.resetModules();

const ReactDOMClient = require('react-dom/client');
const act = require('internal-test-utils').act;

// Isolate test renderer.
eps1lon marked this conversation as resolved.
Show resolved Hide resolved
jest.resetModules();
const ReactTestRenderer = require('react-test-renderer');
let act = require('internal-test-utils').act;

// Isolate the noop renderer
jest.resetModules();
Expand Down Expand Up @@ -449,85 +444,137 @@ describe('ReactART', () => {
});

describe('ReactARTComponents', () => {
it('should generate a <Shape> with props for drawing the Circle', () => {
const circle = ReactTestRenderer.create(
<Circle radius={10} stroke="green" strokeWidth={3} fill="blue" />,
);
let ReactTestRenderer;
beforeEach(() => {
jest.resetModules();
// Isolate test renderer.
ReactTestRenderer = require('react-test-renderer');
act = require('internal-test-utils').act;
});

it('should generate a <Shape> with props for drawing the Circle', async () => {
let circle;
await act(() => {
circle = ReactTestRenderer.create(
<Circle radius={10} stroke="green" strokeWidth={3} fill="blue" />,
{unstable_isConcurrent: true},
);
});
expect(circle.toJSON()).toMatchSnapshot();
});

it('should generate a <Shape> with props for drawing the Rectangle', () => {
const rectangle = ReactTestRenderer.create(
<Rectangle width={50} height={50} stroke="green" fill="blue" />,
);
it('should generate a <Shape> with props for drawing the Rectangle', async () => {
let rectangle;
await act(() => {
rectangle = ReactTestRenderer.create(
<Rectangle width={50} height={50} stroke="green" fill="blue" />,
{unstable_isConcurrent: true},
);
});
expect(rectangle.toJSON()).toMatchSnapshot();
});

it('should generate a <Shape> with positive width when width prop is negative', () => {
const rectangle = ReactTestRenderer.create(
<Rectangle width={-50} height={50} />,
);
it('should generate a <Shape> with positive width when width prop is negative', async () => {
let rectangle;
await act(() => {
rectangle = ReactTestRenderer.create(
<Rectangle width={-50} height={50} />,
{unstable_isConcurrent: true},
);
});
expect(rectangle.toJSON()).toMatchSnapshot();
});

it('should generate a <Shape> with positive height when height prop is negative', () => {
const rectangle = ReactTestRenderer.create(
<Rectangle height={-50} width={50} />,
);
it('should generate a <Shape> with positive height when height prop is negative', async () => {
let rectangle;
await act(() => {
rectangle = ReactTestRenderer.create(
<Rectangle height={-50} width={50} />,
{unstable_isConcurrent: true},
);
});
expect(rectangle.toJSON()).toMatchSnapshot();
});

it('should generate a <Shape> with a radius property of 0 when top left radius prop is negative', () => {
const rectangle = ReactTestRenderer.create(
<Rectangle radiusTopLeft={-25} width={50} height={50} />,
);
it('should generate a <Shape> with a radius property of 0 when top left radius prop is negative', async () => {
let rectangle;
await act(() => {
rectangle = ReactTestRenderer.create(
<Rectangle radiusTopLeft={-25} width={50} height={50} />,
{unstable_isConcurrent: true},
);
});
expect(rectangle.toJSON()).toMatchSnapshot();
});

it('should generate a <Shape> with a radius property of 0 when top right radius prop is negative', () => {
const rectangle = ReactTestRenderer.create(
<Rectangle radiusTopRight={-25} width={50} height={50} />,
);
it('should generate a <Shape> with a radius property of 0 when top right radius prop is negative', async () => {
let rectangle;
await act(() => {
rectangle = ReactTestRenderer.create(
<Rectangle radiusTopRight={-25} width={50} height={50} />,
{unstable_isConcurrent: true},
);
});
expect(rectangle.toJSON()).toMatchSnapshot();
});

it('should generate a <Shape> with a radius property of 0 when bottom right radius prop is negative', () => {
const rectangle = ReactTestRenderer.create(
<Rectangle radiusBottomRight={-30} width={50} height={50} />,
);
it('should generate a <Shape> with a radius property of 0 when bottom right radius prop is negative', async () => {
let rectangle;
await act(() => {
rectangle = ReactTestRenderer.create(
<Rectangle radiusBottomRight={-30} width={50} height={50} />,
{unstable_isConcurrent: true},
);
});
expect(rectangle.toJSON()).toMatchSnapshot();
});

it('should generate a <Shape> with a radius property of 0 when bottom left radius prop is negative', () => {
const rectangle = ReactTestRenderer.create(
<Rectangle radiusBottomLeft={-25} width={50} height={50} />,
);
it('should generate a <Shape> with a radius property of 0 when bottom left radius prop is negative', async () => {
let rectangle;
await act(() => {
rectangle = ReactTestRenderer.create(
<Rectangle radiusBottomLeft={-25} width={50} height={50} />,
{unstable_isConcurrent: true},
);
});
expect(rectangle.toJSON()).toMatchSnapshot();
});

it('should generate a <Shape> where top radius is 0 if the sum of the top radius is greater than width', () => {
const rectangle = ReactTestRenderer.create(
<Rectangle
radiusTopRight={25}
radiusTopLeft={26}
width={50}
height={40}
/>,
);
it('should generate a <Shape> where top radius is 0 if the sum of the top radius is greater than width', async () => {
let rectangle;
await act(() => {
rectangle = ReactTestRenderer.create(
<Rectangle
radiusTopRight={25}
radiusTopLeft={26}
width={50}
height={40}
/>,
{unstable_isConcurrent: true},
);
});
expect(rectangle.toJSON()).toMatchSnapshot();
});

it('should generate a <Shape> with props for drawing the Wedge', () => {
const wedge = ReactTestRenderer.create(
<Wedge outerRadius={50} startAngle={0} endAngle={360} fill="blue" />,
);
it('should generate a <Shape> with props for drawing the Wedge', async () => {
let wedge;
await act(() => {
wedge = ReactTestRenderer.create(
<Wedge outerRadius={50} startAngle={0} endAngle={360} fill="blue" />,
{unstable_isConcurrent: true},
);
});
expect(wedge.toJSON()).toMatchSnapshot();
});

it('should return null if startAngle equals to endAngle on Wedge', () => {
const wedge = ReactTestRenderer.create(
<Wedge outerRadius={50} startAngle={0} endAngle={0} fill="blue" />,
);
it('should return null if startAngle equals to endAngle on Wedge', async () => {
let wedge;
await act(() => {
wedge = ReactTestRenderer.create(
<Wedge outerRadius={50} startAngle={0} endAngle={0} fill="blue" />,
{unstable_isConcurrent: true},
);
});
expect(wedge.toJSON()).toBeNull();
});
});