Testing Improvement

Button.test.tsx

import {render,fireEvent} from './custom-rtl'

describe('Outlined Button', (): void => {
  test('Size of button should render correctly for variant outlined', (): void => {
    const { container } = render(
      <ButtonOutlined color="grey">
        <SvgClose /> Text does not matter
      </ButtonOutlined>
    );

    expect(container.firstChild).toHaveStyleRule('min-height', '2.25rem');
  });
});

test('Button component should pass down an onClick function', (): void => {
  const testClick = jest.fn();
  const { getByText } = render(<ButtonText onClick={testClick}>Click Me</ButtonText>);

  fireEvent.click(getByText(/Click Me/i));
  expect(testClick).toHaveBeenCalled();
});

custom-rtl.tsx

import React from 'react';
import { render as rtlRender } from '@testing-library/react';
import NdsThemeProvider from '../../Theme/NdsThemeProvider';

function render(ui, {theme='blue', ...options} = {}) {
  const Wrapper = ({children}) => (
    <NdsThemeProvider theme={theme}>{children}</NdsThemeProvider>
  )

  return rtlRender(ui, {wrapper: Wrapper, ...options})
}

export * from '@testing-library/react';

// override all test with our custom render function
export { render };