# HG changeset patch # User Bernhard Reiter # Date 1567609543 -7200 # Node ID 83eb99662a91403105d5ae3bd994ae7300c2d85b # Parent ff21b742b1067cc4d91b9422ff5d013c02de2e83 client: improve ability to test FW diagrams * Restructure code in fairwayavailability.js to seperate external data retrieval and adding the data into the store. Good side effects are that using a mutation for setting test data is easier and only one commit call is necessary, which means less clutter in the state history. * Adding an example how to use this for testing to docs/developers.md . * Bump copyright year for one file. diff -r ff21b742b106 -r 83eb99662a91 client/docs/developers.md --- a/client/docs/developers.md Wed Sep 04 16:45:59 2019 +0200 +++ b/client/docs/developers.md Wed Sep 04 17:05:43 2019 +0200 @@ -2,3 +2,31 @@ * [How translations are handled](dev-translations.md) * [Rationale of some choices](dev-generalconsiderations.md) + +## Hints + +When testing the vuex store object can be accessed from the +webbrowsers console like + +```javascript +store = document.getElementsByTagName('a')[0].__vue__.$store +``` + +This allows for setting test values where getting real test data +is complicated. For example testing the diagramm for the +fairwayavailability (tested with Chromium 73 und gemma-2019-09-04): + +```javascript +data = store.state.fairwayavailability.csv + +data=`#time,# < LDC (164.0) [h],# >= LDC (164.0) [h],# < 230.0 [h],# >= 230.0 [h],# >= 250.0 [h] +05-2019,140,80,80,45,50 +06-2019,0,230.000,0.000,0.000 +07-2019,0,300,0.000,0.000,0.000 +08-2019,0.000,120.000,0.000,0.000,120.000 +` + +store.commit("fairwayavailability/setAvailableFairwayDepthData", data) +``` + +(Depends on the code structure in store/fairwayavailability.js.) diff -r ff21b742b106 -r 83eb99662a91 client/src/store/fairwayavailability.js --- a/client/src/store/fairwayavailability.js Wed Sep 04 16:45:59 2019 +0200 +++ b/client/src/store/fairwayavailability.js Wed Sep 04 17:05:43 2019 +0200 @@ -4,7 +4,7 @@ * SPDX-License-Identifier: AGPL-3.0-or-later * License-Filename: LICENSES/AGPL-3.0.txt * - * Copyright (C) 2018 by via donau + * Copyright (C) 2018, 2019 by via donau * – Österreichische Wasserstraßen-Gesellschaft mbH * Software engineering by Intevation GmbH * @@ -178,9 +178,6 @@ setSelectedFairwayAvailability: (state, feature) => { state.selectedFairwayAvailabilityFeature = feature; }, - setFwData: (state, fwData) => { - state.fwData = fwData; - }, setFwLNWLData: (state, fwLNWLData) => { state.fwLNWLData = fwLNWLData; }, @@ -195,8 +192,17 @@ state.fwLNWLOverviewData.splice(existingIndex, 1); state.fwLNWLOverviewData.push(data); }, - setLegend: (state, header) => { - const headerEntries = header.split(","); + setLegendLNWL: (state, headerLNWL) => { + state.headerLNWL = headerLNWL; + }, + // See docs/developers.md for an example how to directly + // call this method for testing. + setAvailableFairwayDepthData: (state, data) => { + state.csv = data; + const csv = data.split("\n").filter(x => x !== ""); //omit empty lines + + // setLegend + const headerEntries = csv.shift().split(","); headerEntries.shift(); headerEntries.shift(); state.legend = headerEntries.map(x => { @@ -204,9 +210,8 @@ entry = entry.replace("[h]", "").trim(); // omit unit return entry; }); - }, - setLegendLNWL: (state, headerLNWL) => { - this.headerLNWL = headerLNWL; + + state.fwData = transformAFD(csv); } }, actions: { @@ -247,12 +252,7 @@ headers: { "X-Gemma-Auth": localStorage.getItem("token") } }) .then(response => { - const { data } = response; - commit("setCSV", data); - const csv = data.split("\n").filter(x => x !== ""); //omit empty lines - commit("setLegend", csv.shift()); - let transformed = transformAFD(csv); - commit("setFwData", transformed); + commit("setAvailableFairwayDepthData", response.data); resolve(response); }) .catch(error => {