Mercurial > gemma
changeset 4329:83eb99662a91
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.
author | Bernhard Reiter <bernhard@intevation.de> |
---|---|
date | Wed, 04 Sep 2019 17:05:43 +0200 |
parents | ff21b742b106 |
children | fe01e997d66f |
files | client/docs/developers.md client/src/store/fairwayavailability.js |
diffstat | 2 files changed, 43 insertions(+), 15 deletions(-) [+] |
line wrap: on
line diff
--- 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.)
--- 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 => {