diff --git a/packages/react-core/src/components/Card/__tests__/CardSubtitle.test.tsx b/packages/react-core/src/components/Card/__tests__/CardSubtitle.test.tsx index 26eb5157b78..1a71e952344 100644 --- a/packages/react-core/src/components/Card/__tests__/CardSubtitle.test.tsx +++ b/packages/react-core/src/components/Card/__tests__/CardSubtitle.test.tsx @@ -1,16 +1,48 @@ import { render, screen } from '@testing-library/react'; import { CardSubtitle } from '../CardSubtitle'; +import styles from '@patternfly/react-styles/css/components/Card/card'; -describe('CardSubtitle', () => { - test('renders with PatternFly Core styles', () => { - const { asFragment } = render(text); - expect(asFragment()).toMatchSnapshot(); - }); +test('Renders without children', () => { + render( +
+ +
+ ); - test('extra props are spread to the root element', () => { - const testId = 'card-subtitle'; + expect(screen.getByTestId('container').firstChild).toBeVisible(); +}); + +test('Renders with children', () => { + render(Subtitle content); + + expect(screen.getByText('Subtitle content')).toBeInTheDocument(); +}); + +test(`Renders with class ${styles.cardSubtitle} by default`, () => { + render(Subtitle content); + + expect(screen.getByText('Subtitle content')).toHaveClass(styles.cardSubtitle, { exact: true }); +}); + +test('Renders with id when passed', () => { + render(Subtitle content); + + expect(screen.getByText('Subtitle content')).toHaveAttribute('id', 'subtitle-id'); +}); + +test('extra props are spread to the root element', () => { + const testId = 'card-subtitle'; + + render(); + expect(screen.getByTestId(testId)).toBeInTheDocument(); +}); + +test('Matches snapshot without children', () => { + const { asFragment } = render(); + expect(asFragment()).toMatchSnapshot(); +}); - render(); - expect(screen.getByTestId(testId)).toBeInTheDocument(); - }); +test('Matches snapshot with children', () => { + const { asFragment } = render(Subtitle content); + expect(asFragment()).toMatchSnapshot(); }); diff --git a/packages/react-core/src/components/Card/__tests__/CardTitle.test.tsx b/packages/react-core/src/components/Card/__tests__/CardTitle.test.tsx index b198310d73f..ff7b10cb055 100644 --- a/packages/react-core/src/components/Card/__tests__/CardTitle.test.tsx +++ b/packages/react-core/src/components/Card/__tests__/CardTitle.test.tsx @@ -1,21 +1,31 @@ import { render, screen } from '@testing-library/react'; import { CardTitle } from '../CardTitle'; -describe('CardTitle', () => { - test('renders with PatternFly Core styles', () => { - const { asFragment } = render(text); - expect(asFragment()).toMatchSnapshot(); - }); - - test('className is added to the root element', () => { - render(text); - expect(screen.getByText('text')).toHaveClass('extra-class'); - }); - - test('extra props are spread to the root element', () => { - const testId = 'card-header'; - - render(); - expect(screen.getByTestId(testId)).toBeInTheDocument(); - }); +test('Renders with custom class when passed', () => { + render(text); + expect(screen.getByText('text')).toHaveClass('extra-class'); +}); + +test('Does not render with card subtitle by default', () => { + render(text); + + expect(screen.queryByText('text')?.nextElementSibling).not.toBeInTheDocument(); +}); + +test('Renders with card subtitle when subtitle is passed', () => { + render(text); + + expect(screen.getByText('subtitle content')).toBeInTheDocument(); +}); + +test('extra props are spread to the root element', () => { + const testId = 'card-header'; + + render(); + expect(screen.getByTestId(testId)).toBeInTheDocument(); +}); + +test('Matches snapshot', () => { + const { asFragment } = render(text); + expect(asFragment()).toMatchSnapshot(); }); diff --git a/packages/react-core/src/components/Card/__tests__/__snapshots__/CardSubtitle.test.tsx.snap b/packages/react-core/src/components/Card/__tests__/__snapshots__/CardSubtitle.test.tsx.snap index 0ff2585ae23..c18b62ebd62 100644 --- a/packages/react-core/src/components/Card/__tests__/__snapshots__/CardSubtitle.test.tsx.snap +++ b/packages/react-core/src/components/Card/__tests__/__snapshots__/CardSubtitle.test.tsx.snap @@ -1,12 +1,21 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`CardSubtitle renders with PatternFly Core styles 1`] = ` +exports[`Matches snapshot with children 1`] = `
- text + Subtitle content
`; + +exports[`Matches snapshot without children 1`] = ` + +
+ +`; diff --git a/packages/react-core/src/components/Card/__tests__/__snapshots__/CardTitle.test.tsx.snap b/packages/react-core/src/components/Card/__tests__/__snapshots__/CardTitle.test.tsx.snap index 5b42c1101a6..2ba05091579 100644 --- a/packages/react-core/src/components/Card/__tests__/__snapshots__/CardTitle.test.tsx.snap +++ b/packages/react-core/src/components/Card/__tests__/__snapshots__/CardTitle.test.tsx.snap @@ -1,6 +1,6 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`CardTitle renders with PatternFly Core styles 1`] = ` +exports[`Matches snapshot 1`] = `
{ expect(screen.getByLabelText('list')).toHaveClass('data-list-custom'); }); +test(`Renders with class ${styles.modifiers.plain} when isPlain is true`, () => { + render(); + + expect(screen.getByLabelText('list')).toHaveClass(styles.modifiers.plain); +}); + test('Renders with a hidden input to improve a11y when onSelectableRowChange is passed', () => { render( {}}> diff --git a/packages/react-core/src/components/Tabs/__tests__/Tabs.test.tsx b/packages/react-core/src/components/Tabs/__tests__/Tabs.test.tsx index d668e1c77ab..5fd3a88b11c 100644 --- a/packages/react-core/src/components/Tabs/__tests__/Tabs.test.tsx +++ b/packages/react-core/src/components/Tabs/__tests__/Tabs.test.tsx @@ -166,6 +166,66 @@ test(`Does not render with class ${styles.modifiers.initializingAccent} when unc expect(screen.getByRole('region')).not.toHaveClass(styles.modifiers.initializingAccent); }); +test(`Renders with class ${styles.modifiers.nav} when isNav is true`, () => { + render( + + + Tab Content + + + ); + + expect(screen.getByRole('region')).toHaveClass(styles.modifiers.nav); +}); + +test(`Renders with div wrapper by default`, () => { + render( + + + Tab Content + + + ); + + expect(screen.queryByRole('navigation')).not.toBeInTheDocument(); +}); + +test(`Renders with nav wrapper when component="nav"`, () => { + render( + + + Tab Content + + + ); + + expect(screen.getByRole('navigation')).toBeInTheDocument(); +}); + +test(`Renders with nav wrapper when isNav is true`, () => { + render( + + + Tab Content + + + ); + + expect(screen.getByRole('navigation')).toBeInTheDocument(); +}); + +test(`Overrides isNav nav wrapper when component="div" is passed`, () => { + render( + + + Tab Content + + + ); + + expect(screen.queryByRole('navigation')).not.toBeInTheDocument(); +}); + test('should render simple tabs', () => { const { asFragment } = render( diff --git a/packages/react-core/src/components/Tabs/__tests__/__snapshots__/Tabs.test.tsx.snap b/packages/react-core/src/components/Tabs/__tests__/__snapshots__/Tabs.test.tsx.snap index c20a358a503..7a0666e5962 100644 --- a/packages/react-core/src/components/Tabs/__tests__/__snapshots__/Tabs.test.tsx.snap +++ b/packages/react-core/src/components/Tabs/__tests__/__snapshots__/Tabs.test.tsx.snap @@ -5,7 +5,7 @@ exports[`should render accessible tabs 1`] = `