lucid-ui
Version:
A UI component library from AppNexus.
132 lines • 6.08 kB
JavaScript
import React from 'react';
import { shallow } from 'enzyme';
import assert from 'assert';
import { common } from '../../util/generic-tests';
import OverlayWrapper from './OverlayWrapper';
import { CSSTransition } from 'react-transition-group';
var Message = OverlayWrapper.Message;
describe('OverlayWrapper', function () {
common(OverlayWrapper);
describe('isVisible', function () {
describe('default', function () {
var wrapper;
beforeEach(function () {
wrapper = shallow( /*#__PURE__*/React.createElement(OverlayWrapper, null, /*#__PURE__*/React.createElement("div", null, "Some content")));
});
it('should render CSSTransition with correct in prop', function () {
assert.equal(wrapper.find(CSSTransition).props().in, false);
});
it('should render other content', function () {
assert(wrapper.contains( /*#__PURE__*/React.createElement("div", null, "Some content")));
});
});
describe('false', function () {
var wrapper;
beforeEach(function () {
wrapper = shallow( /*#__PURE__*/React.createElement(OverlayWrapper, {
isVisible: false
}, /*#__PURE__*/React.createElement("div", null, "Some content")));
});
it('should render CSSTransition with correct in prop', function () {
assert.equal(wrapper.find(CSSTransition).props().in, false);
});
it('should render other content', function () {
assert(wrapper.contains( /*#__PURE__*/React.createElement("div", null, "Some content")));
});
});
describe('true', function () {
var wrapper;
beforeEach(function () {
wrapper = shallow( /*#__PURE__*/React.createElement(OverlayWrapper, {
isVisible: true
}, /*#__PURE__*/React.createElement(Message, {
className: "overlay-message"
}, "Danger!"), /*#__PURE__*/React.createElement("div", null, "Some content")));
});
it('should render CSSTransition with correct in prop', function () {
assert.equal(wrapper.find(CSSTransition).props().in, true);
});
it('should show the overlay message', function () {
assert.equal(wrapper.find('.lucid-OverlayWrapper-message-container').length, 1);
assert.equal(wrapper.find('.overlay-message').length, 1);
});
it('should render other content', function () {
assert(wrapper.contains( /*#__PURE__*/React.createElement("div", null, "Some content")));
});
});
});
describe('hasOverlay', function () {
describe('default', function () {
it('should add `&-has-overlay` class', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(OverlayWrapper, {
isVisible: true
}, /*#__PURE__*/React.createElement("div", null, "Some content")));
var messageContainer = wrapper.find('.lucid-OverlayWrapper-message-container');
assert(messageContainer.hasClass('lucid-OverlayWrapper-has-overlay'));
});
});
describe('true', function () {
it('should add `&-has-overlay` class', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(OverlayWrapper, {
isVisible: true,
hasOverlay: true
}, /*#__PURE__*/React.createElement("div", null, "Some content")));
var messageContainer = wrapper.find('.lucid-OverlayWrapper-message-container');
assert(messageContainer.hasClass('lucid-OverlayWrapper-has-overlay'));
});
});
describe('false', function () {
it('should not add `&-has-overlay` class', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(OverlayWrapper, {
isVisible: true,
hasOverlay: false
}, /*#__PURE__*/React.createElement("div", null, "Some content")));
var messageContainer = wrapper.find('.lucid-OverlayWrapper-message-container');
assert(!messageContainer.hasClass('lucid-OverlayWrapper-has-overlay'));
});
});
});
describe('anchorMessage', function () {
describe('default', function () {
it('should not add `&-anchored-message` class', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(OverlayWrapper, {
isVisible: true
}, /*#__PURE__*/React.createElement("div", null, "Some content")));
var messageContainer = wrapper.find('.lucid-OverlayWrapper-message-container');
assert(!messageContainer.hasClass('lucid-OverlayWrapper-anchored-message'));
});
});
describe('true', function () {
it('should add `&-anchored-message` class', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(OverlayWrapper, {
isVisible: true,
anchorMessage: true
}, /*#__PURE__*/React.createElement("div", null, "Some content")));
var messageContainer = wrapper.find('.lucid-OverlayWrapper-message-container');
assert(messageContainer.hasClass('lucid-OverlayWrapper-anchored-message'));
});
});
describe('false', function () {
it('should not add `&-anchored-message` class', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(OverlayWrapper, {
isVisible: true,
anchorMessage: false
}, /*#__PURE__*/React.createElement("div", null, "Some content")));
var messageContainer = wrapper.find('.lucid-OverlayWrapper-message-container');
assert(!messageContainer.hasClass('lucid-OverlayWrapper-anchored-message'));
});
});
});
describe('overlayKind', function () {
describe('light', function () {
it('should add `&-kind-light` class', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(OverlayWrapper, {
isVisible: true,
overlayKind: "light"
}, /*#__PURE__*/React.createElement("div", null, "Some content")));
var messageContainer = wrapper.find('.lucid-OverlayWrapper-message-container');
assert(messageContainer.hasClass('lucid-OverlayWrapper-kind-light'));
});
});
});
});