"use strict";

var _react = _interopRequireDefault(require("react"));

var _CollapsiblePanel = require("../CollapsiblePanel");

var _enzyme = _interopRequireWildcard(require("enzyme"));

var _enzymeAdapterReact = _interopRequireDefault(require("enzyme-adapter-react-16"));

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

_enzyme.default.configure({
  adapter: new _enzymeAdapterReact.default()
});

describe('CollapsiblePanel', function () {
  var container;
  describe('when initially collapsed', function () {
    beforeEach(function () {
      container = (0, _enzyme.mount)(_react.default.createElement(_CollapsiblePanel.CollapsiblePanel, null, _react.default.createElement("div", {
        id: "test-marker"
      }, "I am some content")));
    });
    test('should not initially show content', function () {
      expect(container.find('div#test-marker').length).toBe(0);
    });
    test('should toggle content when button is clicked', function () {
      var headerButton = container.find('button.vs-collapsible-panel-header-button');
      expect(container.find('div#test-marker').length).toBe(0);
      headerButton.simulate('click');
      expect(container.find('div#test-marker').length).toBe(1);
      headerButton.simulate('click');
      expect(container.find('div#test-marker').length).toBe(0);
    });
    test('should toggle content when title is clicked', function () {
      var headerTitle = container.find('button.vs-collapsible-panel-header-button');
      expect(container.find('div#test-marker').length).toBe(0);
      headerTitle.simulate('click');
      expect(container.find('div#test-marker').length).toBe(1);
      headerTitle.simulate('click');
      expect(container.find('div#test-marker').length).toBe(0);
    });
  });
  describe('when not initially collapsed', function () {
    beforeEach(function () {
      container = (0, _enzyme.mount)(_react.default.createElement(_CollapsiblePanel.CollapsiblePanel, {
        initializedCollapsed: false
      }, _react.default.createElement("div", {
        id: "test-marker"
      }, "I am some content")));
    });
    test('should initially show the content', function () {
      expect(container.find('div#test-marker').length).toBe(1);
    });
    test('should toggle content when button is clicked', function () {
      var headerButton = container.find('button.vs-collapsible-panel-header-button');
      expect(container.find('div#test-marker').length).toBe(1);
      headerButton.simulate('click');
      expect(container.find('div#test-marker').length).toBe(0);
      headerButton.simulate('click');
      expect(container.find('div#test-marker').length).toBe(1);
    });
    test('should toggle content when title is clicked', function () {
      var headerTitle = container.find('button.vs-collapsible-panel-header-button');
      expect(container.find('div#test-marker').length).toBe(1);
      headerTitle.simulate('click');
      expect(container.find('div#test-marker').length).toBe(0);
      headerTitle.simulate('click');
      expect(container.find('div#test-marker').length).toBe(1);
    });
  });
  describe('when rendering icon', function () {
    it('should render icon when I pass in an icon prop', function () {
      var titleIcon = _react.default.createElement("div", {
        id: "titleIcon"
      });

      var container = (0, _enzyme.mount)(_react.default.createElement(_CollapsiblePanel.CollapsiblePanel, {
        titleIcon: titleIcon,
        initializedCollapsed: false
      }));
      expect(container.find('.vs-collapsible-panel-icon-container #titleIcon')).toHaveLength(1);
      expect(container.find('.vs-collapsible-panel-icon-placeholder')).toHaveLength(1);
    });
    it('should not render icon when I dont pass in an icon prop', function () {
      var container = (0, _enzyme.mount)(_react.default.createElement(_CollapsiblePanel.CollapsiblePanel, {
        initializedCollapsed: false
      }));
      expect(container.find('.vs-collapsible-panel-icon-container #titleIcon')).toHaveLength(0);
      expect(container.find('.vs-collapsible-panel-icon-placeholder')).toHaveLength(0);
    });
  });
});
describe('PureCollapsiblePanel', function () {
  var container;
  var onChange;
  describe('when collapsed prop is true', function () {
    test('render collapsed and respond false when button clicked', function () {
      onChange = jest.fn();
      container = (0, _enzyme.mount)(_react.default.createElement(_CollapsiblePanel.PureCollapsiblePanel, {
        collapsed: true,
        onChange: onChange
      }, _react.default.createElement("div", {
        id: "test-marker"
      }, "I am some content")));
      var headerButton = container.find('button.vs-collapsible-panel-header-button');
      expect(container.find('div#test-marker').length).toBe(0);
      headerButton.simulate('click');
      expect(container.find('div#test-marker').length).toBe(0);
      expect(onChange.mock.calls[0][0]).toEqual(false);
    });
    test('render collapsed and respond false when title clicked', function () {
      onChange = jest.fn();
      container = (0, _enzyme.mount)(_react.default.createElement(_CollapsiblePanel.PureCollapsiblePanel, {
        collapsed: true,
        onChange: onChange
      }, _react.default.createElement("div", {
        id: "test-marker"
      }, "I am some content")));
      var headerButton = container.find('.vs-collapsible-panel-header-title');
      expect(container.find('div#test-marker').length).toBe(0);
      headerButton.simulate('click');
      expect(container.find('div#test-marker').length).toBe(0);
      expect(onChange.mock.calls[0][0]).toEqual(false);
    });
  });
  describe('when collapsed prop is false', function () {
    test('render expanded and respond true when button clicked', function () {
      onChange = jest.fn();
      container = (0, _enzyme.mount)(_react.default.createElement(_CollapsiblePanel.PureCollapsiblePanel, {
        collapsed: false,
        onChange: onChange
      }, _react.default.createElement("div", {
        id: "test-marker"
      }, "I am some content")));
      var headerButton = container.find('button.vs-collapsible-panel-header-button');
      expect(container.find('div#test-marker').length).toBe(1);
      headerButton.simulate('click');
      expect(container.find('div#test-marker').length).toBe(1);
      expect(onChange.mock.calls[0][0]).toEqual(true);
    });
    test('render expanded and respond true when title clicked', function () {
      onChange = jest.fn();
      container = (0, _enzyme.mount)(_react.default.createElement(_CollapsiblePanel.PureCollapsiblePanel, {
        collapsed: false,
        onChange: onChange
      }, _react.default.createElement("div", {
        id: "test-marker"
      }, "I am some content")));
      var headerButton = container.find('.vs-collapsible-panel-header-title');
      expect(container.find('div#test-marker').length).toBe(1);
      headerButton.simulate('click');
      expect(container.find('div#test-marker').length).toBe(1);
      expect(onChange.mock.calls[0][0]).toEqual(true);
    });
  });
  describe('when rendering icon', function () {
    it('should render icon when I pass in an icon prop', function () {
      var titleIcon = _react.default.createElement("div", {
        id: "titleIcon"
      });

      var container = (0, _enzyme.mount)(_react.default.createElement(_CollapsiblePanel.PureCollapsiblePanel, {
        titleIcon: titleIcon,
        collapsed: false,
        onChange: function onChange() {}
      }));
      expect(container.find('.vs-collapsible-panel-icon-container #titleIcon')).toHaveLength(1);
      expect(container.find('.vs-collapsible-panel-icon-placeholder')).toHaveLength(1);
    });
    it('should not render icon when I dont pass in an icon prop', function () {
      var container = (0, _enzyme.mount)(_react.default.createElement(_CollapsiblePanel.PureCollapsiblePanel, {
        collapsed: false,
        onChange: function onChange() {}
      }));
      expect(container.find('.vs-collapsible-panel-icon-container #titleIcon')).toHaveLength(0);
      expect(container.find('.vs-collapsible-panel-icon-placeholder')).toHaveLength(0);
    });
  });
});