@kadconsulting/dry
Version:
KAD Reusable Component Library
62 lines • 2.9 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import Icon from './Icon';
import { IconSizes } from './IconTypes';
import { Activity } from '../paths/Activity';
import { useEffect, useRef, useState } from 'react';
import { render, screen, waitFor } from '@testing-library/react';
describe('Icon', () => {
it('renders with a dry-prepended className', () => {
// ARRANGE
const { container } = render(_jsx(Icon, { size: IconSizes.SMALL, Path: Activity }));
// ASSERT
expect(Array.from(container.firstElementChild?.classList ?? []).includes('dry-icon')).toBeTruthy();
});
it('passes a ref to its outermost element', async () => {
// ARRANGE
const Wrapper = () => {
const ref = useRef(null);
const [refWasPassed, setRefWasPassed] = useState(false);
useEffect(() => {
setRefWasPassed(!!ref.current);
}, []);
return (_jsxs(_Fragment, { children: [_jsx(Icon, { Path: Activity, size: IconSizes.SMALL, ref: ref }), refWasPassed && _jsx("div", { children: "Ref was passed!" })] }));
};
render(_jsx(Wrapper, {}));
// ASSERT
await waitFor(() => screen.getByText('Ref was passed!'));
});
it('renders the correct defaults', () => {
// ARRANGE
const { container } = render(_jsx(Icon, { Path: Activity }));
// ASSERT
expect(container.firstElementChild).toHaveAttribute('height', '50');
expect(container.firstElementChild).toHaveAttribute('width', '50');
});
/** All UntitledUI icons are designed to fit a 24 X 24 viewbox */
it('renders the correct viewBox', () => {
// ARRANGE
const { container } = render(_jsx(Icon, { Path: Activity }));
// ASSERT
expect(container.firstElementChild).toHaveAttribute('viewBox', '0 0 24 24');
});
it('renders the appropriate enumerated size', () => {
const sizes = [IconSizes.SMALL, IconSizes.MEDIUM, IconSizes.LARGE];
sizes.forEach((size) => {
// ARRANGE
const { container } = render(_jsx(Icon, { size: size, Path: Activity }));
// ASSERT
expect(container.firstElementChild).toHaveAttribute('height', size.toString());
expect(container.firstElementChild).toHaveAttribute('width', size.toString());
});
});
it('renders consumer-specified pixel width / height', () => {
const width = 16;
const height = 16;
// ARRANGE
const { container } = render(_jsx(Icon, { height: height, width: width, Path: Activity }));
// ASSERT
expect(container.firstElementChild).toHaveAttribute('height', height.toString());
expect(container.firstElementChild).toHaveAttribute('width', width.toString());
});
});
//# sourceMappingURL=Icon.test.js.map