"use strict";

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

var _enzyme = require("enzyme");

var _ = _interopRequireDefault(require(".."));

var _Link = _interopRequireDefault(require("../../Link"));

var _Switch = _interopRequireDefault(require("../../Switch"));

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

describe("ManagerSideNav", function () {
  it("should render a default nav", function () {
    var component = (0, _enzyme.mount)(_react["default"].createElement(_["default"], null, _react["default"].createElement(_["default"].Header, {
      hasBackLink: true,
      backLinkHref: "#features",
      backLinkText: "Features",
      projectName: "CTP Bank - Full Stack",
      primaryTitle: "recurring_deposit",
      secondaryTitle: "Recurring Deposit"
    }), _react["default"].createElement(_["default"].NavList, {
      label: "Rules"
    }, _react["default"].createElement(_["default"].NavItem, {
      isActive: false,
      leftContent: _react["default"].createElement(_Link["default"], {
        isFullWidth: true,
        href: "#variations"
      }, "Variations")
    }))));
    expect(component.find(".sidenav__body").length).toBe(1);
    expect(component.find(".sidenav__section").length).toBe(1);
    expect(component.find(".sidenav__section__title").length).toBe(1);
  });
  it("should not render a proper nav when correct children not supplied", function () {
    var component = (0, _enzyme.mount)(_react["default"].createElement(_["default"], null, _react["default"].createElement(_["default"].Header, {
      hasBackLink: true,
      backLinkHref: "#features",
      backLinkText: "Features",
      projectName: "CTP Bank - Full Stack",
      primaryTitle: "recurring_deposit",
      secondaryTitle: "Recurring Deposit"
    }), _react["default"].createElement(_["default"].NavItem, {
      isActive: false,
      leftContent: _react["default"].createElement(_Link["default"], {
        isFullWidth: true,
        href: "#variations"
      }, "Variations")
    })));
    expect(component.find(".sidenav__body").length).toBe(1);
    expect(component.find(".sidenav__section").length).toBe(0);
    expect(component.find(".nav-list__link").length).toBe(0);
  });
  describe("Header", function () {
    it("should render a back link when hasBackLink is true", function () {
      var component = (0, _enzyme.mount)(_react["default"].createElement(_["default"].Header, {
        hasBackLink: true,
        backLinkHref: "#features",
        backLinkText: "Features",
        projectName: "CTP Bank - Full Stack",
        primaryTitle: "recurring_deposit",
        secondaryTitle: "Recurring Deposit"
      }));
      expect(component.find(".nav-link--back").length).toBe(1);
    });
    it("should call the back link callback when link is clicked", function () {
      var backLinkClickSpy = jest.fn();
      var component = (0, _enzyme.mount)(_react["default"].createElement(_["default"].Header, {
        hasBackLink: true,
        backLinkHref: "#features",
        backLinkText: "Features",
        backLinkOnClick: backLinkClickSpy,
        projectName: "CTP Bank - Full Stack",
        primaryTitle: "recurring_deposit",
        secondaryTitle: "Recurring Deposit"
      }));
      component.find(".nav-link--back").simulate("click");
      expect(backLinkClickSpy).toHaveBeenCalled();
    });
    it("should style the title properly when usesMonospaceStyling is true", function () {
      var backLinkClickSpy = jest.fn();
      var component = (0, _enzyme.mount)(_react["default"].createElement(_["default"].Header, {
        hasBackLink: true,
        backLinkHref: "#features",
        backLinkText: "Features",
        backLinkOnClick: backLinkClickSpy,
        usesMonospaceStyling: true,
        projectName: "CTP Bank - Full Stack",
        primaryTitle: "recurring_deposit",
        secondaryTitle: "Recurring Deposit"
      }));
      expect(component.find(".delta").length).toBe(1);
      expect(component.find(".monospace").length).toBe(1);
    });
    it("should render children for any details passed in", function () {
      var component = (0, _enzyme.mount)(_react["default"].createElement(_["default"].Header, {
        hasBackLink: true,
        backLinkHref: "#features",
        backLinkText: "Features",
        usesMonospaceStyling: true,
        projectName: "CTP Bank - Full Stack",
        primaryTitle: "recurring_deposit",
        secondaryTitle: "Recurring Deposit"
      }, _react["default"].createElement(_["default"].HeaderDetails, {
        items: [{
          label: "Created by",
          value: "Sophia Hernandez"
        }, {
          label: "Edited by",
          value: "Sophia Hernandez"
        }]
      })));
      expect(component.find(".sidenav__details").length).toBe(1);
      expect(component.find(".sidenav__details__title").length).toBe(2);
      expect(component.find(".sidenav__details__item").length).toBe(2);
    });
  });
  describe("NavItem", function () {
    it("should render left aligned content when leftContent is passed in", function () {
      var component = (0, _enzyme.mount)(_react["default"].createElement(_["default"].NavItem, {
        isActive: false,
        leftContent: _react["default"].createElement(_Link["default"], {
          isFullWidth: true,
          href: "#variations"
        }, "Variations")
      }));
      expect(component.find(".nav-list__link").length).toBe(1);
      expect(component.find(".link").length).toBe(1);
      expect(component.find(".is-active").length).toBe(0);
    });
    it("should render right aligned content when rightContent is passed in", function () {
      var component = (0, _enzyme.mount)(_react["default"].createElement(_["default"].NavItem, {
        isActive: false,
        testSection: "dev-item",
        leftContent: _react["default"].createElement(_Link["default"], {
          isFullWidth: true,
          href: "#long"
        }, _react["default"].createElement("p", {
          className: "flush line--tight"
        }, "Another environment with a very long name"), _react["default"].createElement("p", {
          className: "micro muted flush line--tight"
        }, "Environment")),
        rightContent: _react["default"].createElement(_Switch["default"], {
          ariaLabel: "Turn feature on in Another Environment",
          elementId: "long-toggle",
          checked: false
        })
      }));
      expect(component.find(".link").length).toBe(1);
      expect(component.find(".oui-switch").length).toBe(1);
    });
    it("should render an active item when isActive is true", function () {
      var component = (0, _enzyme.mount)(_react["default"].createElement(_["default"].NavItem, {
        isActive: true,
        leftContent: _react["default"].createElement(_Link["default"], {
          isFullWidth: true,
          href: "#variations"
        }, "Variations")
      }));
      expect(component.find(".is-active").length).toBe(1);
    });
    it("should correctly trigger any actions within the content", function () {
      var linkClickSpy = jest.fn();
      var component = (0, _enzyme.mount)(_react["default"].createElement(_["default"].NavItem, {
        isActive: true,
        leftContent: _react["default"].createElement(_Link["default"], {
          isFullWidth: true,
          onClick: linkClickSpy,
          href: "#variations"
        }, "Variations")
      }));
      component.find(".link").simulate("click");
      expect(linkClickSpy).toHaveBeenCalled();
    });
  });
  describe("when given a className", function () {
    it("appends it to the root element", function () {
      var component = (0, _enzyme.shallow)(_react["default"].createElement(_["default"], {
        className: "extra-class"
      }, "Text"));
      expect(component.prop("className").includes("extra-class")).toBe(true);
    });
  });
  describe("when given an unknown prop", function () {
    it("passes it to the root element", function () {
      // @ts-ignore: `unknownProps` is not part of any typed interface and therefore a good test value.
      var component = (0, _enzyme.shallow)(_react["default"].createElement(_["default"], {
        unknownProp: "some value"
      }, "Text"));
      expect(component).toHaveProp({
        unknownProp: "some value"
      });
    });
  });
});