import { jsx as ___EmotionJSX } from "@emotion/core";
import React from 'react';
import { shallow } from 'enzyme';
import renderer from 'react-test-renderer';
import AcneFewGlyph from '../../svgs/glyphs/acne-few-glyph.svg';
import SelectorButton from './index';
describe('<SelectorButton />', function () {
  describe('UI snapshots', function () {
    test('when children is undefined', function () {
      var tree = renderer.create(___EmotionJSX(SelectorButton, {
        checked: false,
        onClick: function onClick() {}
      })).toJSON();
      expect(tree).toMatchSnapshot();
    });
    test('when children is a node', function () {
      var tree = renderer.create(___EmotionJSX(SelectorButton, {
        checked: false,
        onClick: function onClick() {}
      }, "SelectorButton Text")).toJSON();
      expect(tree).toMatchSnapshot();
    });
    test('when checked type is primary', function () {
      var tree = renderer.create(___EmotionJSX(SelectorButton, {
        checked: true,
        onClick: function onClick() {},
        type: "primary"
      }, "SelectorButton Text")).toJSON();
      expect(tree).toMatchSnapshot();
    });
    test('when checked type is secondary', function () {
      var tree = renderer.create(___EmotionJSX(SelectorButton, {
        checked: true,
        onClick: function onClick() {},
        type: "secondary"
      }, "SelectorButton Text")).toJSON();
      expect(tree).toMatchSnapshot();
    });
    test('when is checkbox', function () {
      var tree = renderer.create(___EmotionJSX(SelectorButton, {
        checked: false,
        onClick: function onClick() {},
        selector: "checkbox"
      }, "SelectorButton Text")).toJSON();
      expect(tree).toMatchSnapshot();
    });
    describe('when Icon added', function () {
      it('hides icon for checkbox with size \'small\'', function () {
        var tree = renderer.create(___EmotionJSX(SelectorButton, {
          checked: false,
          onClick: function onClick() {},
          selector: "checkbox",
          icon: ___EmotionJSX(AcneFewGlyph, {
            width: 16,
            height: 16
          }),
          size: "small"
        }, "SelectorButton Text"));
        expect(tree).toMatchSnapshot();
      });
      it('hides icon for radio button size \'small\'', function () {
        var tree = renderer.create(___EmotionJSX(SelectorButton, {
          checked: false,
          onClick: function onClick() {},
          selector: "radio",
          icon: ___EmotionJSX(AcneFewGlyph, {
            width: 16,
            height: 16
          }),
          size: "small"
        }, "SelectorButton Text"));
        expect(tree).toMatchSnapshot();
      });
      it('displays icon for checkbox with size \'large\'', function () {
        var tree = renderer.create(___EmotionJSX(SelectorButton, {
          checked: false,
          onClick: function onClick() {},
          selector: "checkbox",
          icon: ___EmotionJSX(AcneFewGlyph, {
            width: 16,
            height: 16
          }),
          size: "large"
        }, "SelectorButton Text"));
        expect(tree).toMatchSnapshot();
      });
      it('displays icon for radio button with size \'large\'', function () {
        var tree = renderer.create(___EmotionJSX(SelectorButton, {
          checked: false,
          onClick: function onClick() {},
          selector: "radio",
          icon: ___EmotionJSX(AcneFewGlyph, {
            width: 16,
            height: 16
          }),
          size: "large"
        }, "SelectorButton Text"));
        expect(tree).toMatchSnapshot();
      });
      it('displays check mark for checked checkbox', function () {
        var tree = renderer.create(___EmotionJSX(SelectorButton, {
          checked: true,
          onClick: function onClick() {},
          selector: "checkbox",
          icon: ___EmotionJSX(AcneFewGlyph, {
            width: 16,
            height: 16
          }),
          size: "large"
        }, "SelectorButton Text"));
        expect(tree).toMatchSnapshot();
      });
      it('displays check mark for checked radio button', function () {
        var tree = renderer.create(___EmotionJSX(SelectorButton, {
          checked: true,
          onClick: function onClick() {},
          selector: "radio",
          icon: ___EmotionJSX(AcneFewGlyph, {
            width: 16,
            height: 16
          }),
          size: "large"
        }, "SelectorButton Text"));
        expect(tree).toMatchSnapshot();
      });
    });
  });
  describe('onClick callback', function () {
    it('is invoked on click', function () {
      var spy = jest.fn();
      var wrapper = shallow(___EmotionJSX(SelectorButton, {
        checked: false,
        onClick: spy
      }));
      wrapper.simulate('click');
      expect(spy).toHaveBeenCalled();
    });
  });
});