"use strict";

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

var _lodash = _interopRequireDefault(require("lodash.isequal"));

var _chai = _interopRequireWildcard(require("chai"));

var _chaiEnzyme = _interopRequireDefault(require("chai-enzyme"));

var _enzymeHelpers = require("../../../tests/enzyme-helpers");

var _keyCode = require("../../../utilities/key-code");

var _dynamicHashmap = _interopRequireDefault(require("../__docs__/dynamic-hashmap"));

var _default = _interopRequireDefault(require("../__examples__/default"));

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 }; }

/* eslint-env mocha */

/* global sinon */

/* eslint-disable prefer-arrow-callback */

/* eslint-disable no-unused-expressions */
// `this.wrapper` and `this.dom` is set in the helpers file
_chai.default.use((0, _chaiEnzyme.default)());

var COMPONENT_CSS_CLASSES = {
  base: 'slds-tree'
};
describe('Tree: ', function () {
  /*
  	Tests
   */
  describe('Tree can be navigated up/down using the keyboard', function () {
    beforeEach((0, _enzymeHelpers.mountComponent)(_react.default.createElement(_default.default, {
      log: function log() {}
    })));
    afterEach(_enzymeHelpers.unmountComponent);
    it('moves selection up/down with wrapping when using keyboard up/down keys', function () {
      // Initial focus selects the item
      this.wrapper.find('#example-tree-1').simulate('focus');
      var itemDiv = this.wrapper.find('#example-tree-1').find('.slds-is-selected');
      (0, _chai.expect)(itemDiv).to.have.length(1); // Go to next node

      this.wrapper.find('#example-tree-1').simulate('keyDown', _keyCode.keyObjects.DOWN);
      itemDiv = this.wrapper.find('#example-tree-2').find('.slds-is-selected');
      (0, _chai.expect)(itemDiv).to.have.length(1); // Go to next node

      this.wrapper.find('#example-tree-2').simulate('keyDown', _keyCode.keyObjects.DOWN);
      itemDiv = this.wrapper.find('#example-tree-3').find('.slds-is-selected');
      (0, _chai.expect)(itemDiv).to.have.length(1); // Go to next node

      this.wrapper.find('#example-tree-3').simulate('keyDown', _keyCode.keyObjects.DOWN);
      itemDiv = this.wrapper.find('#example-tree-7').find('.slds-is-selected');
      (0, _chai.expect)(itemDiv).to.have.length(1); // Wrap to first node

      this.wrapper.find('#example-tree-7').simulate('keyDown', _keyCode.keyObjects.DOWN);
      itemDiv = this.wrapper.find('#example-tree-1').find('.slds-is-selected');
      (0, _chai.expect)(itemDiv).to.have.length(1); // Wrap to last node

      this.wrapper.find('#example-tree-1').simulate('keyDown', _keyCode.keyObjects.UP);
      itemDiv = this.wrapper.find('#example-tree-7').find('.slds-is-selected');
      (0, _chai.expect)(itemDiv).to.have.length(1); // Go to previous node

      this.wrapper.find('#example-tree-7').simulate('keyDown', _keyCode.keyObjects.UP);
      itemDiv = this.wrapper.find('#example-tree-3').find('.slds-is-selected');
      (0, _chai.expect)(itemDiv).to.have.length(1); // Go to previous node

      this.wrapper.find('#example-tree-3').simulate('keyDown', _keyCode.keyObjects.UP);
      itemDiv = this.wrapper.find('#example-tree-2').find('.slds-is-selected');
      (0, _chai.expect)(itemDiv).to.have.length(1); // Go to previous node

      this.wrapper.find('#example-tree-2').simulate('keyDown', _keyCode.keyObjects.UP);
      itemDiv = this.wrapper.find('#example-tree-1').find('.slds-is-selected');
      (0, _chai.expect)(itemDiv).to.have.length(1);
    });
  });
  describe('Tree can be navigated right/left using the keyboard', function () {
    beforeEach((0, _enzymeHelpers.mountComponent)(_react.default.createElement(_default.default, {
      log: function log() {}
    })));
    afterEach(_enzymeHelpers.unmountComponent);
    it('expands/collapses branches when using right/left keys', function () {
      // Initial focus selects the item
      var item = this.wrapper.find('#example-tree-1');
      item.simulate('focus');
      var itemDiv = this.wrapper.find('#example-tree-1').find('.slds-is-selected');
      (0, _chai.expect)(itemDiv).to.have.length(1); // Expand branch

      this.wrapper.find('#example-tree-3').simulate('keyDown', _keyCode.keyObjects.RIGHT);
      var items = this.wrapper.find('li[aria-level=2]');
      (0, _chai.expect)(items).to.have.length(4); // Collapse branch

      this.wrapper.find('#example-tree-3').simulate('keyDown', _keyCode.keyObjects.LEFT);
      items = this.wrapper.find('li[aria-level=2]');
      (0, _chai.expect)(items).to.have.length(0); // Expand branch and select an item

      this.wrapper.find('#example-tree-3').simulate('keyDown', _keyCode.keyObjects.RIGHT);
      items = this.wrapper.find('li[aria-level=2]');
      (0, _chai.expect)(items).to.have.length(4); // Collapse branch from an item

      this.wrapper.find('#example-tree-3').simulate('keyDown', _keyCode.keyObjects.DOWN);
      this.wrapper.find('#example-tree-8').simulate('keyDown', _keyCode.keyObjects.LEFT);
      items = this.wrapper.find('li[aria-level=2]');
      (0, _chai.expect)(items).to.have.length(0);
    });
  });
  describe('Default Structure and CSS', function () {
    var id = 'this-is-a-container-test';
    beforeEach((0, _enzymeHelpers.mountComponent)(_react.default.createElement(_default.default, {
      className: "this-is-a-container-test",
      heading: "Foods",
      id: id,
      listClassName: "this-is-an-unordered-list-test",
      listStyle: {
        height: '500px'
      },
      log: function log() {}
    })));
    afterEach(_enzymeHelpers.unmountComponent);
    it('has tree container class, list class, and heading', function () {
      var container = this.wrapper.find('.slds-tree_container');
      (0, _chai.expect)(container.hasClass('this-is-a-container-test')).to.be.true;
      var list = this.wrapper.find(".".concat(COMPONENT_CSS_CLASSES.base));
      (0, _chai.expect)(list).to.have.length(1);
      (0, _chai.expect)(list.hasClass('this-is-an-unordered-list-test')).to.be.true;
      (0, _chai.expect)(list.get(0).props.style).to.have.property('height', '500px', 'height of list');
      var heading = this.wrapper.find("#".concat(id, "__heading"));
      (0, _chai.expect)(heading).to.have.length(1);
    });
  });
  describe('Assistive Technology', function () {
    beforeEach((0, _enzymeHelpers.mountComponent)(_react.default.createElement(_default.default, {
      log: function log() {},
      assistiveText: {
        label: 'Foods'
      }
    })));
    afterEach(_enzymeHelpers.unmountComponent);
    it('has heading via assistiveText', function () {
      var heading = this.wrapper.find('#example-tree__heading.slds-assistive-text');
      (0, _chai.expect)(heading).to.have.length(1);
      var ariaLabelledbyId = this.wrapper.find('.slds-tree[aria-labelledby="example-tree__heading"]');
      (0, _chai.expect)(ariaLabelledbyId).to.have.length(1);
    });
  });
  describe('Initial Expanded and Selection based on nodes', function () {
    beforeEach((0, _enzymeHelpers.mountComponent)(_react.default.createElement(_default.default, {
      log: function log() {},
      nodes: _dynamicHashmap.default.initialExpandedSelected
    })));
    afterEach(_enzymeHelpers.unmountComponent);
    it('has initial selection', function () {
      var selectedNode = this.wrapper.find('#example-tree-2').find('.slds-is-selected'); // Fruits, Watermelon, Tree Fruits

      (0, _chai.expect)(selectedNode).to.have.length(3);
      selectedNode = this.wrapper.find('#example-tree-5').find('.slds-is-selected');
      (0, _chai.expect)(selectedNode).to.have.length(1);
    });
    it('has initial expanded branches', function () {
      var expandedBranchList = this.wrapper.find('#example-tree-2').find('.slds-is-expanded');
      (0, _chai.expect)(expandedBranchList).to.have.length(2);
    });
  });
  describe('Branch expands and selects on click', function () {
    var itemClicked = sinon.spy();
    var expandClicked = sinon.spy();
    beforeEach((0, _enzymeHelpers.mountComponent)(_react.default.createElement(_default.default, {
      log: function log() {},
      onExpandClick: expandClicked,
      onClick: itemClicked
    })));
    afterEach(_enzymeHelpers.unmountComponent);
    it('branch calls onExpandClicked and onClick', function () {
      var branch = this.wrapper.find('#example-tree-2').find('.slds-tree__item');
      branch.simulate('click');
      (0, _chai.expect)(itemClicked.callCount).to.equal(1);
      var expandButton = this.wrapper.find('#example-tree-2').find('.slds-button');
      expandButton.simulate('click');
      (0, _chai.expect)(expandClicked.callCount).to.equal(1);
    });
  });
  describe('Item calls onClick', function () {
    var itemClicked = sinon.spy();
    beforeEach((0, _enzymeHelpers.mountComponent)(_react.default.createElement(_default.default, {
      log: function log() {},
      onClick: itemClicked
    })));
    afterEach(_enzymeHelpers.unmountComponent);
    it('item calls itemClicked', function () {
      var item = this.wrapper.find('#example-tree-1').find('.slds-tree__item');
      item.simulate('click');
      (0, _chai.expect)(itemClicked.callCount).to.equal(1);
    });
  });
  describe('getNodes is called correctly on initial tree', function () {
    var getNodes = function getNodes(node) {
      return node.nodes ? node.nodes.map(function (id) {
        return _dynamicHashmap.default.initialExpandedSelected[id];
      }) : [];
    };

    var getNodesSpy = sinon.spy(getNodes);
    beforeEach((0, _enzymeHelpers.mountComponent)(_react.default.createElement(_default.default, {
      getNodes: getNodesSpy,
      log: function log() {},
      nodes: _dynamicHashmap.default.initialExpandedSelected
    })));
    afterEach(_enzymeHelpers.unmountComponent);
    it('getNodes passes in correct node and is called 18 times (all branches twice + root branch) on initial tree', function () {
      var nodeCallbackParameter = getNodesSpy.args[0][0];
      (0, _chai.expect)((0, _lodash.default)(nodeCallbackParameter.nodes, _dynamicHashmap.default.initialExpandedSelected[0].nodes)).is.true;
      (0, _chai.expect)(getNodesSpy.callCount).to.equal(18);
    });
  });
  describe('Search term is highlighted', function () {
    beforeEach((0, _enzymeHelpers.mountComponent)(_react.default.createElement(_default.default, {
      log: function log() {},
      searchTerm: "fruit"
    })));
    afterEach(_enzymeHelpers.unmountComponent);
    it('item calls itemClicked', function () {
      var markedItem = this.wrapper.find('mark');
      (0, _chai.expect)(markedItem).to.have.length(1);
    });
  });
  describe('Scrolling calls onScroll', function () {
    var onScroll = sinon.spy();
    beforeEach((0, _enzymeHelpers.mountComponent)(_react.default.createElement(_default.default, {
      heading: "Foods",
      listStyle: {
        height: '300px',
        overflowY: 'auto'
      },
      log: function log() {},
      nodes: _dynamicHashmap.default.large,
      onScroll: onScroll
    })));
    afterEach(_enzymeHelpers.unmountComponent);
    it('scrolling calls onScroll', function () {
      var list = this.wrapper.find(".".concat(COMPONENT_CSS_CLASSES.base));
      list.simulate('scroll');
      (0, _chai.expect)(onScroll.callCount).to.equal(1);
    });
  });
});