import React from 'react';

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

import BottomButton from '../BottomButton';
import noop from '../../helpers/noop';

jest.mock('react-native/Libraries/Components/Keyboard/Keyboard', () => ({
  addListener: jest.fn(),
  dismiss: jest.fn(),
}));
describe('BottomButton', () => {
  it.each`
    element
    ${(<BottomButton text="Button" onPress={noop} />)}
    ${(<BottomButton text="Button" onPress={noop} disabled />)}
    ${(<BottomButton text="Button" onPress={noop} loading />)}
    ${(<BottomButton text="Button" onPress={noop} forceInset="always" />)}
    ${(<BottomButton text="Button" onPress={noop} forceInset="never" />)}
  `('renders correctly', ({ element }) => {
    const { toJSON } = render(element);
    expect(toJSON()).toMatchSnapshot();
  });

  it('should feedback when users press', done => {
    const callback = jest.fn();
    const { getByText, unmount } = render(<BottomButton text="Tap here" onPress={callback} />);

    setTimeout(() => {
      const button = getByText('Tap here');
      fireEvent.press(button);
      expect(callback).toBeCalledTimes(1);
      done();
    }, 1000);
  });

  it('should not feedback when disabled', done => {
    const callback = jest.fn();
    const { getByText, toJSON } = render(<BottomButton disabled text="Tap here" onPress={callback} />);
    setTimeout(() => {
      expect(toJSON()).toMatchSnapshot();
      done();
    }, 1000);
  });
});