diff --git a/src/components/expandableGroup/tests/ExpandableGroup.test.tsx b/src/components/expandableGroup/tests/ExpandableGroup.test.tsx new file mode 100644 index 00000000..e819f302 --- /dev/null +++ b/src/components/expandableGroup/tests/ExpandableGroup.test.tsx @@ -0,0 +1,46 @@ +/* + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at https://mozilla.org/MPL/2.0/. + */ + +import userEvent from '@testing-library/user-event'; +import { render, screen } from '@testing-library/react'; +import { ExpandableGroup } from '../ExpandableGroup'; + +describe('ExpandableGroup', () => { + it('renders the header correctly', () => { + const headerText = 'Test Header'; + render({headerText}} />); + const headerElement = screen.getByText(headerText); + expect(headerElement).toBeInTheDocument(); + }); + + it('renders the children when expanded', () => { + const childrenText = 'Test Children'; + render( + Header}> +
{childrenText}
+
+ ); + const childrenElement = screen.getByText(childrenText); + expect(childrenElement).toBeInTheDocument(); + }); + + it('expands and collapses when clicked', async () => { + const user = userEvent.setup(); + const headerText = 'Test Header'; + const childrenText = 'Test Children'; + render( + {headerText}}> +
{childrenText}
+
+ ); + const accordionSummary = screen.getByText(headerText); + const childrenTextDiv = screen.getByText(childrenText); + expect(childrenTextDiv).not.toBeVisible(); + + await user.click(accordionSummary); + expect(childrenTextDiv).toBeVisible(); + }); +});