41 lines
1.3 KiB
TypeScript
41 lines
1.3 KiB
TypeScript
|
import React from 'react';
|
||
|
|
import { render } from '@/components/testUtils';
|
||
|
|
import { HorizontalSpacer, VerticalSpacer } from '@/components/shared/Spacers';
|
||
|
|
import { theme } from '@/app/shared/theme';
|
||
|
|
|
||
|
|
describe('[Component] Spacers', () => {
|
||
|
|
test('renders Vertical correctly', () => {
|
||
|
|
const component = render(
|
||
|
|
<VerticalSpacer heightUnits={3} testID="vertical-spacer" />
|
||
|
|
);
|
||
|
|
|
||
|
|
expect(component).toMatchSnapshot();
|
||
|
|
});
|
||
|
|
|
||
|
|
test('renders HorizontalSpacer correctly', () => {
|
||
|
|
const component = render(
|
||
|
|
<HorizontalSpacer widthUnits={3} testID="horizontal-spacer" />
|
||
|
|
);
|
||
|
|
|
||
|
|
expect(component).toMatchSnapshot();
|
||
|
|
});
|
||
|
|
|
||
|
|
test('applies correct height for VerticalSpacer based on heightUnits', () => {
|
||
|
|
const { getByTestId } = render(
|
||
|
|
<VerticalSpacer heightUnits={3} testID="vertical-spacer" />
|
||
|
|
);
|
||
|
|
|
||
|
|
const spacer = getByTestId('vertical-spacer');
|
||
|
|
expect(spacer).toHaveStyle({ height: theme.layout.gridUnit * 3 });
|
||
|
|
});
|
||
|
|
|
||
|
|
test('applies correct width for HorizontalSpacer based on widthUnits', () => {
|
||
|
|
const { getByTestId } = render(
|
||
|
|
<HorizontalSpacer widthUnits={4} testID="horizontal-spacer" />
|
||
|
|
);
|
||
|
|
|
||
|
|
const spacer = getByTestId('horizontal-spacer');
|
||
|
|
expect(spacer).toHaveStyle({ width: theme.layout.gridUnit * 4 });
|
||
|
|
});
|
||
|
|
});
|