tests: move lifecycle functions to helper file

src/helpers/testLifecycle.js

@@ -0,0 +1,29 @@
+export function componentDidMount() {
+  didMountSwitchLatLng(this, false)
+}
+
+export function didMountSwitchLatLng(self, switchLatLng=false) {
+  self.createRandomMarkers(switchLatLng);
+  self.setState({startTime: performance.now()});
+  if(self.state.moveMarkers){
+    self.timer = setInterval(() => {
+      self.setState({currStep: self.state.currStep + 1});
+      self.calcMarkerPosition()
+    }, self.state.interval);
+  }
+}
+
+export function componentDidUpdate() {
+  if(this.state.currStep===this.state.noOfSteps){
+    let endTime = performance.now();
+    let duration = endTime - this.state.startTime
+    let msg = "Duration " + duration.toFixed(3) + " for " + this.state.noOfSteps + " steps"
+    console.log(msg)
+    this.markerInfoDiv.current.innerHTML = msg
+    this.setState({currStep: this.state.currStep + 1});
+  }
+}
+
+export function componentWillUnmount() {
+  clearInterval(this.timer);
+}

src/test/Googles.js

@@ -2,13 +2,19 @@ import React, {Profiler} from "react";
 import Google from "./../maps/Google";
 import {measureTime} from './../helpers/measureTime';
 import {CustomInput, Input} from "reactstrap";
+import {mapTestState} from "./../config/variables"
 import {
   createRandomMarkers,
   calcMarkerPosition,
   changeSwitch,
   setNoOfMarkers
 } from "./../helpers/randomMarkers";
-import {mapTestState} from "./../config/variables"
+import {
+  componentDidMount,
+  componentDidUpdate,
+  componentWillUnmount
+} from "./../helpers/testLifecycle"
+
 
 export default class Googles extends React.Component{
   constructor(props) {
@@ -22,32 +28,10 @@ export default class Googles extends React.Component{
     this.calcMarkerPosition = calcMarkerPosition.bind(this)
     this.changeSwitch = changeSwitch.bind(this)
     this.setNoOfMarkers = setNoOfMarkers.bind(this)
-  }
-
-  componentDidMount() {
-    this.createRandomMarkers();
-    this.setState({startTime: performance.now()});
-    if(this.state.moveMarkers){
-      this.timer = setInterval(() => {
-        this.setState({currStep: this.state.currStep + 1});
-        this.calcMarkerPosition()
-      }, this.state.interval);
-    }
-  }
-
-  componentDidUpdate() {
-    if(this.state.currStep===this.state.noOfSteps){
-      let endTime = performance.now();
-      let duration = endTime - this.state.startTime
-      let msg = "Duration " + duration.toFixed(3) + " for " + this.state.noOfSteps + " steps"
-      console.log(msg)
-      this.markerInfoDiv.current.innerHTML = msg
-      this.setState({currStep: this.state.currStep + 1});
-    }
-  }
 
-  componentWillUnmount() {
-    clearInterval(this.timer);
+    this.componentDidMount = componentDidMount.bind(this)
+    this.componentDidUpdate = componentDidUpdate.bind(this)
+    this.componentWillUnmount = componentWillUnmount.bind(this)
   }
 
   render(){

src/test/Leaflets.js

@@ -2,13 +2,19 @@ import React, {Profiler} from "react";
 import Leaflet from "./../maps/Leaflet";
 import {measureTime} from "./../helpers/measureTime";
 import {CustomInput, Input} from "reactstrap";
+import {mapTestState} from "./../config/variables"
 import {
   createRandomMarkers,
   calcMarkerPosition,
   changeSwitch,
   setNoOfMarkers
 } from "./../helpers/randomMarkers";
-import {mapTestState} from "./../config/variables"
+import {
+  componentDidMount,
+  componentDidUpdate,
+  componentWillUnmount
+} from "./../helpers/testLifecycle"
+
 
 export default class Leaflets extends React.Component{
   constructor(props) {
@@ -22,32 +28,10 @@ export default class Leaflets extends React.Component{
     this.calcMarkerPosition = calcMarkerPosition.bind(this)
     this.changeSwitch = changeSwitch.bind(this)
     this.setNoOfMarkers = setNoOfMarkers.bind(this)
-  }
-
-  componentDidMount() {
-    this.createRandomMarkers();
-    this.setState({startTime: performance.now()});
-    if(this.state.moveMarkers){
-      this.timer = setInterval(() => {
-        this.setState({currStep: this.state.currStep + 1});
-        this.calcMarkerPosition()
-      }, this.state.interval);
-    }
-  }
-
-  componentDidUpdate() {
-    if(this.state.currStep===this.state.noOfSteps){
-      let endTime = performance.now();
-      let duration = endTime - this.state.startTime
-      let msg = "Duration " + duration.toFixed(3) + " for " + this.state.noOfSteps + " steps"
-      console.log(msg)
-      this.markerInfoDiv.current.innerHTML = msg
-      this.setState({currStep: this.state.currStep + 1});
-    }
-  }
 
-  componentWillUnmount() {
-    clearInterval(this.timer);
+    this.componentDidMount = componentDidMount.bind(this)
+    this.componentDidUpdate = componentDidUpdate.bind(this)
+    this.componentWillUnmount = componentWillUnmount.bind(this)
   }
 
   render(){

src/test/MapGLs.js

@@ -2,13 +2,18 @@ import React, {Profiler} from "react";
 import MapGL from "./../maps/MapGL";
 import {measureTime} from './../helpers/measureTime';
 import {CustomInput, Input} from "reactstrap";
+import {mapTestState} from "./../config/variables"
 import {
   createRandomMarkers,
   calcMarkerPosition,
   changeSwitch,
   setNoOfMarkers
 } from "./../helpers/randomMarkers";
-import {mapTestState} from "./../config/variables"
+import {
+  didMountSwitchLatLng,
+  componentDidUpdate,
+  componentWillUnmount
+} from "./../helpers/testLifecycle"
 
 
 export default class MapGLs extends React.Component{
@@ -23,32 +28,13 @@ export default class MapGLs extends React.Component{
     this.calcMarkerPosition = calcMarkerPosition.bind(this)
     this.changeSwitch = changeSwitch.bind(this)
     this.setNoOfMarkers = setNoOfMarkers.bind(this)
-  }
 
-  componentDidMount() {
-    this.createRandomMarkers(true);
-    this.setState({startTime: performance.now()});
-    if(this.state.moveMarkers){
-      this.timer = setInterval(() => {
-        this.setState({currStep: this.state.currStep + 1});
-        this.calcMarkerPosition()
-      }, this.state.interval);
-    }
+    this.componentDidUpdate = componentDidUpdate.bind(this)
+    this.componentWillUnmount = componentWillUnmount.bind(this)
   }
 
-  componentDidUpdate() {
-    if(this.state.currStep===this.state.noOfSteps){
-      let endTime = performance.now();
-      let duration = endTime - this.state.startTime
-      let msg = "Duration " + duration.toFixed(3) + " for " + this.state.noOfSteps + " steps"
-      console.log(msg)
-      this.markerInfoDiv.current.innerHTML = msg
-      this.setState({currStep: this.state.currStep + 1});
-    }
-  }
-
-  componentWillUnmount() {
-    clearInterval(this.timer);
+  componentDidMount() {
+    didMountSwitchLatLng(this, true)
   }
 
   render(){

src/test/Mapboxes.js

@@ -2,13 +2,19 @@ import React, {Profiler} from "react";
 import Mapbox from "./../maps/Mapbox";
 import {measureTime} from './../helpers/measureTime';
 import {CustomInput, Input} from "reactstrap";
+import {mapTestState} from "./../config/variables"
 import {
   createRandomMarkers,
   calcMarkerPosition,
   changeSwitch,
   setNoOfMarkers
 } from "./../helpers/randomMarkers";
-import {mapTestState} from "./../config/variables"
+import {
+  didMountSwitchLatLng,
+  componentDidUpdate,
+  componentWillUnmount
+} from "./../helpers/testLifecycle"
+
 
 export default class MapGLs extends React.Component{
   constructor(props) {
@@ -22,32 +28,13 @@ export default class MapGLs extends React.Component{
     this.calcMarkerPosition = calcMarkerPosition.bind(this)
     this.changeSwitch = changeSwitch.bind(this)
     this.setNoOfMarkers = setNoOfMarkers.bind(this)
-  }
 
-  componentDidMount() {
-    this.createRandomMarkers(true);
-    this.setState({startTime: performance.now()});
-    if(this.state.moveMarkers){
-      this.timer = setInterval(() => {
-        this.setState({currStep: this.state.currStep + 1});
-        this.calcMarkerPosition()
-      }, this.state.interval);
-    }
-  }
-
-  componentDidUpdate() {
-    if(this.state.currStep===this.state.noOfSteps){
-      let endTime = performance.now();
-      let duration = endTime - this.state.startTime
-      let msg = "Duration " + duration.toFixed(3) + " for " + this.state.noOfSteps + " steps"
-      console.log(msg)
-      this.markerInfoDiv.current.innerHTML = msg
-      this.setState({currStep: this.state.currStep + 1});
-    }
+    this.componentDidUpdate = componentDidUpdate.bind(this)
+    this.componentWillUnmount = componentWillUnmount.bind(this)
   }
 
-  componentWillUnmount() {
-    clearInterval(this.timer);
+  componentDidMount() {
+    didMountSwitchLatLng(this, true)
   }
 
   render(){

src/test/Pigeons.js

@@ -2,13 +2,19 @@ import React, {Profiler} from "react";
 import Pigeon from "./../maps/Pigeon";
 import {measureTime} from './../helpers/measureTime';
 import {CustomInput, Input} from "reactstrap";
+import {mapTestState} from "./../config/variables"
 import {
   createRandomMarkers,
   calcMarkerPosition,
   changeSwitch,
   setNoOfMarkers
 } from "./../helpers/randomMarkers";
-import {mapTestState} from "./../config/variables"
+import {
+  componentDidMount,
+  componentDidUpdate,
+  componentWillUnmount
+} from "./../helpers/testLifecycle"
+
 
 export default class Pigeons extends React.Component{
   constructor(props) {
@@ -22,32 +28,10 @@ export default class Pigeons extends React.Component{
     this.calcMarkerPosition = calcMarkerPosition.bind(this)
     this.changeSwitch = changeSwitch.bind(this)
     this.setNoOfMarkers = setNoOfMarkers.bind(this)
-  }
-
-  componentDidMount() {
-    this.createRandomMarkers();
-    this.setState({startTime: performance.now()});
-    if(this.state.moveMarkers){
-      this.timer = setInterval(() => {
-        this.setState({currStep: this.state.currStep + 1});
-        this.calcMarkerPosition()
-      }, this.state.interval);
-    }
-  }
-
-  componentDidUpdate() {
-    if(this.state.currStep===this.state.noOfSteps){
-      let endTime = performance.now();
-      let duration = endTime - this.state.startTime
-      let msg = "Duration " + duration.toFixed(3) + " for " + this.state.noOfSteps + " steps"
-      console.log(msg)
-      this.markerInfoDiv.current.innerHTML = msg
-      this.setState({currStep: this.state.currStep + 1});
-    }
-  }
 
-  componentWillUnmount() {
-    clearInterval(this.timer);
+    this.componentDidMount = componentDidMount.bind(this)
+    this.componentDidUpdate = componentDidUpdate.bind(this)
+    this.componentWillUnmount = componentWillUnmount.bind(this)
   }
 
   render(){