1 | import React from 'react';
|
2 | import { render, screen } from '@testing-library/react';
|
3 | import '@testing-library/jest-dom';
|
4 | import { AccordionBody, AccordionContext } from '..';
|
5 | import { testForCustomClass } from '../testUtils';
|
6 |
|
7 | describe('AccordionBody', () => {
|
8 | it('should render with "accordion-body" class within "accordion-collapse', () => {
|
9 | render(
|
10 | <AccordionBody accordionId="cool-accordion" data-testid="accordion-body">
|
11 | accordion body
|
12 | </AccordionBody>,
|
13 | );
|
14 |
|
15 | expect(screen.getByTestId('accordion-body')).toHaveClass(
|
16 | 'accordion-collapse',
|
17 | );
|
18 | expect(screen.getByText(/accordion body/i)).toHaveClass('accordion-body');
|
19 | });
|
20 |
|
21 | it('should render additional classes', () => {
|
22 | testForCustomClass(AccordionBody, { accordionId: '1' });
|
23 | });
|
24 |
|
25 | it('should render custom tag', () => {
|
26 | render(
|
27 | <AccordionBody accordionId="cool-accordion" tag="h1">
|
28 | accordion body
|
29 | </AccordionBody>,
|
30 | );
|
31 |
|
32 | expect(screen.getByText(/accordion body/i).tagName).toMatch(/h1/i);
|
33 | });
|
34 |
|
35 | it('should be open if open == id', () => {
|
36 | render(
|
37 | <AccordionContext.Provider value={{ open: 'cool-accordion' }}>
|
38 | <AccordionBody
|
39 | accordionId="cool-accordion"
|
40 | data-testid="accordion-body-1"
|
41 | />
|
42 | <AccordionBody
|
43 | accordionId="not-cool-accordion"
|
44 | data-testid="accordion-body-2"
|
45 | />
|
46 | </AccordionContext.Provider>,
|
47 | );
|
48 |
|
49 | expect(screen.getByTestId('accordion-body-1')).toHaveClass('show');
|
50 | expect(screen.getByTestId('accordion-body-2')).not.toHaveClass('show');
|
51 | });
|
52 | });
|