Skip to content

internal: Remove Enzyme from visx #1893

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.

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

Merged
merged 17 commits into from
Dec 18, 2024
Prev Previous commit
Next Next commit
one more pass
  • Loading branch information
williaster committed Dec 17, 2024
commit 8e1e47522c460db02ac042a99349adfbc681547f
54 changes: 40 additions & 14 deletions packages/visx-axis/test/AxisRight.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,9 +25,14 @@ describe('<AxisRight />', () => {
expect(AxisRight).toBeDefined();
});

it('should render with correct class names', () => {
it('should render with default props', () => {
const { container } = renderAxis();
expect(container.querySelector('.visx-axis-right')).toBeInTheDocument();
const axis = container.querySelector('.visx-axis-right');
expect(axis).toBeInTheDocument();

// Default props are reflected in rendered output
const ticks = container.querySelectorAll('.visx-axis-tick');
expect(ticks.length).toBeGreaterThan(0);
});

it('should apply custom class names', () => {
Expand All @@ -39,28 +44,16 @@ describe('<AxisRight />', () => {
};

const { container } = renderAxis(customProps);

expect(container.querySelector('.axis-test-class')).toBeInTheDocument();
expect(container.querySelector('.axisline-test-class')).toBeInTheDocument();
expect(container.querySelector('.tick-test-class')).toBeInTheDocument();
});

it('should render with default props', () => {
const { container } = renderAxis();
const axis = container.querySelector('.visx-axis-right');
expect(axis).toBeInTheDocument();

// Default props are reflected in rendered output
const ticks = container.querySelectorAll('.visx-axis-tick');
expect(ticks.length).toBeGreaterThan(0);
});

it('should render with custom props', () => {
const labelOffset = 3;
const tickLength = 15;

const { container } = renderAxis({ labelOffset, tickLength });

const axis = container.querySelector('.visx-axis-right');
expect(axis).toBeInTheDocument();

Expand All @@ -84,4 +77,37 @@ describe('<AxisRight />', () => {
const label = container.querySelector('text.visx-axis-label');
expect(label).toHaveAttribute('transform', 'rotate(90)');
});

it('should use default labelOffset of 36', () => {
const { container } = renderAxis({
label: 'Test Label',
});
const label = container.querySelector('.visx-axis-label');
expect(label?.getAttribute('y')).toBe('-44');
expect(label?.getAttribute('x')).toBe('5');
});

it('should apply custom labelOffset', () => {
const labelOffset = 3;
const { container } = renderAxis({
label: 'Test Label',
labelOffset,
});
const label = container.querySelector('.visx-axis-label');
expect(label?.getAttribute('y')).toBe('-11');
expect(label?.getAttribute('x')).toBe('5');
});

it('should use default tickLength', () => {
const { container } = renderAxis();
const tick = container.querySelector('.visx-axis-tick line');
expect(tick).toHaveAttribute('x2', '8');
});

it('should set custom tickLength', () => {
const tickLength = 15;
const { container } = renderAxis({ tickLength });
const tick = container.querySelector('.visx-axis-tick line');
expect(tick).toHaveAttribute('x2', `${tickLength}`);
});
});
1 change: 0 additions & 1 deletion packages/visx-group/test/Group.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ describe('<Group />', () => {
);
const group = container.querySelector('.visx-group');
expect(group).toBeInTheDocument();
expect(group?.getAttribute('class')).toBe('visx-group');
});

test('it should default props top=0 left=0', () => {
Expand Down
4 changes: 2 additions & 2 deletions packages/visx-marker/test/Arrow.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ describe('<MarkerArrow />', () => {
const { container } = render(
<svg>
<defs>
<MarkerArrow id="marker-circle-test" />
<MarkerArrow id="marker-arrow-test" />
</defs>
</svg>,
);
Expand All @@ -22,7 +22,7 @@ describe('<MarkerArrow />', () => {
const polyline = container.querySelector('polyline');

expect(marker).toBeInTheDocument();
expect(marker).toHaveAttribute('id', 'marker-circle-test');
expect(marker).toHaveAttribute('id', 'marker-arrow-test');
expect(polyline).toBeInTheDocument();
});

Expand Down
Loading