import React from 'react';
import renderer from 'react-test-renderer';
import { render, fireEvent, screen, act } from '@testing-library/react';
import 'jest-styled-components';
import { Pagination } from '.';
import { CloseBtn } from '../CloseBtn';

it('renderizar página 1 (não tem voltar página)', () => {
   const tree = renderer
      .create(<Pagination total={20} perPage={2} currentPage={1} changePage={(page: number) => {}} />)
      .toJSON();
   expect(tree).toMatchSnapshot();
});

it('renderizar página 2 (tem voltar página)', () => {
   const tree = renderer
      .create(<Pagination total={20} perPage={2} currentPage={2} changePage={(page: number) => {}} />)
      .toJSON();
   expect(tree).toMatchSnapshot();
});

it('renderizar página 5 (centro da paginação)', () => {
   const tree = renderer
      .create(<Pagination total={20} perPage={2} currentPage={5} changePage={(page: number) => {}} />)
      .toJSON();
   expect(tree).toMatchSnapshot();
});

it('renderizar página 9 (tem avançar página)', () => {
   const tree = renderer
      .create(<Pagination total={20} perPage={2} currentPage={9} changePage={(page: number) => {}} />)
      .toJSON();
   expect(tree).toMatchSnapshot();
});

it('renderizar página 10 (não tem avançar página)', () => {
   const tree = renderer
      .create(<Pagination total={20} perPage={2} currentPage={10} changePage={(page: number) => {}} />)
      .toJSON();
   expect(tree).toMatchSnapshot();
});

it('testar changePage ', (done) => {
   function changePage(page: number): void {
      expect(page).toEqual(3);
      done();
   }

   render(<Pagination total={20} perPage={2} currentPage={1} changePage={changePage} />);

   fireEvent.click(screen.getByTestId('page-3'));
});

it('testar avançar', (done) => {
   function changePage(page: number): void {
      expect(page).toEqual(3);
      done();
   }

   render(<Pagination total={20} perPage={2} currentPage={2} changePage={changePage} />);

   fireEvent.click(screen.getByTestId('page-next'));
});

it('testar voltar', (done) => {
   function changePage(page: number): void {
      expect(page).toEqual(1);
      done();
   }

   render(<Pagination total={20} perPage={2} currentPage={2} changePage={changePage} />);

   fireEvent.click(screen.getByTestId('page-back'));
});
