2025-10-16 17:57:23 +02:00
|
|
|
import { render } from '@testing-library/preact';
|
|
|
|
|
import { describe, expect, it } from 'vitest';
|
|
|
|
|
import { House, LucideProvider } from '../src/lucide-preact';
|
2025-07-04 16:00:55 +02:00
|
|
|
|
|
|
|
|
describe('Using LucideProvider', () => {
|
|
|
|
|
it('should render the icon with LucideProvider', () => {
|
|
|
|
|
const { container } = render(
|
|
|
|
|
<LucideProvider
|
|
|
|
|
size={48}
|
|
|
|
|
color="red"
|
|
|
|
|
>
|
2025-10-16 17:57:23 +02:00
|
|
|
<House />
|
|
|
|
|
</LucideProvider>,
|
2025-07-04 16:00:55 +02:00
|
|
|
);
|
|
|
|
|
|
|
|
|
|
expect(container.firstChild).toMatchSnapshot();
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
it('should render the icon with LucideProvider and custom strokeWidth', () => {
|
|
|
|
|
const { container } = render(
|
|
|
|
|
<LucideProvider
|
|
|
|
|
size={48}
|
|
|
|
|
color="red"
|
|
|
|
|
strokeWidth={4}
|
|
|
|
|
>
|
2025-10-16 17:57:23 +02:00
|
|
|
<House />
|
|
|
|
|
</LucideProvider>,
|
2025-07-04 16:00:55 +02:00
|
|
|
);
|
|
|
|
|
|
|
|
|
|
const IconComponent = container.firstElementChild;
|
|
|
|
|
|
|
|
|
|
expect(IconComponent).toHaveAttribute('width', '48');
|
|
|
|
|
expect(IconComponent).toHaveAttribute('height', '48');
|
|
|
|
|
expect(IconComponent).toHaveAttribute('stroke', 'red');
|
|
|
|
|
expect(IconComponent).toHaveAttribute('stroke-width', '4');
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
it('should render the icon with LucideProvider and custom absoluteStrokeWidth', () => {
|
|
|
|
|
const { container } = render(
|
|
|
|
|
<LucideProvider
|
|
|
|
|
size={48}
|
|
|
|
|
color="red"
|
|
|
|
|
absoluteStrokeWidth
|
|
|
|
|
>
|
2025-10-16 17:57:23 +02:00
|
|
|
<House />
|
|
|
|
|
</LucideProvider>,
|
2025-07-04 16:00:55 +02:00
|
|
|
);
|
|
|
|
|
|
|
|
|
|
const IconComponent = container.firstElementChild;
|
|
|
|
|
|
|
|
|
|
expect(IconComponent).toHaveAttribute('stroke-width', '1');
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
it('should render override the providers global props when passed props to the icon', () => {
|
|
|
|
|
const { container } = render(
|
|
|
|
|
<LucideProvider
|
|
|
|
|
size={48}
|
|
|
|
|
color="red"
|
|
|
|
|
strokeWidth={4}
|
|
|
|
|
>
|
|
|
|
|
<House
|
|
|
|
|
size={24}
|
|
|
|
|
color="blue"
|
|
|
|
|
strokeWidth={2}
|
|
|
|
|
/>
|
2025-10-16 17:57:23 +02:00
|
|
|
</LucideProvider>,
|
2025-07-04 16:00:55 +02:00
|
|
|
);
|
|
|
|
|
|
|
|
|
|
const IconComponent = container.firstElementChild;
|
|
|
|
|
|
|
|
|
|
expect(IconComponent).toHaveAttribute('width', '24');
|
|
|
|
|
expect(IconComponent).toHaveAttribute('height', '24');
|
|
|
|
|
expect(IconComponent).toHaveAttribute('stroke', 'blue');
|
|
|
|
|
expect(IconComponent).toHaveAttribute('stroke-width', '2');
|
2025-10-16 17:57:23 +02:00
|
|
|
});
|
|
|
|
|
});
|