@eureca/eureca-ui/src/components/Tabs/__tests__/icon-tabs.test.js

UI component library of Eureca's user and admin apps

import React from 'react';

import { IconTabs as Tabs } from '../icon-tabs';

import { render, fireEvent } from '@testing-library/react';

function renderIconTabs({ tabs, ...props }) {
  return render(<Tabs {...props}>{tabs}</Tabs>);
}

const fasesOptions = [
  { value: 1, label: 'Online', disabled: false },
  { value: 2, label: 'Presencial', disabled: false },
  { value: 3, label: 'Entrevista', disabled: true },
  { value: 4, label: 'Resultados', disabled: false },
];

const tabsContent = [
  <div key={1}> Conteúdo Online </div>,
  <div key={2}> Conteúdo Presencial </div>,
  <div key={3}> Conteúdo Entrevistas </div>,
  <div key={4}> Conteúdo Resultados </div>,
];

const onChangeHandler = jest.fn().mockImplementation(v => v);

describe('Icon Tabs', () => {
  it('renders component with tabs defined via props', () => {
    const { getByText } = renderIconTabs({
      items: fasesOptions,
      current: 1,
      onChange: onChangeHandler,
      tabs: tabsContent,
    });

    expect(getByText('Online')).toBeDefined();
    expect(getByText('Presencial')).toBeDefined();
    expect(getByText('Entrevista')).toBeDefined();
    expect(getByText('Resultados')).toBeDefined();
  });

  it('dont call the function when the tab is disabled', () => {
    const { getByTestId } = renderIconTabs({
      items: fasesOptions,
      current: 1,
      onChange: onChangeHandler,
      tabs: tabsContent,
    });

    fireEvent.click(getByTestId('iconTabsTab-3').firstChild);
    expect(onChangeHandler).not.toBeCalled();
  });

  it('call the function and return the tab value to update', () => {
    const { getByTestId } = renderIconTabs({
      items: fasesOptions,
      current: 1,
      onChange: onChangeHandler,
      tabs: tabsContent,
    });

    fireEvent.click(getByTestId('iconTabsTab-2').firstChild);
    expect(onChangeHandler).toReturnWith(2);
    fireEvent.click(getByTestId('iconTabsTab-4').firstChild);
    expect(onChangeHandler).toReturnWith(4);
    fireEvent.click(getByTestId('iconTabsTab-1').firstChild);
    expect(onChangeHandler).toReturnWith(1);
  });
});