optimizely-oui/dist/js/components/Disclose/tests/index.js

Optimizely's Component Library.

"use strict";

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

var _enzyme = require("enzyme");

var _index = _interopRequireDefault(require("../index"));

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

describe("Disclose Component ", function () {
  describe("when the component mounted", function () {
    var component;
    beforeEach(function () {
      component = (0, _enzyme.mount)(_react["default"].createElement(_index["default"], {
        title: "Some title"
      }, " ", _react["default"].createElement("div", {
        "data-test-section": "disclose-content"
      }, "disclose this"), " "));
    });
    it("should render correctly", function () {
      expect(component).toMatchSnapshot();
    });
    it("should be collapsed by default", function () {
      var content = component.find('[data-test-section="disclose-content"]');
      expect(content.exists()).toBeFalsy();
    });
    describe("when an openHandler callback is passed as props", function () {
      var openHandlerMock = jest.fn();
      beforeEach(function () {
        component.setProps({
          openHandler: openHandlerMock
        });
        component.update();
      });
      it("should call the openHandler callback with the expandDisclose setter", function () {
        expect(openHandlerMock).toHaveBeenCalledTimes(1);
      });
    });
    describe("when clicking the anchor element", function () {
      beforeEach(function () {
        component.find("a").simulate("click");
        component.update();
      });
      it("should expand the content", function () {
        var content = component.find('[data-test-section="disclose-content"]');
        expect(content.exists()).toBeTruthy();
      });
    });
    describe("when disabled", function () {
      beforeEach(function () {
        component.setProps({
          isDisabled: true
        });
      });
      describe("when clicking the anchor element", function () {
        beforeEach(function () {
          component.find("a").simulate("click");
          component.update();
        });
        it("should not expand the content", function () {
          var content = component.find('[data-test-section="disclose-content"]');
          expect(content.exists()).toBeFalsy();
        });
      });
    });
    describe("when isOpen prop is passed", function () {
      beforeAll(function () {
        component.setProps({
          isOpen: true
        });
      });
      it("should be expanded by default", function () {
        setTimeout(function () {
          var content = component.find('[data-test-section="disclose-content"]');
          expect(content.exists()).toBeTruthy();
        });
      });
      describe("when clicking the anchor element", function () {
        beforeEach(function () {
          component.find("a").simulate("click");
          component.update();
        });
        it("should collapse the content", function () {
          setTimeout(function () {
            var content = component.find('[data-test-section="disclose-content"]');
            expect(content.exists()).toBeFalsy();
          });
        });
      });
    });
    describe("when the indented prop is false", function () {
      beforeEach(function () {
        component.setProps({
          indented: false
        });
      });
      it("should add a hard left class to the link", function () {
        expect(component.find("a").hasClass("hard--left")).toBeTruthy();
      });
    });
    describe("when given a className", function () {
      beforeEach(function () {
        component.setProps({
          className: "extra-class"
        });
      });
      it("appends the new class to the anchor element", function () {
        expect(component.find("a").prop("className").includes("extra-class")).toBeTruthy();
      });
    });
    describe("when given an unknown prop", function () {
      beforeEach(function () {
        component.setProps({
          unknownprop: "some value"
        });
      });
      it("passes the unknown prop to the anchor element", function () {
        expect(component.find("a")).toHaveProp({
          unknownprop: "some value"
        });
      });
    });
    describe("when childrenStyle is passed as 'border'", function () {
      beforeEach(function () {
        component.setProps({
          childrenStyle: "border"
        });
      });
      it("should add the 'border--sides border--bottom' class to the content", function () {
        var content = component.find(".border--sides.border--bottom");
        expect(content.exists()).toBeTruthy();
      });
    });
    describe("when childrenStyle is passed as 'divider'", function () {
      beforeEach(function () {
        component.setProps({
          childrenStyle: "divider"
        });
      });
      describe("when is open", function () {
        beforeEach(function () {
          component.setProps({
            isOpen: true
          });
          component.update();
        });
        it("should only add the 'border--bottom' class to the content", function () {
          var content;
          content = component.find(".border--sides.border--bottom");
          expect(content.exists()).toBeFalsy();
          content = component.find(".border--bottom");
          expect(content.exists()).toBeTruthy();
        });
      });
    });
  });
});