update tests

Author: wise-king-sullyman

packages/react-core/src/components/Compass/__tests__/CompassNavContent.test.tsx

@@ -4,21 +4,25 @@ import styles from '@patternfly/react-styles/css/components/Compass/compass';
 
 test('Renders with children', () => {
   render(<CompassNavContent>Test content</CompassNavContent>);
+
   expect(screen.getByText('Test content')).toBeVisible();
 });
 
 test('Renders with custom class name when className prop is provided', () => {
   render(<CompassNavContent className="custom-class">Test</CompassNavContent>);
+
   expect(screen.getByText('Test')).toHaveClass('custom-class');
 });
 
 test(`Renders with default ${styles.compassNavContent} class`, () => {
   render(<CompassNavContent>Test</CompassNavContent>);
-  expect(screen.getByText('Test')).toHaveClass(styles.compassNavContent);
+
+  expect(screen.getByText('Test')).toHaveClass(styles.compassNavContent, { exact: true });
 });
 
 test('Renders with additional props spread to the component', () => {
   render(<CompassNavContent aria-label="Test label">Test</CompassNavContent>);
+
   expect(screen.getByText('Test')).toHaveAccessibleName('Test label');
 });
 
@@ -28,5 +32,6 @@ test('Matches the snapshot', () => {
       <div>Nav content wrapper</div>
     </CompassNavContent>
   );
+
   expect(asFragment()).toMatchSnapshot();
 });

packages/react-core/src/components/Compass/__tests__/CompassNavHome.test.tsx

@@ -5,57 +5,85 @@ import styles from '@patternfly/react-styles/css/components/Compass/compass';
 
 test('Renders with default aria-label', () => {
   render(<CompassNavHome />);
+
   expect(screen.getByRole('button', { name: 'Home' })).toBeVisible();
 });
 
 test('Renders with custom aria-label when provided', () => {
   render(<CompassNavHome aria-label="Custom home" />);
+
   expect(screen.getByRole('button', { name: 'Custom home' })).toBeVisible();
 });
 
-test('Renders with default tooltip content', () => {
+test('Renders with default tooltip content', async () => {
+  const user = userEvent.setup();
+
   render(<CompassNavHome />);
-  expect(screen.getByRole('button', { name: 'Home' })).toBeVisible();
+
+  const button = screen.getByRole('button');
+
+  user.hover(button);
+
+  await screen.findByRole('tooltip');
+
+  expect(screen.getByRole('tooltip')).toHaveTextContent('Home');
 });
 
-test('Renders with custom tooltip content when provided', () => {
+test('Renders with custom tooltip content when provided', async () => {
+  const user = userEvent.setup();
+
   render(<CompassNavHome tooltipContent="Custom tooltip" />);
-  expect(screen.getByRole('button', { name: 'Home' })).toBeVisible();
+
+  const button = screen.getByRole('button');
+
+  user.hover(button);
+
+  await screen.findByRole('tooltip');
+  expect(screen.getByRole('tooltip')).toHaveTextContent('Custom tooltip');
 });
 
 test('Renders with custom class name when className prop is provided', () => {
   const { container } = render(<CompassNavHome className="custom-class" />);
+
   expect(container.firstChild).toHaveClass('custom-class');
 });
 
 test(`Renders with default class`, () => {
   const { container } = render(<CompassNavHome />);
-  expect(container.firstChild).toHaveClass(styles.compassNav + '-home');
+
+  expect(container.firstChild).toHaveClass(styles.compassNav + '-home', { exact: true });
 });
 
 test('Calls onClick handler when button is clicked', async () => {
-  const onClick = jest.fn();
   const user = userEvent.setup();
+  const onClick = jest.fn();
+
   render(<CompassNavHome onClick={onClick} />);
 
   await user.click(screen.getByRole('button', { name: 'Home' }));
+
   expect(onClick).toHaveBeenCalledTimes(1);
 });
 
 test('Renders button with plain variant and circle shape', () => {
   render(<CompassNavHome />);
+
   const button = screen.getByRole('button', { name: 'Home' });
+
   expect(button).toHaveClass('pf-m-plain');
+  expect(button).toHaveClass('pf-m-circle');
 });
 
 test('Matches the snapshot', () => {
   const { asFragment } = render(<CompassNavHome />);
+
   expect(asFragment()).toMatchSnapshot();
 });
 
 test('Matches the snapshot with custom props', () => {
   const { asFragment } = render(
     <CompassNavHome aria-label="Custom home" tooltipContent="Go home" className="custom-class" />
   );
+
   expect(asFragment()).toMatchSnapshot();
 });

packages/react-core/src/components/Compass/__tests__/CompassNavMain.test.tsx

@@ -4,21 +4,25 @@ import styles from '@patternfly/react-styles/css/components/Compass/compass';
 
 test('Renders with children', () => {
   render(<CompassNavMain>Test content</CompassNavMain>);
+
   expect(screen.getByText('Test content')).toBeVisible();
 });
 
 test('Renders with custom class name when className prop is provided', () => {
   render(<CompassNavMain className="custom-class">Test</CompassNavMain>);
+
   expect(screen.getByText('Test')).toHaveClass('custom-class');
 });
 
 test(`Renders with default ${styles.compassNavMain} class`, () => {
   render(<CompassNavMain>Test</CompassNavMain>);
-  expect(screen.getByText('Test')).toHaveClass(styles.compassNavMain);
+
+  expect(screen.getByText('Test')).toHaveClass(styles.compassNavMain, { exact: true });
 });
 
 test('Renders with additional props spread to the component', () => {
   render(<CompassNavMain aria-label="Test label">Test</CompassNavMain>);
+
   expect(screen.getByText('Test')).toHaveAccessibleName('Test label');
 });
 
@@ -28,5 +32,6 @@ test('Matches the snapshot', () => {
       <div>Main tabs content</div>
     </CompassNavMain>
   );
+
   expect(asFragment()).toMatchSnapshot();
 });

packages/react-core/src/components/Compass/__tests__/CompassNavSearch.test.tsx

@@ -13,49 +13,75 @@ test('Renders with custom aria-label when provided', () => {
   expect(screen.getByRole('button', { name: 'Custom search' })).toBeVisible();
 });
 
-test('Renders with default tooltip content', () => {
+test('Renders with default tooltip content', async () => {
+  const user = userEvent.setup();
+
   render(<CompassNavSearch />);
-  expect(screen.getByRole('button', { name: 'Search' })).toBeVisible();
+
+  const button = screen.getByRole('button');
+
+  user.hover(button);
+
+  await screen.findByRole('tooltip');
+
+  expect(screen.getByRole('tooltip')).toHaveTextContent('Search');
 });
 
-test('Renders with custom tooltip content when provided', () => {
+test('Renders with custom tooltip content when provided', async () => {
+  const user = userEvent.setup();
+
   render(<CompassNavSearch tooltipContent="Custom tooltip" />);
-  expect(screen.getByRole('button', { name: 'Search' })).toBeVisible();
+
+  const button = screen.getByRole('button');
+
+  user.hover(button);
+
+  await screen.findByRole('tooltip');
+
+  expect(screen.getByRole('tooltip')).toHaveTextContent('Custom tooltip');
 });
 
 test('Renders with custom class name when className prop is provided', () => {
   const { container } = render(<CompassNavSearch className="custom-class" />);
+
   expect(container.firstChild).toHaveClass('custom-class');
 });
 
 test(`Renders with default class`, () => {
   const { container } = render(<CompassNavSearch />);
-  expect(container.firstChild).toHaveClass(styles.compassNav + '-search');
+
+  expect(container.firstChild).toHaveClass(styles.compassNav + '-search', { exact: true });
 });
 
 test('Calls onClick handler when button is clicked', async () => {
-  const onClick = jest.fn();
   const user = userEvent.setup();
+  const onClick = jest.fn();
+
   render(<CompassNavSearch onClick={onClick} />);
 
   await user.click(screen.getByRole('button', { name: 'Search' }));
+
   expect(onClick).toHaveBeenCalledTimes(1);
 });
 
 test('Renders button with plain variant and circle shape', () => {
   render(<CompassNavSearch />);
+
   const button = screen.getByRole('button', { name: 'Search' });
+
   expect(button).toHaveClass('pf-m-plain');
 });
 
 test('Matches the snapshot', () => {
   const { asFragment } = render(<CompassNavSearch />);
+
   expect(asFragment()).toMatchSnapshot();
 });
 
 test('Matches the snapshot with custom props', () => {
   const { asFragment } = render(
     <CompassNavSearch aria-label="Custom search" tooltipContent="Search content" className="custom-class" />
   );
+
   expect(asFragment()).toMatchSnapshot();
 });