@eureca/eureca-ui/src/components/TrackNavigationSideBar/__tests__/track-navigation-sidebar.test.js

UI component library of Eureca's user and admin apps

import React from 'react';
import {
  FiLayers,
  FiTarget,
  FiMic,
  FiAward,
  FiMinimize2,
  FiPaperclip,
  FiVideo,
  FiEdit,
} from 'react-icons/fi';

import { TrackNavigationSideBar } from '..';

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

const dataModules = [
  {
    id: 1,
    done: true,
    type: 'form',
    title: 'Comece por aqui.',
    icon: <FiEdit />,
  },
  {
    id: 2,
    done: true,
    type: 'fit',
    title: 'Fit Cultural',
    icon: <FiMinimize2 />,
  },
  {
    id: 3,
    done: true,
    type: 'video',
    title: 'Desafio #1 | Conta pra mim...',
    icon: <FiVideo />,
  },
  {
    id: 4,
    done: false,
    type: 'pdf',
    title: 'Desafio #2 | Energia limpa para que te quero',
    icon: <FiPaperclip />,
  },
];

const data = [
  {
    id: 1,
    type: 'online',
    title: 'Online',
    icon: <FiLayers />,
    finished: true,
    disabled: false,
    modules: dataModules,
  },
  {
    id: 2,
    type: 'presencial',
    title: 'Presencial',
    icon: <FiTarget />,
    finished: false,
    disabled: false,
    modules: dataModules,
  },
  {
    id: 3,
    type: 'entrevista',
    title: 'Entrevista',
    icon: <FiMic />,
    finished: true,
    disabled: false,
    modules: dataModules,
  },
  {
    id: 4,
    type: 'resultados',
    title: 'Resultados',
    icon: <FiAward />,
    finished: false,
    disabled: true,
    modules: dataModules,
  },
];

function renderComponent(props) {
  return render(<TrackNavigationSideBar {...props} />);
}

describe('Track Navigation Sidebar component', () => {
  it('has a sentence matching the expected = Módulo + (index+1): + nome', () => {
    const { getAllByText } = renderComponent({ data });
    // find 'Módulo' with a regex and expect it to have the complete sentence
    const modules = getAllByText(/\bMódulo\b/);
    expect(modules[0].textContent).toBe('Módulo 1: Comece por aqui.');
    expect(modules[1].textContent).toBe('Módulo 2: Fit Cultural');
    expect(modules[2].textContent).toBe('Módulo 3: Desafio #1 | Conta pra mim...');
    expect(modules[3].textContent).toBe('Módulo 4: Desafio #2 | Energia limpa para que te quero');
  });

  it('should render a tag when the item is finished', () => {
    const { getAllByText } = renderComponent({ data });
    const tags = getAllByText('Encerrada');
    expect(tags.length).toBe(2);
  });
});