diff --git a/test/visits/charts/ChartCard.test.tsx b/test/visits/charts/ChartCard.test.tsx
index c9745e59..fce343a2 100644
--- a/test/visits/charts/ChartCard.test.tsx
+++ b/test/visits/charts/ChartCard.test.tsx
@@ -1,46 +1,22 @@
import { ReactNode } from 'react';
-import { shallow, ShallowWrapper } from 'enzyme';
-import { Card, CardBody, CardHeader, CardFooter } from 'reactstrap';
+import { render, screen } from '@testing-library/react';
import { ChartCard } from '../../../src/visits/charts/ChartCard';
describe('', () => {
- let wrapper: ShallowWrapper;
- const createWrapper = (title: Function | string = '', footer?: ReactNode) => {
- wrapper = shallow();
-
- return wrapper;
- };
-
- afterEach(() => wrapper?.unmount());
-
- it('renders expected components', () => {
- const wrapper = createWrapper();
- const card = wrapper.find(Card);
- const header = wrapper.find(CardHeader);
- const body = wrapper.find(CardBody);
- const footer = wrapper.find(CardFooter);
-
- expect(card).toHaveLength(1);
- expect(header).toHaveLength(1);
- expect(body).toHaveLength(1);
- expect(footer).toHaveLength(0);
- });
+ const setUp = (title: Function | string = '', footer?: ReactNode) => render(
+ ,
+ );
it.each([
['the title', 'the title'],
[() => 'the title from func', 'the title from func'],
])('properly renders title by parsing provided value', (title, expectedTitle) => {
- const wrapper = createWrapper(title);
- const header = wrapper.find(CardHeader);
-
- expect(header.html()).toContain(expectedTitle);
+ setUp(title);
+ expect(screen.getByText(expectedTitle)).toBeInTheDocument();
});
it('renders footer only when provided', () => {
- const wrapper = createWrapper('', 'the footer');
- const footer = wrapper.find(CardFooter);
-
- expect(footer).toHaveLength(1);
- expect(footer.html()).toContain('the footer');
+ setUp('', 'the footer');
+ expect(screen.getByText('the footer')).toBeInTheDocument();
});
});