From f4c6c8309c2ce4e6ca009add002cc33c765a956a Mon Sep 17 00:00:00 2001
From: mbucknell <mbucknell@usgs.gov>
Date: Mon, 24 Feb 2020 15:51:24 -0600
Subject: [PATCH] All tests pass again. Still need to add setting url
parameters.
---
.../hydrograph/date-controls.spec.js | 6 +-
.../scripts/components/hydrograph/index.js | 16 +-
.../components/hydrograph/index.spec.js | 325 ++++++++++++------
assets/src/scripts/polyfills.js | 2 +-
assets/src/scripts/store/index.js | 3 +-
assets/src/scripts/store/index.spec.js | 18 +-
assets/tests/scripts/global-config.js | 6 +-
7 files changed, 253 insertions(+), 123 deletions(-)
diff --git a/assets/src/scripts/components/hydrograph/date-controls.spec.js b/assets/src/scripts/components/hydrograph/date-controls.spec.js
index 63081913a..68db5a9ef 100644
--- a/assets/src/scripts/components/hydrograph/date-controls.spec.js
+++ b/assets/src/scripts/components/hydrograph/date-controls.spec.js
@@ -176,15 +176,15 @@ describe('date-controls', () => {
it('Expects to retrieve the extended time series when the radio buttons are change', () => {
spyOn(Actions, 'retrieveExtendedTimeSeries').and.callThrough();
- let lastRadio = select('#one-year');
+ let lastRadio = select('#P1Y-input');
lastRadio.attr('checked', true);
lastRadio.dispatch('change');
expect(Actions.retrieveExtendedTimeSeries).toHaveBeenCalledWith('12345678', 'P1Y');
});
- it('Expects to show the date range from when the Custom radio is selected', () => {
- let customRadio = select('#custom-date-range');
+ it('Expects to show the date range form when the Custom radio is selected', () => {
+ let customRadio = select('#custom-input');
customRadio.attr('checked', true);
customRadio.dispatch('change');
diff --git a/assets/src/scripts/components/hydrograph/index.js b/assets/src/scripts/components/hydrograph/index.js
index 09f6a4562..b02ac0cfd 100644
--- a/assets/src/scripts/components/hydrograph/index.js
+++ b/assets/src/scripts/components/hydrograph/index.js
@@ -60,10 +60,7 @@ export const attachToNode = function (store,
store.dispatch(Actions.resizeUI(window.innerWidth, node.offsetWidth));
nodeElem
.select('.loading-indicator-container')
- .call(link(store, drawLoadingIndicator, createStructuredSelector({
- showLoadingIndicator: isLoadingTS('current', 'P7D'),
- sizeClass: () => 'fa-3x'
- })));
+ .call(drawLoadingIndicator, {showLoadingIndicator: true, sizeClass: 'fa-3x'});
// Fetch time zone
const fetchTimeZonePromise = store.dispatch(Actions.retrieveLocationTimeZone(config.siteLocation.latitude, config.siteLocation.longitude));
@@ -89,9 +86,7 @@ export const attachToNode = function (store,
if (period === 'P30D' || period === 'P1Y') {
store.dispatch(Actions.retrieveExtendedTimeSeries(siteno, period, currentParamCode));
} else if (startDT && endDT) {
- console.log('Waiting for time zone promise');
fetchTimeZonePromise.then(() => {
- console.log('time zone retrieved. Retrieving custom date range');
store.dispatch(Actions.retrieveDataForDateRange(siteno, startDT, endDT, currentParamCode));
});
}
@@ -99,7 +94,10 @@ export const attachToNode = function (store,
store.dispatch(Actions.retrieveMedianStatistics(siteno));
}
fetchDataPromise.then(() => {
- console.log('fetchDataPromise then is bein processed');
+ // Hide the loading indocatr
+ nodeElem
+ .select('.loading-indicator-container')
+ .call(drawLoadingIndicator, {showLoadingIndicator: false, sizeClass: 'fa-3x'});
if (!hasAnyTimeSeries(store.getState())) {
drawInfoAlert(nodeElem, {body: 'No time series data available for this site'});
} else {
@@ -147,9 +145,7 @@ export const attachToNode = function (store,
timeSeriesScalesByParmCd: timeSeriesScalesByParmCdSelector('current', 'P7D', SPARK_LINE_DIM)
}), store));
nodeElem.select('.provisional-data-alert')
- .call(link(store, function (elem, allTimeSeries) {
- elem.attr('hidden', Object.keys(allTimeSeries).length ? null : true);
- }, getTimeSeries));
+ .attr('hidden', null);
}
}
});
diff --git a/assets/src/scripts/components/hydrograph/index.spec.js b/assets/src/scripts/components/hydrograph/index.spec.js
index 83845467f..4b7f60f4b 100644
--- a/assets/src/scripts/components/hydrograph/index.spec.js
+++ b/assets/src/scripts/components/hydrograph/index.spec.js
@@ -171,15 +171,232 @@ describe('Hydrograph charting and Loading indicators and data alerts', () => {
select('#hydrograph').remove();
});
- it('empty graph displays warning', () => {
+ it('expect alert if no siteno defined', () => {
attachToNode({}, graphNode, {});
expect(graphNode.innerHTML).toContain('No data is available');
});
+ describe('Tests for initial data fetching when showOnlyGraph is false (the default)', () => {
+ let store;
+
+ beforeEach(() => {
+ store = configureStore({});
+ });
+
+ it('loading-indicator is shown until initial data has been retrieved', () => {
+ attachToNode(store, graphNode, {
+ siteno: '1234568'
+ });
+
+ expect(select(graphNode).select('.loading-indicator').size()).toBe(1);
+ });
+
+ it('Expects retrieveLocationTimeZone to be called', () => {
+ spyOn(Actions, 'retrieveLocationTimeZone').and.callThrough();
+ attachToNode(store, graphNode, {
+ siteno: '12345678'
+ });
+
+ expect(Actions.retrieveLocationTimeZone).toHaveBeenCalled();
+ });
+
+ describe('Always retrieve the 7 day data and median statistics', () => {
+
+ beforeEach(() => {
+ spyOn(Actions, 'retrieveTimeSeries').and.callThrough();
+ spyOn(Actions, 'retrieveMedianStatistics').and.callThrough();
+ });
+
+ it('Retrieve if no date parameters are used', () => {
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065'
+ });
+
+ expect(Actions.retrieveTimeSeries).toHaveBeenCalledWith('12345678');
+ expect(Actions.retrieveMedianStatistics).toHaveBeenCalledWith('12345678');
+ });
+
+ it('Retrieve if period parameters is used', () => {
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065',
+ period: 'P30D'
+ });
+
+ expect(Actions.retrieveTimeSeries).toHaveBeenCalledWith('12345678');
+ expect(Actions.retrieveMedianStatistics).toHaveBeenCalledWith('12345678');
+ });
+
+ it('Retrieve if startDT and endDT parameters are used', () => {
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065',
+ startDT: '2010-01-01',
+ endDT: '2010-03-01'
+ });
+
+ expect(Actions.retrieveTimeSeries).toHaveBeenCalledWith('12345678');
+ expect(Actions.retrieveMedianStatistics).toHaveBeenCalledWith('12345678');
+ });
+ });
+
+ describe('Retrieve additional data if indicated', () => {
+ beforeEach(() => {
+ spyOn(Actions, 'retrieveTimeSeries').and.returnValue(function() {
+ return Promise.resolve({});
+ });
+ spyOn(Actions, 'retrieveExtendedTimeSeries').and.callThrough();
+ spyOn(Actions, 'retrieveDataForDateRange').and.callThrough();
+ });
+
+ it('Expect to not retrieve additional time series if not indicated', (done) => {
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065'
+ });
+
+ window.requestAnimationFrame(() => {
+ expect(Actions.retrieveExtendedTimeSeries).not.toHaveBeenCalled();
+ expect(Actions.retrieveDataForDateRange).not.toHaveBeenCalled();
+ done();
+ });
+ });
+ it('should retrieve extend time series if period set', (done) => {
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065',
+ period: 'P30D'
+ });
+
+ window.requestAnimationFrame(() => {
+ expect(Actions.retrieveExtendedTimeSeries).toHaveBeenCalledWith('12345678', 'P30D', '00065');
+ expect(Actions.retrieveDataForDateRange).not.toHaveBeenCalled();
+ done();
+ });
+ });
+
+ it('should not retrieve data for date range if time zone has not been fetched', (done) => {
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065',
+ startDT: '2010-01-01',
+ endDT: '2010-03-01'
+ });
+
+ window.requestAnimationFrame(() => {
+ expect(Actions.retrieveExtendedTimeSeries).not. toHaveBeenCalled();
+ expect(Actions.retrieveDataForDateRange).not.toHaveBeenCalled();
+ done();
+ });
+ });
+
+ it('should retrieve data for date range if time zone has been fetched', (done) => {
+ spyOn(Actions, 'retrieveLocationTimeZone').and.returnValue(function() {
+ return Promise.resolve({});
+ });
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065',
+ startDT: '2010-01-01',
+ endDT: '2010-03-01'
+ });
+
+ window.requestAnimationFrame(() => {
+ expect(Actions.retrieveExtendedTimeSeries).not. toHaveBeenCalled();
+ expect(Actions.retrieveDataForDateRange).toHaveBeenCalledWith('12345678', '2010-01-01', '2010-03-01', '00065');
+ done();
+ });
+ });
+ });
+ });
+
+ describe('Tests for initial data fetching when showOnlyGraph is true ', () => {
+ let store;
+
+ beforeEach(() => {
+ store = configureStore({});
+ spyOn(Actions, 'retrieveTimeSeries').and.callThrough();
+ spyOn(Actions, 'retrieveCustomTimePeriodTimeSeries').and.callThrough();
+ spyOn(Actions, 'retrieveDataForDateRange');
+ });
+
+ it('should retrieve custom time period if period is specificed', (done) => {
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065',
+ period: 'P20D',
+ showOnlyGraph: true
+ });
+
+ window.requestAnimationFrame(() => {
+ expect(Actions.retrieveTimeSeries).not.toHaveBeenCalled();
+ expect(Actions.retrieveCustomTimePeriodTimeSeries).toHaveBeenCalledWith('12345678', '00065', 'P20D');
+ expect(Actions.retrieveDataForDateRange).not.toHaveBeenCalled();
+ done();
+ });
+ });
+
+ it('should not retrieve date range for date range parameters if time zone has not been fetched', (done) => {
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065',
+ startDT: '2010-01-01',
+ endDT: '2010-03-01',
+ showOnlyGraph: true
+ });
+
+ window.requestAnimationFrame(() => {
+ expect(Actions.retrieveTimeSeries).not.toHaveBeenCalled();
+ expect(Actions.retrieveCustomTimePeriodTimeSeries).not.toHaveBeenCalled();
+ expect(Actions.retrieveDataForDateRange).not.toHaveBeenCalled();
+ done();
+ });
+ });
+
+ it('should retrieve date range for date range parameters if time zone has been fetched', (done) => {
+ spyOn(Actions, 'retrieveLocationTimeZone').and.returnValue(function() {
+ return Promise.resolve({});
+ });
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065',
+ startDT: '2010-01-01',
+ endDT: '2010-03-01',
+ showOnlyGraph: true
+ });
+
+ window.requestAnimationFrame(() => {
+ expect(Actions.retrieveTimeSeries).not.toHaveBeenCalled();
+ expect(Actions.retrieveCustomTimePeriodTimeSeries).not.toHaveBeenCalled();
+ expect(Actions.retrieveDataForDateRange).toHaveBeenCalledWith('12345678', '2010-01-01', '2010-03-01', '00065');
+ done();
+ });
+ });
+
+ it('should retrieve time series if no custom period or date range', (done) => {
+ attachToNode(store, graphNode, {
+ siteno: '12345678',
+ parameterCode: '00065',
+ showOnlyGraph: true
+ });
+
+ window.requestAnimationFrame(() => {
+ expect(Actions.retrieveTimeSeries).toHaveBeenCalledWith('12345678', ['00065']);
+ expect(Actions.retrieveCustomTimePeriodTimeSeries).not.toHaveBeenCalled();
+ expect(Actions.retrieveDataForDateRange).not.toHaveBeenCalled();
+ done();
+ });
+ });
+ });
+
describe('graphNode contains the expected elements when showOnlyGraph is false', () => {
/* eslint no-use-before-define: 0 */
let store;
- beforeEach(() => {
+ beforeEach((done) => {
+ spyOn(Actions, 'retrieveTimeSeries').and.returnValue(function() {
+ return Promise.resolve({});
+ });
store = configureStore({
...TEST_STATE,
series: {
@@ -222,6 +439,9 @@ describe('Hydrograph charting and Loading indicators and data alerts', () => {
});
attachToNode(store, graphNode, {siteno: '123456788'});
+ window.requestAnimationFrame(() => {
+ done();
+ });
});
it('should render the correct number of svg nodes', () => {
@@ -294,6 +514,9 @@ describe('Hydrograph charting and Loading indicators and data alerts', () => {
describe('hide elements when showOnlyGraph is set to true', () => {
let store;
beforeEach(() => {
+ spyOn(Actions, 'retrieveTimeSeries').and.returnValue(function() {
+ return Promise.resolve({});
+ });
store = configureStore({
...TEST_STATE,
series: {
@@ -359,100 +582,4 @@ describe('Hydrograph charting and Loading indicators and data alerts', () => {
expect(selectAll('#select-time-series').size()).toBe(0);
});
});
-
- describe('hiding/showing provisional alert', () => {
-
- it('Expects the provisional alert to be visible when time series data is provided', () => {
- let store = configureStore(TEST_STATE);
- attachToNode(store, graphNode, {siteno: '12345678'});
-
- expect(select(graphNode).select('.provisional-data-alert').attr('hidden')).toBeNull();
- });
-
- it('Expects the provisional alert to be hidden when no time series data is provided', () => {
- let store = configureStore({
- ...TEST_STATE,
- series: {},
- timeSeriesState: {
- ...TEST_STATE.timeSeriesState,
- currentVariableID: ''
- }
- });
- attachToNode(store, graphNode, {siteno: '12345678'});
-
- expect(select(graphNode).select('.provisional-data-alert').attr('hidden')).toBe('true');
- });
- });
-
- describe('Tests for loading indicators', () => {
-
- it('Expects the graph loading indicator to be visible if the current 7 day data is being loaded', () => {
- const newTestState = {
- ...TEST_STATE,
- timeSeriesState: {
- ...TEST_STATE.timeSeriesState,
- currentDateRange: 'P7D',
- loadingTSKeys: ['current:P7D']
- }
- };
- let store = configureStore(newTestState);
- spyOn(store, 'dispatch').and.callThrough();
- attachToNode(store, graphNode, {siteno: '12345678'});
-
- expect(select(graphNode).select('.loading-indicator-container').select('.loading-indicator').size()).toBe(1);
- });
-
- it('Expects the graph loading indicator to not be visible if the current 7 day data is not being loaded', () => {
- const newTestState = {
- ...TEST_STATE,
- timeSeriesState: {
- ...TEST_STATE.timeSeriesState,
- currentDateRange: 'P7D'
- }
- };
- let store = configureStore(newTestState);
- spyOn(store, 'dispatch').and.callThrough();
- attachToNode(store, graphNode, {siteno: '12345678'});
- store.dispatch(Actions.removeTimeSeriesLoading(['current:P7D']));
-
- expect(select(graphNode).select('.loading-indicator-container').select('.loading-indicator').size()).toBe(0);
- });
-
- it('Expects the date range control loading indicator to be visible if loading is in progress for the selected date range', () => {
- const newTestState = {
- ...TEST_STATE,
- timeSeriesState: {
- ...TEST_STATE.timeSeriesState,
- currentDateRange: 'P30D',
- loadingTSKeys: ['current:P30D:00060']
- }
- };
- let store = configureStore(newTestState);
- attachToNode(store, graphNode, {siteno: '12345678'});
-
- expect(select(graphNode).select('#ts-daterange-select-container').select('.loading-indicator').size()).toBe(1);
- });
-
- it('Expects the date range control loading indicator to not be visible if not loading for the selected date range', () => {
- const newTestState = {
- ...TEST_STATE,
- timeSeriesState: {
- ...TEST_STATE.timeSeriesState,
- currentDateRange: 'P30D',
- loadingTSKeys: ['compare:P30D:00060']
- }
- };
- let store = configureStore(newTestState);
- attachToNode(store, graphNode, {siteno: '12345678'});
-
- expect(select(graphNode).select('#ts-daterange-select-container').select('.loading-indicator').size()).toBe(0);
- });
-
- it('Expects that the no data alert will not be shown if there is data', () => {
- let store = configureStore(TEST_STATE);
- attachToNode(store, graphNode, {siteno: '12345678'});
-
- expect(select(graphNode).select('#no-data-message').size()).toBe(0);
- });
- });
-});
+});
\ No newline at end of file
diff --git a/assets/src/scripts/polyfills.js b/assets/src/scripts/polyfills.js
index 63e8f539f..f8229177e 100644
--- a/assets/src/scripts/polyfills.js
+++ b/assets/src/scripts/polyfills.js
@@ -11,7 +11,7 @@ import 'core-js/features/math/sign';
import 'core-js/features/math/trunc';
import 'core-js/features/number/is-integer';
import 'core-js/features/number/is-nan';
-import 'core-js/features/from-entries';
+import 'core-js/features/object/from-entries';
import 'core-js/features/object/values';
import 'core-js/features/promise';
import 'core-js/features/string/repeat';
diff --git a/assets/src/scripts/store/index.js b/assets/src/scripts/store/index.js
index 32bad7cfe..1a70c744a 100644
--- a/assets/src/scripts/store/index.js
+++ b/assets/src/scripts/store/index.js
@@ -101,8 +101,7 @@ export const Actions = {
// Update the application state
dispatch(Actions.toggleTimeSeries('current', true));
const variable = getCurrentVariableId(collection.timeSeries || {}, collection.variables || {});
- const action = Actions.setCurrentVariable(variable);
- dispatch(action);
+ dispatch(Actions.setCurrentVariable(variable));
dispatch(Actions.setGageHeight(getLatestValue(collection, GAGE_HEIGHT_CD)));
},
() => {
diff --git a/assets/src/scripts/store/index.spec.js b/assets/src/scripts/store/index.spec.js
index 51452d634..81d7761c8 100644
--- a/assets/src/scripts/store/index.spec.js
+++ b/assets/src/scripts/store/index.spec.js
@@ -164,18 +164,18 @@ describe('Redux store', () => {
it('should fetch the times series, retrieve the compare time series once the time series is fetched and fetch the statistics', (done) => {
spyOn(Actions, 'addSeriesCollection');
- spyOn(Actions, 'retrieveLocationTimeZone');
spyOn(Actions, 'retrieveCompareTimeSeries');
spyOn(Actions, 'toggleTimeSeries');
spyOn(Actions, 'setCurrentVariable');
+ spyOn(Actions, 'setGageHeight');
let p = Actions.retrieveTimeSeries(SITE_NO)(mockDispatch, mockGetState);
+ expect(Actions.addTimeSeriesLoading.calls.count()).toBe(1);
+ expect(Actions.addTimeSeriesLoading.calls.argsFor(0)[0]).toEqual(['current:P7D']);
p.then(() => {
- expect(mockDispatch.calls.count()).toBe(8);
+ expect(mockDispatch.calls.count()).toBe(7);
expect(Actions.addSeriesCollection.calls.count()).toBe(1);
expect(Actions.addSeriesCollection.calls.argsFor(0)[0]).toBe('current');
- expect(Actions.retrieveLocationTimeZone.calls.count()).toBe(1);
- expect(Actions.retrieveLocationTimeZone.calls.argsFor(0)).toEqual([42.72027778, -90.8191667]);
expect(Actions.removeTimeSeriesLoading.calls.count()).toBe(1);
expect(Actions.removeTimeSeriesLoading.calls.argsFor(0)[0]).toEqual(['current:P7D']);
expect(Actions.retrieveCompareTimeSeries.calls.count()).toBe(1);
@@ -184,7 +184,7 @@ describe('Redux store', () => {
expect(Actions.toggleTimeSeries.calls.argsFor(0)).toEqual(['current', true]);
expect(Actions.setCurrentVariable.calls.count()).toBe(1);
expect(Actions.setCurrentVariable.calls.argsFor(0)).toEqual(['45807197']);
-
+ expect(Actions.setGageHeight.calls.count()).toBe(1);
done();
});
});
@@ -636,20 +636,24 @@ describe('Redux store', () => {
mockGetState.and.returnValue(TEST_STATE);
spyOn(Actions, 'retrieveCompareTimeSeries');
spyOn(Actions, 'addSeriesCollection');
+ spyOn(Actions, 'setCurrentDateRange');
let p = Actions.retrieveExtendedTimeSeries('12345678', 'P30D')(mockDispatch, mockGetState);
request = jasmine.Ajax.requests.mostRecent();
request.respondWith({
responseText: MOCK_DATA,
status: 200
});
+ expect(Actions.addTimeSeriesLoading.calls.count()).toBe(1);
+ expect(Actions.addTimeSeriesLoading.calls.argsFor(0)[0]).toEqual(['current:P30D:00060']);
+ expect(Actions.setCurrentDateRange.calls.count()).toBe(1);
+ expect(Actions.setCurrentDateRange.calls.argsFor(0)[0], 'P30D');
p.then(() => {
- expect(mockDispatch.calls.count()).toBe(6);
+ expect(mockDispatch.calls.count()).toBe(5);
expect(Actions.addSeriesCollection).toHaveBeenCalled();
expect(Actions.addSeriesCollection.calls.argsFor(0)[0]).toEqual('current:P30D:00060');
expect(Actions.retrieveCompareTimeSeries).toHaveBeenCalled();
expect(Actions.retrieveCompareTimeSeries.calls.argsFor(0)[1]).toEqual('P30D');
expect(Actions.removeTimeSeriesLoading).toHaveBeenCalledWith(['current:P30D:00060']);
- expect(Actions.toggleTimeSeries).toHaveBeenCalledWith('median', true);
done();
});
});
diff --git a/assets/tests/scripts/global-config.js b/assets/tests/scripts/global-config.js
index b8fe1b79f..6fb291e6f 100644
--- a/assets/tests/scripts/global-config.js
+++ b/assets/tests/scripts/global-config.js
@@ -1,7 +1,11 @@
var CONFIG = {
TIMESERIES_AUDIO_ENABLED: true,
MULTIPLE_TIME_SERIES_METADATA_SELECTOR_ENABLED: true,
- FIM_GIS_ENDPOINT: 'https:/fakelegendservice.com'
+ FIM_GIS_ENDPOINT: 'https:/fakelegendservice.com',
+ siteLocation: {
+ latitude: 43.5,
+ longitude: -100.0
+ }
};
var mockOscillator = function() {
--
GitLab