2018-06-15 18:11:25 +00:00
|
|
|
/**
|
|
|
|
* External dependencies
|
|
|
|
*
|
|
|
|
* @format
|
|
|
|
*/
|
|
|
|
// import { noop } from 'lodash';
|
2018-09-10 12:57:36 +00:00
|
|
|
import { utcParse as d3UTCParse } from 'd3-time-format';
|
2018-06-15 18:11:25 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Internal dependencies
|
|
|
|
*/
|
2018-07-10 15:07:34 +00:00
|
|
|
import dummyOrders from './fixtures/dummy';
|
2018-06-15 18:11:25 +00:00
|
|
|
import {
|
2018-10-24 11:13:17 +00:00
|
|
|
compareStrings,
|
2018-07-05 12:18:02 +00:00
|
|
|
getDateSpaces,
|
2018-06-15 18:11:25 +00:00
|
|
|
getOrderedKeys,
|
|
|
|
getLineData,
|
2018-07-05 12:18:02 +00:00
|
|
|
getUniqueKeys,
|
|
|
|
getUniqueDates,
|
2018-06-15 18:11:25 +00:00
|
|
|
getXScale,
|
|
|
|
getXGroupScale,
|
|
|
|
getXLineScale,
|
|
|
|
getYMax,
|
2018-07-05 12:18:02 +00:00
|
|
|
getYScale,
|
|
|
|
getYTickOffset,
|
2018-06-15 18:11:25 +00:00
|
|
|
} from '../utils';
|
|
|
|
|
2018-07-11 15:23:16 +00:00
|
|
|
const orderedKeys = [
|
|
|
|
{
|
|
|
|
key: 'Cap',
|
|
|
|
focus: true,
|
|
|
|
visible: true,
|
|
|
|
total: 34513697,
|
|
|
|
},
|
|
|
|
{
|
|
|
|
key: 'T-Shirt',
|
|
|
|
focus: true,
|
|
|
|
visible: true,
|
|
|
|
total: 14762281,
|
|
|
|
},
|
|
|
|
{
|
|
|
|
key: 'Sunglasses',
|
|
|
|
focus: true,
|
|
|
|
visible: true,
|
|
|
|
total: 12430349,
|
|
|
|
},
|
|
|
|
{
|
|
|
|
key: 'Polo',
|
|
|
|
focus: true,
|
|
|
|
visible: true,
|
|
|
|
total: 8712807,
|
|
|
|
},
|
|
|
|
{
|
|
|
|
key: 'Hoodie',
|
|
|
|
focus: true,
|
|
|
|
visible: true,
|
|
|
|
total: 6968764,
|
|
|
|
},
|
|
|
|
];
|
2018-06-15 18:11:25 +00:00
|
|
|
const orderedDates = [
|
2018-09-06 09:12:03 +00:00
|
|
|
'2018-05-30T00:00:00',
|
|
|
|
'2018-05-31T00:00:00',
|
|
|
|
'2018-06-01T00:00:00',
|
|
|
|
'2018-06-02T00:00:00',
|
|
|
|
'2018-06-03T00:00:00',
|
|
|
|
'2018-06-04T00:00:00',
|
2018-06-15 18:11:25 +00:00
|
|
|
];
|
2018-09-10 12:57:36 +00:00
|
|
|
const parseDate = d3UTCParse( '%Y-%m-%dT%H:%M:%S' );
|
2018-07-05 12:18:02 +00:00
|
|
|
const testUniqueKeys = getUniqueKeys( dummyOrders );
|
|
|
|
const testOrderedKeys = getOrderedKeys( dummyOrders, testUniqueKeys );
|
|
|
|
const testLineData = getLineData( dummyOrders, testOrderedKeys );
|
2018-09-10 12:57:36 +00:00
|
|
|
const testUniqueDates = getUniqueDates( testLineData, parseDate );
|
2018-07-05 12:18:02 +00:00
|
|
|
const testXScale = getXScale( testUniqueDates, 100 );
|
|
|
|
const testXLineScale = getXLineScale( testUniqueDates, 100 );
|
|
|
|
const testYMax = getYMax( testLineData );
|
|
|
|
const testYScale = getYScale( 100, testYMax );
|
2018-06-15 18:11:25 +00:00
|
|
|
|
|
|
|
describe( 'parseDate', () => {
|
|
|
|
it( 'correctly parse date in the expected format', () => {
|
2018-09-06 09:12:03 +00:00
|
|
|
const testDate = parseDate( '2018-06-30T00:00:00' );
|
2018-06-15 18:11:25 +00:00
|
|
|
const expectedDate = new Date( Date.UTC( 2018, 5, 30 ) );
|
|
|
|
expect( testDate.getTime() ).toEqual( expectedDate.getTime() );
|
|
|
|
} );
|
|
|
|
} );
|
|
|
|
|
|
|
|
describe( 'getUniqueKeys', () => {
|
|
|
|
it( 'returns an array of keys excluding date', () => {
|
2018-07-05 12:18:02 +00:00
|
|
|
// sort is a mutating action so we need a copy
|
|
|
|
const testUniqueKeysClone = testUniqueKeys.slice();
|
2018-07-11 15:23:16 +00:00
|
|
|
const sortedAZKeys = orderedKeys.map( d => d.key ).slice();
|
2018-07-05 12:18:02 +00:00
|
|
|
expect( testUniqueKeysClone.sort() ).toEqual( sortedAZKeys.sort() );
|
2018-06-15 18:11:25 +00:00
|
|
|
} );
|
|
|
|
} );
|
|
|
|
|
|
|
|
describe( 'getOrderedKeys', () => {
|
|
|
|
it( 'returns an array of keys order by value from largest to smallest', () => {
|
2018-07-05 12:18:02 +00:00
|
|
|
expect( testOrderedKeys ).toEqual( orderedKeys );
|
2018-06-15 18:11:25 +00:00
|
|
|
} );
|
|
|
|
} );
|
|
|
|
|
|
|
|
describe( 'getLineData', () => {
|
|
|
|
it( 'returns a sorted array of objects with category key', () => {
|
|
|
|
expect( testLineData ).toBeInstanceOf( Array );
|
|
|
|
expect( testLineData ).toHaveLength( 5 );
|
2018-07-11 15:23:16 +00:00
|
|
|
expect( testLineData.map( d => d.key ) ).toEqual( orderedKeys.map( d => d.key ) );
|
2018-06-15 18:11:25 +00:00
|
|
|
} );
|
|
|
|
|
|
|
|
testLineData.forEach( d => {
|
|
|
|
it( 'ensure a key and that the values property is an array', () => {
|
|
|
|
expect( d ).toHaveProperty( 'key' );
|
|
|
|
expect( d ).toHaveProperty( 'values' );
|
|
|
|
expect( d.values ).toBeInstanceOf( Array );
|
|
|
|
} );
|
|
|
|
|
|
|
|
it( 'ensure all unique dates exist in values array', () => {
|
|
|
|
const rowDates = d.values.map( row => row.date );
|
|
|
|
expect( rowDates ).toEqual( orderedDates );
|
|
|
|
} );
|
|
|
|
|
|
|
|
d.values.forEach( row => {
|
|
|
|
it( 'ensure a date property and that the values property is an array with date (parseable) and value properties', () => {
|
|
|
|
expect( row ).toHaveProperty( 'date' );
|
|
|
|
expect( row ).toHaveProperty( 'value' );
|
|
|
|
expect( parseDate( row.date ) ).not.toBeNull();
|
|
|
|
expect( typeof row.date ).toBe( 'string' );
|
|
|
|
expect( typeof row.value ).toBe( 'number' );
|
|
|
|
} );
|
|
|
|
} );
|
|
|
|
} );
|
|
|
|
} );
|
|
|
|
|
|
|
|
describe( 'getXScale', () => {
|
|
|
|
it( 'properly scale inputs to the provided domain and range', () => {
|
|
|
|
expect( testXScale( orderedDates[ 0 ] ) ).toEqual( 3 );
|
|
|
|
expect( testXScale( orderedDates[ 2 ] ) ).toEqual( 35 );
|
|
|
|
expect( testXScale( orderedDates[ orderedDates.length - 1 ] ) ).toEqual( 83 );
|
|
|
|
} );
|
|
|
|
it( 'properly scale inputs and test the bandwidth', () => {
|
|
|
|
expect( testXScale.bandwidth() ).toEqual( 14 );
|
|
|
|
} );
|
|
|
|
} );
|
|
|
|
|
|
|
|
describe( 'getXGroupScale', () => {
|
|
|
|
it( 'properly scale inputs based on the getXScale', () => {
|
2018-07-05 12:18:02 +00:00
|
|
|
const testXGroupScale = getXGroupScale( testOrderedKeys, testXScale );
|
2018-07-11 15:23:16 +00:00
|
|
|
expect( testXGroupScale( orderedKeys[ 0 ].key ) ).toEqual( 2 );
|
|
|
|
expect( testXGroupScale( orderedKeys[ 2 ].key ) ).toEqual( 6 );
|
|
|
|
expect( testXGroupScale( orderedKeys[ orderedKeys.length - 1 ].key ) ).toEqual( 10 );
|
2018-06-15 18:11:25 +00:00
|
|
|
} );
|
|
|
|
} );
|
|
|
|
|
|
|
|
describe( 'getXLineScale', () => {
|
|
|
|
it( 'properly scale inputs for the line', () => {
|
|
|
|
expect( testXLineScale( new Date( orderedDates[ 0 ] ) ) ).toEqual( 0 );
|
|
|
|
expect( testXLineScale( new Date( orderedDates[ 2 ] ) ) ).toEqual( 40 );
|
|
|
|
expect( testXLineScale( new Date( orderedDates[ orderedDates.length - 1 ] ) ) ).toEqual( 100 );
|
|
|
|
} );
|
|
|
|
} );
|
|
|
|
|
|
|
|
describe( 'getYMax', () => {
|
|
|
|
it( 'calculate the correct maximum y value', () => {
|
2018-09-05 11:20:12 +00:00
|
|
|
expect( testYMax ).toEqual( 15000000 );
|
2018-06-15 18:11:25 +00:00
|
|
|
} );
|
|
|
|
} );
|
2018-07-05 12:18:02 +00:00
|
|
|
|
|
|
|
describe( 'getYScale', () => {
|
|
|
|
it( 'properly scale the y values given the height and maximum y value', () => {
|
|
|
|
expect( testYScale( 0 ) ).toEqual( 100 );
|
|
|
|
expect( testYScale( testYMax ) ).toEqual( 0 );
|
|
|
|
} );
|
|
|
|
} );
|
|
|
|
|
|
|
|
describe( 'getYTickOffset', () => {
|
|
|
|
it( 'properly scale the y values for the y-axis ticks given the height and maximum y value', () => {
|
2018-11-15 15:27:55 +00:00
|
|
|
const testYTickOffset1 = getYTickOffset( 100, testYMax );
|
2018-07-05 12:18:02 +00:00
|
|
|
expect( testYTickOffset1( 0 ) ).toEqual( 112 );
|
|
|
|
expect( testYTickOffset1( testYMax ) ).toEqual( 12 );
|
|
|
|
} );
|
|
|
|
} );
|
|
|
|
|
|
|
|
describe( 'getdateSpaces', () => {
|
|
|
|
it( 'return an array used to space out the mouseover rectangles, used for tooltips', () => {
|
2018-10-17 18:08:34 +00:00
|
|
|
const testDateSpaces = getDateSpaces( dummyOrders, testUniqueDates, 100, testXLineScale );
|
2018-09-06 09:12:03 +00:00
|
|
|
expect( testDateSpaces[ 0 ].date ).toEqual( '2018-05-30T00:00:00' );
|
2018-07-05 12:18:02 +00:00
|
|
|
expect( testDateSpaces[ 0 ].start ).toEqual( 0 );
|
|
|
|
expect( testDateSpaces[ 0 ].width ).toEqual( 10 );
|
2018-09-06 09:12:03 +00:00
|
|
|
expect( testDateSpaces[ 3 ].date ).toEqual( '2018-06-02T00:00:00' );
|
2018-07-05 12:18:02 +00:00
|
|
|
expect( testDateSpaces[ 3 ].start ).toEqual( 50 );
|
|
|
|
expect( testDateSpaces[ 3 ].width ).toEqual( 20 );
|
2018-09-06 09:12:03 +00:00
|
|
|
expect( testDateSpaces[ testDateSpaces.length - 1 ].date ).toEqual( '2018-06-04T00:00:00' );
|
2018-07-05 12:18:02 +00:00
|
|
|
expect( testDateSpaces[ testDateSpaces.length - 1 ].start ).toEqual( 90 );
|
|
|
|
expect( testDateSpaces[ testDateSpaces.length - 1 ].width ).toEqual( 10 );
|
|
|
|
} );
|
|
|
|
} );
|
2018-10-24 11:13:17 +00:00
|
|
|
|
|
|
|
describe( 'compareStrings', () => {
|
|
|
|
it( 'return an array of unique words from s2 that dont appear in base string', () => {
|
|
|
|
expect( compareStrings( 'Jul 2018', 'Aug 2018' ).join( ' ' ) ).toEqual( 'Aug' );
|
|
|
|
expect( compareStrings( 'Jul 2017', 'Aug 2018' ).join( ' ' ) ).toEqual( 'Aug 2018' );
|
|
|
|
expect( compareStrings( 'Jul 2017', 'Jul 2018' ).join( ' ' ) ).toEqual( '2018' );
|
|
|
|
} );
|
|
|
|
} );
|