lucid-ui
Version:
A UI component library from AppNexus.
124 lines • 4.53 kB
JavaScript
// 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 inteded. 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 LineChart from './LineChart';
import { EmptyStateWrapper } from '../EmptyStateWrapper/EmptyStateWrapper';
var _LineChart$EmptyState = LineChart.EmptyStateWrapper,
Title = _LineChart$EmptyState.Title,
Body = _LineChart$EmptyState.Body;
describe('LineChart', function () {
var wrapper;
afterEach(function () {
if (wrapper) {
wrapper.unmount();
}
});
common(LineChart, {
exemptFunctionProps: ['xAxisFormatter', 'xAxisTooltipFormatter', 'yAxisTooltipFormatter', 'yAxisTooltipDataFormatter', 'yAxisFormatter', 'y2AxisFormatter', 'y2AxisTooltipDataFormatter'],
getDefaultProps: function getDefaultProps() {
return {
data: [{
x: new Date('2015-01-01T00:00:00Z'),
y: 1
}, {
x: new Date('2015-01-01T00:00:00Z'),
y: 2
}]
};
}
});
describe('props', function () {
describe('isLoading', function () {
it('should show a `LoadingIndicator` if `isLoading`', function () {
wrapper = mount( /*#__PURE__*/React.createElement(LineChart, {
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(LineChart, null, /*#__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(LineChart, null, /*#__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 single axis chart', function () {
wrapper = mount( /*#__PURE__*/React.createElement(LineChart, {
data: [{
x: new Date(),
y: 1
}, {
x: new Date(),
y: 2
}, {
x: new Date(),
y: 3
}]
}));
assert.equal(wrapper.find('.lucid-Point').length, 3, 'did not find the correct number of points');
});
it('should render a single axis chart with multiple series', function () {
wrapper = mount( /*#__PURE__*/React.createElement(LineChart, {
data: [{
x: new Date(),
y: 1,
y2: 1
}, {
x: new Date(),
y: 2,
y2: 1
}, {
x: new Date(),
y: 3,
y2: 1
}],
yAxisFields: ['y', 'y2']
}));
assert.equal(wrapper.find('.lucid-Line').length, 2, 'did not find the correct number of lines');
});
it('should render a dual axis chart', function () {
wrapper = mount( /*#__PURE__*/React.createElement(LineChart, {
data: [{
x: new Date(),
y: 1,
y2: 1
}, {
x: new Date(),
y: 2,
y2: 1
}, {
x: new Date(),
y: 3,
y2: 1
}],
yAxisFields: ['y'],
y2AxisFields: ['y2']
}));
assert.equal(wrapper.find('.lucid-Axis').length, 3, 'did not find the correct number of axes');
});
});
});