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

import '~tests/helpers/match-media.mock';
import { getListCarouselItem } from '~tests/factories/modules/carousel.factory';
import Anchor from '.';

describe('Anchor Component', () => {
  test('render with props', () => {
    const module = getListCarouselItem(2);
    const { container, getByText } = render(<Anchor module={module} headerOffset={90} />);
    expect(container.querySelectorAll('a')).toHaveLength(2);
    expect(getByText('label-1')).toBeTruthy();
    expect(getByText('label-2')).toBeTruthy();
    expect(getByText('label-2').getAttribute('href')).toEqual('#label2');
  });
  test('on click', async () => {
    const module = getListCarouselItem(4);
    const { getByText } = render(
      <>
        <Anchor module={module} headerOffset={90} />
        <div id="label-1" style={{ marginTop: '1000px' }}>
          hjbihi
        </div>
      </>
    );
    const scrollToSpy = jest.fn();
    window.scrollTo = scrollToSpy;
    expect(getByText('label-1')).toBeTruthy();
    fireEvent.mouseDown(getByText('label-1'));
    fireEvent.click(getByText('label-1'));
  });
});
afterEach(() => {
  cleanup();
});
