import { shallow } from 'enzyme';
import * as React from 'react';
import { Navigation } from 'react-native-navigation';
import sinon from 'sinon';

import { Screen, ScreenWithoutScrolling, ScreenWithScrolling, Text } from '~/components';
import { assert, testIdProps } from '~/test/utils';

const DummyComponent = () => <Text>lorem ipsum</Text>;

describe('Screen', () => {
  describe('renders', () => {
    it('default', () => {
      const wrapper = shallow(
        <Screen componentId="id">
          <DummyComponent />
        </Screen>,
      );

      expect(wrapper).toMatchSnapshot();
    });

    it('with fixed view', () => {
      const wrapper = shallow(
        <Screen componentId="id" preset="fixed">
          <DummyComponent />
        </Screen>,
      );

      expect(wrapper).toMatchSnapshot();
    });

    it('with scroll view', () => {
      const wrapper = shallow(
        <Screen componentId="id" preset="scroll">
          <DummyComponent />
        </Screen>,
      );

      expect(wrapper).toMatchSnapshot();
    });

    it('with immersive color', () => {
      const setStatusBarStub = sinon.stub(Navigation, 'mergeOptions');

      shallow(
        <Screen backgroundColor="red" componentId="id" statusBarStyle="light">
          <DummyComponent />
        </Screen>,
      );

      assert.calledOnceWithExactly(setStatusBarStub, 'id', {
        navigationBar: {
          backgroundColor: 'red',
        },
        statusBar: { backgroundColor: 'red', style: 'light' },
      });
    });
  });

  describe('render ScreenWithoutScrolling', () => {
    it('without props', () => {
      const wrapper = shallow(
        <ScreenWithoutScrolling componentId="id">
          <DummyComponent />
        </ScreenWithoutScrolling>,
      );

      expect(wrapper).toMatchSnapshot();
    });

    it('with safe == true', () => {
      const wrapper = shallow(
        <ScreenWithoutScrolling safe componentId="id">
          <DummyComponent />
        </ScreenWithoutScrolling>,
      );

      expect(wrapper).toMatchSnapshot();
    });

    it('with backgroundColor', () => {
      const wrapper = shallow(
        <ScreenWithoutScrolling backgroundColor="red" componentId="id">
          <DummyComponent />
        </ScreenWithoutScrolling>,
      );

      expect(wrapper).toMatchSnapshot();
    });
  });

  describe('render ScreenWithScrolling', () => {
    it('without props', () => {
      const wrapper = shallow(
        <ScreenWithScrolling componentId="id">
          <DummyComponent />
        </ScreenWithScrolling>,
      );

      expect(wrapper).toMatchSnapshot();
    });

    it('with safe == true', () => {
      const wrapper = shallow(
        <ScreenWithScrolling safe componentId="id">
          <DummyComponent />
        </ScreenWithScrolling>,
      );

      expect(wrapper).toMatchSnapshot();
    });

    it('with backgroundColor', () => {
      const wrapper = shallow(
        <ScreenWithScrolling backgroundColor="red" componentId="id">
          <DummyComponent />
        </ScreenWithScrolling>,
      );

      expect(wrapper).toMatchSnapshot();
    });

    it('with refresh control', async function () {
      const refreshSpy = sinon.spy();
      const onRefresh = () => {
        refreshSpy();
        return Promise.resolve();
      };
      const wrapper = shallow(
        <ScreenWithScrolling
          componentId="id"
          preset="scroll"
          onRefresh={onRefresh}
          {...testIdProps('screen-scroll-view')}
        >
          <DummyComponent />
        </ScreenWithScrolling>,
      );

      expect(wrapper).toMatchSnapshot();

      const scrollView = wrapper.find({ testID: 'screen-scroll-view' });
      const refreshControl = scrollView.props().refreshControl;

      await refreshControl.props.onRefresh();

      assert.calledOnce(refreshSpy);
    });
  });
});
