lucid-ui
Version:
A UI component library from AppNexus.
114 lines (113 loc) • 6.56 kB
JavaScript
import _has from "lodash/has";
import React from 'react';
import assert from 'assert';
import { shallow, mount } from 'enzyme';
import { common } from '../../util/generic-tests';
import { VerticalListMenuDumb as VerticalListMenu } from './VerticalListMenu';
import sinon from 'sinon';
describe('VerticalListMenu', function () {
common(VerticalListMenu);
describe('render', function () {
it('should have the correct number of children', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(VerticalListMenu, null, /*#__PURE__*/React.createElement(VerticalListMenu.Item, null), /*#__PURE__*/React.createElement(VerticalListMenu.Item, null), /*#__PURE__*/React.createElement(VerticalListMenu.Item, null)));
assert.equal(wrapper.find('.lucid-VerticalListMenu-Item').length, 3);
});
it('should render the Item content correctly', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(VerticalListMenu, null, /*#__PURE__*/React.createElement(VerticalListMenu.Item, null, "blarg")));
assert.equal(wrapper.find('.lucid-VerticalListMenu-Item').text(), 'blarg');
});
});
describe('props', function () {
describe('selectedIndices', function () {
it('should favor child props over parent level', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(VerticalListMenu, {
selectedIndices: [0],
expandedIndices: [2]
}, /*#__PURE__*/React.createElement(VerticalListMenu.Item, null, "Selected one"), /*#__PURE__*/React.createElement(VerticalListMenu.Item, {
isSelected: true
}, "Selected two"), /*#__PURE__*/React.createElement(VerticalListMenu.Item, null, "Expanded one"), /*#__PURE__*/React.createElement(VerticalListMenu.Item, {
isExpanded: true
}, "Expanded two")));
assert.equal(wrapper.find('.lucid-VerticalListMenu-Item-content-is-selected').length, 2);
});
});
describe('onSelect', function () {
it('should fire', function () {
var onSelect = sinon.spy();
var wrapper = shallow( /*#__PURE__*/React.createElement(VerticalListMenu, {
onSelect: onSelect
}, /*#__PURE__*/React.createElement(VerticalListMenu.Item, null, "One"), /*#__PURE__*/React.createElement(VerticalListMenu.Item, null, "Two")));
wrapper.find('.lucid-VerticalListMenu-Item-content').at(1).simulate('click');
assert(onSelect.called);
assert.equal(onSelect.args[0][0], 1, 'wrong index on the onSelect callback');
assert(_has(onSelect.args[0][1], 'event'), 'missing `event` on the onSelect callback');
assert(_has(onSelect.args[0][1], 'props'), 'missing `props` on the onSelect callback');
});
it('should fire on the child', function () {
var onSelect = sinon.spy();
var wrapper = shallow( /*#__PURE__*/React.createElement(VerticalListMenu, null, /*#__PURE__*/React.createElement(VerticalListMenu.Item, null, "One"), /*#__PURE__*/React.createElement(VerticalListMenu.Item, {
onSelect: onSelect
}, "Two")));
wrapper.find('.lucid-VerticalListMenu-Item-content').at(1).simulate('click');
assert(onSelect.called);
assert.equal(onSelect.args[0][0], 1, 'wrong index on the onSelect callback');
assert(_has(onSelect.args[0][1], 'event'), 'missing `event` on the onSelect callback');
assert(_has(onSelect.args[0][1], 'props'), 'missing `props` on the onSelect callback');
});
});
describe('hasExpander', function () {
it('should show expanders', function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(VerticalListMenu, null, /*#__PURE__*/React.createElement(VerticalListMenu.Item, null), /*#__PURE__*/React.createElement(VerticalListMenu.Item, {
hasExpander: true
}), /*#__PURE__*/React.createElement(VerticalListMenu.Item, {
hasExpander: true
})));
assert.equal(wrapper.find('.lucid-VerticalListMenu-Item-expander').length, 2);
});
}); // Since onToggle uses a Button under the hood, we need to do a `mount` test
// to make sure it's passing the `event` object around correctly
describe('onToggle', function () {
var wrapper;
afterEach(function () {
if (wrapper) {
wrapper.unmount();
}
});
it('should fire', function () {
var onToggle = sinon.spy();
wrapper = mount( /*#__PURE__*/React.createElement(VerticalListMenu, {
onToggle: onToggle
}, /*#__PURE__*/React.createElement(VerticalListMenu.Item, {
hasExpander: true
}), /*#__PURE__*/React.createElement(VerticalListMenu.Item, {
hasExpander: true
})));
wrapper.find('.lucid-VerticalListMenu-Item-expander').at(0).simulate('click');
assert(onToggle.called);
assert.equal(onToggle.args[0][0], 0, 'wrong index on the onToggle callback');
assert(_has(onToggle.args[0][1], 'event'), 'missing `event` on the onToggle callback');
assert(_has(onToggle.args[0][1], 'props'), 'missing `props` on the onToggle callback');
});
it('should fire on the child', function () {
var onToggle = sinon.spy();
wrapper = mount( /*#__PURE__*/React.createElement(VerticalListMenu, null, /*#__PURE__*/React.createElement(VerticalListMenu.Item, {
hasExpander: true,
onToggle: onToggle
}), /*#__PURE__*/React.createElement(VerticalListMenu.Item, {
hasExpander: true
})));
wrapper.find('.lucid-VerticalListMenu-Item-expander').at(0).simulate('click');
assert(onToggle.called);
assert.equal(onToggle.args[0][0], 0, 'wrong index on the onToggle callback');
assert(_has(onToggle.args[0][1], 'event'), 'missing `event` on the onToggle callback');
assert(_has(onToggle.args[0][1], 'props'), 'missing `props` on the onToggle callback');
});
});
});
describe('childComponents', function () {
it("should correctly recognize other VerticalListMenu's as children", function () {
var wrapper = shallow( /*#__PURE__*/React.createElement(VerticalListMenu, null, /*#__PURE__*/React.createElement(VerticalListMenu.Item, null, /*#__PURE__*/React.createElement("div", null, "Other random content"), /*#__PURE__*/React.createElement(VerticalListMenu, null, /*#__PURE__*/React.createElement(VerticalListMenu.Item, null)))));
assert.equal(wrapper.find('.lucid-VerticalListMenu-Item-nested-list').children().length, 1);
});
});
});