import React from 'react';
import { render, cleanup } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';

import { getNavigationModule } from '~tests/factories/sections/navigation.factory';
import LinkList from '.';

describe('Link List Component', () => {
  test('render multiple lists', () => {
    const links = getNavigationModule(2, true);

    const { getByText } = render(<LinkList lists={links} />);
    expect(getByText('title nav_1_1')).toBeTruthy();
    expect(getByText('submenu nav_1_1').closest('a').getAttribute('href')).toEqual(
      '/submenu_nav_1_1'
    );
    expect(getByText('title nav_1_1').closest('ul').children.length).toBe(2);
    expect(getByText('title nav_1_2')).toBeTruthy();
    expect(getByText('submenu nav_1_2').closest('a').getAttribute('href')).toEqual(
      '/submenu_nav_1_2'
    );
    expect(getByText('title nav_1_2').closest('ul').children.length).toBe(2);
  });
  const links = getNavigationModule(4);
  test('render single list', () => {
    const { getByText } = render(<LinkList lists={links} singleList />);

    expect(getByText('title nav_1_1')).toBeTruthy();
    expect(getByText('title nav_1_1').closest('a').getAttribute('href')).toEqual('/menu_nav_1_1');
    expect(getByText('title nav_1_2')).toBeTruthy();
    expect(getByText('title nav_1_2').closest('a').getAttribute('href')).toEqual('/menu_nav_1_2');
    expect(getByText('title nav_1_3')).toBeTruthy();
    expect(getByText('title nav_1_3').closest('a').getAttribute('href')).toEqual('/menu_nav_1_3');
    expect(getByText('title nav_1_4')).toBeTruthy();
    expect(getByText('title nav_1_4').closest('a').getAttribute('href')).toEqual('/menu_nav_1_4');
  });

  test('render image list', () => {
    const { getByTitle } = render(<LinkList lists={links} singleList imageOnly />);

    expect(getByTitle('title nav_1_1')).toBeTruthy();
    expect(getByTitle('title nav_1_2')).toBeTruthy();
    expect(getByTitle('title nav_1_3')).toBeTruthy();
    expect(getByTitle('title nav_1_4')).toBeTruthy();
  });
});
afterEach(() => {
  cleanup();
});
