From 3ff4c37a7a2c40340c17f9e6c1754444bce0f839 Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Tue, 31 Oct 2023 16:00:45 +0100 Subject: refactor(components): rewrite Modal component * add an optional close button * add an icon prop --- .../molecules/modals/modal/modal.test.tsx | 48 ++++++++++++++++++++++ 1 file changed, 48 insertions(+) create mode 100644 src/components/molecules/modals/modal/modal.test.tsx (limited to 'src/components/molecules/modals/modal/modal.test.tsx') diff --git a/src/components/molecules/modals/modal/modal.test.tsx b/src/components/molecules/modals/modal/modal.test.tsx new file mode 100644 index 0000000..82b7487 --- /dev/null +++ b/src/components/molecules/modals/modal/modal.test.tsx @@ -0,0 +1,48 @@ +import { describe, expect, it } from '@jest/globals'; +import { render, screen as rtlScreen } from '@testing-library/react'; +import { Heading, Icon } from '../../../atoms'; +import { Modal } from './modal'; + +const children = + 'Labore ullam delectus sit modi quam dolores. Ratione id sint aliquid facilis ipsum. Unde necessitatibus provident minus.'; + +describe('Modal', () => { + it('renders the modal contents', () => { + render({children}); + + expect(rtlScreen.getByText(children)).toBeInTheDocument(); + }); + + it('can render a heading', () => { + const heading = 'A custom heading'; + const level = 2; + + render( + {heading}}> + {children} + + ); + + expect(rtlScreen.getByRole('heading', { level })).toHaveTextContent( + heading + ); + }); + + it('can render an icon', () => { + const label = 'maxime ut eius'; + + render( + }>{children} + ); + + expect(rtlScreen.getByLabelText(label)).toBeInTheDocument(); + }); + + it('can render a close button', () => { + const btn = 'consequatur'; + + render({children}); + + expect(rtlScreen.getByRole('button', { name: btn })).toBeInTheDocument(); + }); +}); -- cgit v1.2.3