import { render } from '../../../utils/theme-render-wrapper';
import sample from 'lodash/sample';
import { BrowserRouter } from 'react-router-dom';

import { LinksList } from './links-list';

const title = 'title';
const links = [
  { href: '/', children: 'link1' },
  { href: '/', children: 'link2' },
  { href: '/', children: 'link3' },
  { href: 'http://www.google.com', children: 'link4' }
];
const defaultProps = {
  title,
  links
};

const Wrapper = () => {
  return (
    <BrowserRouter>
      <LinksList {...defaultProps} />
    </BrowserRouter>
  );
};

describe('<LinksList />', () => {
  it('should render title correctly', () => {
    const { queryByText } = render(<Wrapper />);
    const el = queryByText(title);
    expect(el).toBeTruthy();
  });

  it('should render links correctly', () => {
    const link = sample(links) as (typeof links)[number];
    const { queryByText } = render(<Wrapper />);
    const el = queryByText(link?.children);
    expect(el?.getAttribute('href')).toBe(link.href);
  });
});