Refactored unit tests to use the map composable

wegue-oss · Oct 28, 2024 · 17774c7 · 17774c7
1 parent 656eef6
commit 17774c7
Show file tree

Hide file tree

Showing 12 changed files with 219 additions and 145 deletions.
diff --git a/tests/unit/specs/components/attributeTable/AttributeTableWin.spec.js b/tests/unit/specs/components/attributeTable/AttributeTableWin.spec.js
@@ -36,10 +36,10 @@ describe('attributeTable/AttributeTableWin.vue', () => {
     });
 
     it('has correct default data', () => {
-      expect(vm.layers).to.be.an('array');
-      expect(vm.layers).to.have.lengthOf(0);
-      expect(vm.displayedLayers).to.be.an('array');
-      expect(vm.displayedLayers).to.have.lengthOf(0);
+      // expect(vm.layers).to.be.an('array');
+      // expect(vm.layers).to.have.lengthOf(0);
+      // expect(vm.displayedLayers).to.be.an('array');
+      // expect(vm.displayedLayers).to.have.lengthOf(0);
       expect(vm.selLayerLid).to.be.null;
     });
 
@@ -48,18 +48,18 @@ describe('attributeTable/AttributeTableWin.vue', () => {
     });
   });
 
-  describe('methods', () => {
-    beforeEach(() => {
-      comp = createWrapper();
-      vm = comp.vm;
-    });
+  // describe('methods', () => {
+  //   beforeEach(() => {
+  //     comp = createWrapper();
+  //     vm = comp.vm;
+  //   });
 
-    it('are implemented', () => {
-      expect(vm.onMapBound).to.be.a('function');
-    });
+  //   it('are implemented', () => {
+  //     expect(vm.onMapBound).to.be.a('function');
+  //   });
 
-    afterEach(() => {
-      comp.unmount();
-    });
-  });
+  //   afterEach(() => {
+  //     comp.unmount();
+  //   });
+  // });
 });
diff --git a/tests/unit/specs/components/bglayerswitcher/BgLayerList.spec.js b/tests/unit/specs/components/bglayerswitcher/BgLayerList.spec.js
@@ -1,6 +1,6 @@
-// import { reactive, toRaw } from 'vue';
 import { toRaw } from 'vue';
 import { shallowMount } from '@vue/test-utils';
+import { bindMap, unbindMap } from '@/composables/Map';
 import BgLayerList from '@/components/bglayerswitcher/BgLayerList';
 import OlMap from 'ol/Map';
 import VectorLayer from 'ol/layer/Vector';
@@ -21,6 +21,7 @@ function createWrapper (props = moduleProps) {
 describe('bglayerswitcher/BgLayerList.vue', () => {
   let comp;
   let vm;
+  let map;
 
   it('is defined', () => {
     expect(BgLayerList).to.not.be.an('undefined');
@@ -43,23 +44,6 @@ describe('bglayerswitcher/BgLayerList.vue', () => {
     });
   });
 
-  describe('data', () => {
-    beforeEach(() => {
-      comp = createWrapper();
-      vm = comp.vm;
-    });
-
-    it('has correct default data', () => {
-      expect(typeof BgLayerList.data).to.equal('function');
-      expect(vm.layers).to.be.an('array');
-      expect(vm.layers.length).to.eql(0);
-    });
-
-    afterEach(() => {
-      comp.unmount();
-    });
-  });
-
   describe('computed properties', () => {
     beforeEach(() => {
       comp = createWrapper();
@@ -79,12 +63,12 @@ describe('bglayerswitcher/BgLayerList.vue', () => {
         isBaseLayer: false,
         source: new VectorSource()
       });
-      const map = new OlMap({
+      map = new OlMap({
         layers: [layerIn, layerOut]
       });
-      // map.setLayers(reactive(map.getLayers()))
-      vm.map = map;
-      vm.onMapBound();
+      // vm.map = map;
+      // vm.onMapBound();
+      bindMap(map);
 
       expect(vm.displayedLayers.length).to.equal(1);
       const li = vm.displayedLayers[0];
@@ -109,9 +93,9 @@ describe('bglayerswitcher/BgLayerList.vue', () => {
       const map = new OlMap({
         layers: [layerIn]
       });
-      // map.setLayers(reactive(map.getLayers()))
-      vm.map = map;
-      vm.onMapBound();
+      // vm.map = map;
+      // vm.onMapBound();
+      bindMap(map);
 
       expect(vm.displayedLayers.length).to.equal(1);
 
@@ -121,6 +105,8 @@ describe('bglayerswitcher/BgLayerList.vue', () => {
     });
 
     afterEach(() => {
+      unbindMap();
+      map = undefined;
       comp.unmount();
     });
   });
@@ -132,7 +118,7 @@ describe('bglayerswitcher/BgLayerList.vue', () => {
     });
 
     it('are implemented', () => {
-      expect(typeof vm.onMapBound).to.equal('function');
+      // expect(typeof vm.onMapBound).to.equal('function');
       expect(typeof vm.onSelectLayer).to.equal('function');
     });
 
@@ -149,12 +135,12 @@ describe('bglayerswitcher/BgLayerList.vue', () => {
         isBaseLayer: true,
         source: new VectorSource()
       });
-      const map = new OlMap({
+      map = new OlMap({
         layers: [layerIn, layerOut]
       });
-      // map.setLayers(reactive(map.getLayers()))
-      vm.map = map;
-      vm.onMapBound();
+      // vm.map = map;
+      // vm.onMapBound();
+      bindMap(map);
 
       expect(layerIn.getVisible()).to.equal(true);
       expect(layerOut.getVisible()).to.equal(false);
@@ -168,6 +154,8 @@ describe('bglayerswitcher/BgLayerList.vue', () => {
     });
 
     afterEach(() => {
+      unbindMap();
+      map = undefined;
       comp.unmount();
     });
   });

diff --git a/tests/unit/specs/components/bglayerswitcher/BgLayerSwitcher.spec.js b/tests/unit/specs/components/bglayerswitcher/BgLayerSwitcher.spec.js
@@ -1,5 +1,6 @@
 import { nextTick } from 'vue';
 import { mount, shallowMount } from '@vue/test-utils';
+import { bindMap, unbindMap } from '@/composables/Map';
 import BgLayerSwitcher from '@/components/bglayerswitcher/BgLayerSwitcher';
 import OlMap from 'ol/Map';
 import VectorLayer from 'ol/layer/Vector';
@@ -16,6 +17,7 @@ function createWrapper (stubChildrenComponents = true) {
 describe('bglayerswitcher/BgLayerSwitcher.vue', () => {
   let comp;
   let vm;
+  let map;
 
   it('is defined', () => {
     expect(BgLayerSwitcher).to.not.be.an('undefined');
@@ -46,8 +48,8 @@ describe('bglayerswitcher/BgLayerSwitcher.vue', () => {
 
     it('has correct default data', () => {
       expect(vm.open).to.equal(false);
-      expect(vm.layers).to.be.an('array');
-      expect(vm.layers.length).to.eql(0);
+      // expect(vm.layers).to.be.an('array');
+      // expect(vm.layers.length).to.eql(0);
     });
 
     afterEach(() => {
@@ -74,12 +76,12 @@ describe('bglayerswitcher/BgLayerSwitcher.vue', () => {
         isBaseLayer: true,
         source: new VectorSource()
       });
-      const map = new OlMap({
+      map = new OlMap({
         layers: [layerIn]
       });
-      // map.setLayers(reactive(map.getLayers()))
-      vm.map = map;
-      vm.onMapBound();
+      // vm.map = map;
+      // vm.onMapBound();
+      bindMap(map);
 
       expect(vm.show).to.equal(false);
 
@@ -89,6 +91,8 @@ describe('bglayerswitcher/BgLayerSwitcher.vue', () => {
     });
 
     afterEach(() => {
+      unbindMap();
+      map = undefined;
       comp.unmount();
     });
   });
@@ -120,12 +124,12 @@ describe('bglayerswitcher/BgLayerSwitcher.vue', () => {
         isBaseLayer: true,
         source: new VectorSource()
       });
-      const map = new OlMap({
+      map = new OlMap({
         layers: [layerIn, layerOut]
       });
-      // map.setLayers(reactive(map.getLayers()))
-      vm.map = map;
-      vm.onMapBound();
+      // vm.map = map;
+      // vm.onMapBound();
+      bindMap(map);
       await nextTick()
 
       expect(vm.open).to.equal(false);
@@ -137,6 +141,8 @@ describe('bglayerswitcher/BgLayerSwitcher.vue', () => {
     });
 
     afterEach(() => {
+      unbindMap();
+      map = undefined;
       comp.unmount();
     });
   });

diff --git a/tests/unit/specs/components/geocoder/Geocoder.spec.js b/tests/unit/specs/components/geocoder/Geocoder.spec.js
@@ -1,4 +1,5 @@
 import { mount } from '@vue/test-utils';
+import { bindMap, unbindMap } from '@/composables/Map';
 import Geocoder from '@/components/geocoder/Geocoder';
 import { OpenStreetMap } from '@/components/geocoder/providers/osm';
 import { Photon } from '@/components/geocoder/providers/photon';
@@ -103,6 +104,7 @@ describe('geocoder/Geocoder.vue', () => {
   });
 
   describe('methods - search', () => {
+    let map;
     let axiosMock;
     let onQueryResultsSpy;
     let onQueryErrorSpy;
@@ -220,7 +222,9 @@ describe('geocoder/Geocoder.vue', () => {
 
     it('selected item watcher assigns result and zooms/centers Map at result', async () => {
       applyAxiosMock();
-      vm.map = new OlMap();
+      // vm.map = new OlMap();
+      map = new OlMap();
+      bindMap(map);
 
       const comboBox = comp.findComponent({ name: 'v-combobox' });
       comboBox.vm.$emit('update:search', queryString);
@@ -261,7 +265,10 @@ describe('geocoder/Geocoder.vue', () => {
       expect(onQueryErrorSpy).to.have.been.called;
     });
 
-    afterEach(function () {
+    afterEach(() => {
+      unbindMap();
+      map = undefined;
+
       if (axiosMock) {
         axiosMock.restore();
       }

diff --git a/tests/unit/specs/components/infoclick/InfoClickWin.spec.js b/tests/unit/specs/components/infoclick/InfoClickWin.spec.js
@@ -1,5 +1,6 @@
 import { toRaw } from 'vue';
 import { shallowMount } from '@vue/test-utils';
+import { bindMap, unbindMap } from '@/composables/Map';
 import InfoClickWin from '@/components/infoclick/InfoClickWin';
 import OlMap from 'ol/Map';
 import Feature from 'ol/Feature';
@@ -20,9 +21,9 @@ describe('infoclick/InfoClickWin.vue', () => {
     expect(typeof InfoClickWin).to.not.equal('undefined');
   });
 
-  it('has a created hook', () => {
-    expect(typeof InfoClickWin.created).to.equal('function');
-  });
+  // it('has a created hook', () => {
+  //   expect(typeof InfoClickWin.created).to.equal('function');
+  // });
 
   describe('props', () => {
     beforeEach(() => {
@@ -52,6 +53,8 @@ describe('infoclick/InfoClickWin.vue', () => {
   });
 
   describe('methods', () => {
+    let map;
+
     beforeEach(() => {
       comp = createWrapper();
       vm = comp.vm;
@@ -66,8 +69,9 @@ describe('infoclick/InfoClickWin.vue', () => {
         pixel: [0, 0],
         coordinate: [8, 8]
       };
-      const map = new OlMap();
-      vm.map = map;
+      map = new OlMap();
+      bindMap(map);
+      // vm.map = map;
       vm.onMapClick(mockEvt);
       expect(vm.attributeData).to.equal(null);
       expect(toRaw(vm.coordsData.coordinate)).to.equal(mockEvt.coordinate);
@@ -88,30 +92,34 @@ describe('infoclick/InfoClickWin.vue', () => {
           features: [feat]
         })
       });
-      const map = new OlMap({
+      map = new OlMap({
         layers: [layer]
       });
       map.forEachFeatureAtPixel = () => {
         vm.features.push([feat, layer]);
       };
-      vm.map = map;
+      // vm.map = map;
+      bindMap(map);
       vm.onMapClick(mockEvt);
       expect(vm.attributeData.foo).to.equal('bar');
       expect(toRaw(vm.coordsData.coordinate)).to.equal(mockEvt.coordinate);
       expect(toRaw(vm.coordsData.projection)).to.equal('EPSG:3857');
     });
 
     it('show resets data when module is closed', () => {
-      vm.map = new OlMap({});
+      // vm.map = new OlMap({});
+      map = new OlMap();
+      bindMap(map);
       vm.show(true);
       vm.show(false);
       expect(vm.attributeData).to.equal(null);
       expect(vm.coordsData).to.equal(null);
     });
 
     it('show registers map click when module is opened', () => {
-      const map = new OlMap();
-      vm.map = map;
+      map = new OlMap();
+      bindMap(map);
+      // vm.map = map;
       const onSPy = sinon.replace(map, 'on', sinon.fake(map.on));
 
       vm.show(false);
@@ -121,14 +129,21 @@ describe('infoclick/InfoClickWin.vue', () => {
     });
 
     it('show unregisters map click when module is closed', () => {
-      const map = new OlMap();
-      vm.map = map;
+      map = new OlMap();
+      bindMap(map);
+      // vm.map = map;
       const unSPy = sinon.replace(map, 'un', sinon.fake(map.un));
 
       vm.show(true);
       vm.show(false);
 
       expect(unSPy).to.have.been.calledOnceWithExactly('singleclick', vm.onMapClick);
     });
+
+    afterEach(() => {
+      unbindMap();
+      map = undefined;
+      comp.unmount();
+    });
   });
 });