lucid-ui
Version:
A UI component library from AppNexus.
144 lines • 4.63 kB
JavaScript
/* eslint-disable comma-spacing */
// Note: these tests are basically pin tests, given that we're rendering svgs,
// these tests serve to ensure that the rendered output is exactly at the author
// intended. As a consequence, you may need to re-pin these tests if you change
// things.
import React from 'react';
import { mount } from 'enzyme';
import { common } from '../../util/generic-tests';
import assert from 'assert';
import BarChart from './BarChart';
import EmptyStateWrapper from '../EmptyStateWrapper/EmptyStateWrapper';
var _BarChart$EmptyStateW = BarChart.EmptyStateWrapper,
Title = _BarChart$EmptyStateW.Title,
Body = _BarChart$EmptyStateW.Body;
describe('BarChart', function () {
var wrapper;
afterEach(function () {
if (wrapper) {
wrapper.unmount();
}
});
common(BarChart, {
exemptFunctionProps: ['xAxisFormatter', 'yAxisFormatter', 'yAxisTooltipFormatter', 'yAxisTooltipDataFormatter'],
getDefaultProps: function getDefaultProps() {
return {
data: [{
x: 'Monday',
y: 1,
y2: 2
}, {
x: 'Tuesday',
y: 4,
y2: 4
}, {
x: 'Wednesday',
y: 8,
y2: 1
}, {
x: 'Thursday',
y: 20,
y2: 15
}, {
x: 'Friday',
y: 10,
y2: 2
}]
};
}
});
describe('props', function () {
describe('isLoading', function () {
it('should show a `LoadingIndicator` if `isLoading`', function () {
wrapper = mount( /*#__PURE__*/React.createElement(BarChart, {
data: [],
isLoading: true
}));
var loadingIndicatorWrapper = wrapper.find(EmptyStateWrapper).find('LoadingIndicator');
assert(loadingIndicatorWrapper.prop('isLoading'));
});
});
});
describe('child components', function () {
describe('EmptyStateWrapper Title', function () {
it('should render the message title element', function () {
var titleText = 'Here is the Title Text';
wrapper = mount( /*#__PURE__*/React.createElement(BarChart, {
data: []
}, /*#__PURE__*/React.createElement(EmptyStateWrapper, null, /*#__PURE__*/React.createElement(Title, null, titleText))));
var messageTitleWrapper = wrapper.find(EmptyStateWrapper).find('.lucid-EmptyStateWrapper-message-title');
assert.equal(messageTitleWrapper.text(), titleText, 'must contain the title text');
});
});
describe('EmptyStateWrapper Body', function () {
it('should render the message body element', function () {
var bodyElement = /*#__PURE__*/React.createElement("div", {
className: "parent-div"
}, /*#__PURE__*/React.createElement("div", {
className: "nested-div"
}));
wrapper = mount( /*#__PURE__*/React.createElement(BarChart, {
data: []
}, /*#__PURE__*/React.createElement(EmptyStateWrapper, null, /*#__PURE__*/React.createElement(Body, null, bodyElement))));
var messageBodyWrapper = wrapper.find(EmptyStateWrapper);
assert(messageBodyWrapper.contains(bodyElement), 'must contain the body element');
});
});
});
describe('render', function () {
it('should render a basic chart', function () {
wrapper = mount( /*#__PURE__*/React.createElement(BarChart, {
data: [{
x: 'Monday',
y: 1,
y2: 2
}, {
x: 'Tuesday',
y: 4,
y2: 4
}, {
x: 'Wednesday',
y: 8,
y2: 1
}, {
x: 'Thursday',
y: 20,
y2: 15
}, {
x: 'Friday',
y: 10,
y2: 2
}]
}));
assert.equal(wrapper.find('.lucid-Bar').length, 5, 'did not find the correct number of bars');
assert.equal(wrapper.find('.lucid-Axis').length, 2, 'did not find the correct number of axes');
});
it('should render a chart with multiple series', function () {
wrapper = mount( /*#__PURE__*/React.createElement(BarChart, {
data: [{
x: 'Monday',
y: 1,
y2: 2
}, {
x: 'Tuesday',
y: 4,
y2: 4
}, {
x: 'Wednesday',
y: 8,
y2: 1
}, {
x: 'Thursday',
y: 20,
y2: 15
}, {
x: 'Friday',
y: 10,
y2: 2
}],
yAxisFields: ['y', 'y2']
}));
assert.equal(wrapper.find('.lucid-Bar').length, 10, 'did not find the correct number of bars');
});
});
});