Upgrade Eslint to 8.47

package.json

@@ -38,17 +38,17 @@
     "@vue/cli-plugin-eslint": "~5.0.8",
     "@vue/cli-plugin-unit-mocha": "~5.0.8",
     "@vue/cli-service": "~5.0.8",
-    "@vue/eslint-config-standard": "^6.1.0",
+    "@vue/eslint-config-standard": "^8.0.1",
     "@vue/test-utils": "^1.1.3",
     "babel-plugin-istanbul": "^6.1.1",
     "chai": "^4.2.0",
     "copy-dir": "^1.2.0",
     "cross-env": "^7.0.3",
-    "eslint": "^7.32.0",
-    "eslint-plugin-import": "^2.25.3",
+    "eslint": "^8.47.0",
+    "eslint-plugin-import": "^2.28.1",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-promise": "^5.1.0",
-    "eslint-plugin-vue": "^7.20.0",
+    "eslint-plugin-promise": "^6.1.1",
+    "eslint-plugin-vue": "^9.17.0",
     "gh-pages": "^1.1.0",
     "karma": "^6.4.0",
     "karma-chrome-launcher": "^3.1.1",

src/WguEventBus.js

@@ -1,4 +1,3 @@
-
 import Vue from 'vue'
 
 // Vue instance acting as app-wide event-bus

src/components/maprecorder/MapRecorderWin.vue

@@ -187,7 +187,7 @@ export default {
       /**
        * The video codecs supported by the browser.
        */
-      mimeTypes: mimeTypes,
+      mimeTypes,
       /**
        * Timer handle for canvas draw callbacks.
        */

src/components/measuretool/MeasureWin.vue

@@ -123,7 +123,7 @@ export default {
       // wrap geom into object, otherwise the injection into childs does
       // not work. Maybe the OL object does not feel changed for Vue
       this.measureGeom = {
-        geom: geom
+        geom
       };
     }
   }

src/components/measuretool/OlMeasureController.js

@@ -1,4 +1,3 @@
-
 import DrawInteraction from 'ol/interaction/Draw';
 import { unByKey } from 'ol/Observable.js';
 import VectorSource from 'ol/source/Vector';
@@ -45,7 +44,7 @@ export default class OlMeasureController {
     this.measureLayer = new VectorLayer({
       lid: 'wgu-measure-layer',
       displayInLayerList: false,
-      source: source,
+      source,
       style: new Style({
         fill: new Fill({
           color: measureConf.fillColor || 'rgba(255, 255, 255, 0.2)'
@@ -77,7 +76,7 @@ export default class OlMeasureController {
     const type = (measureType === 'area' ? 'Polygon' : 'LineString');
     const draw = new DrawInteraction({
       source: me.source,
-      type: type,
+      type,
       maxPoints: measureType === 'angle' ? 2 : undefined,
       style: new Style({
         fill: new Fill({

src/components/ol/HoverController.js

@@ -99,7 +99,7 @@ export default class HoverController {
         me.getWMSFeaturesAsync(map, layer, coordinate, me.pendingRequestsCancelSrc)
           .then(function (features) {
             featureInfos.push(...features.map((feat) => {
-              return { layer: layer, feature: feat };
+              return { layer, feature: feat };
             }));
             me.displayTooltip(featureInfos, coordinate)
           })
@@ -112,7 +112,7 @@ export default class HoverController {
         resetTooltip = false;
         const features = me.getVectorFeatures(map, layer, pixel);
         featureInfos.push(...features.map((feat) => {
-          return { layer: layer, feature: feat };
+          return { layer, feature: feat };
         }));
         me.displayTooltip(featureInfos, coordinate)
       }
@@ -164,7 +164,7 @@ export default class HoverController {
 
       const request = {
         method: 'GET',
-        url: url,
+        url,
         cancelToken: cancelTokenSrc?.token
       };
       axios(request)
@@ -205,7 +205,7 @@ export default class HoverController {
       WguEventBus.$emit(me.activeOverlayId + '-update-overlay', false);
     };
     WguEventBus.$emit(overlayId + '-update-overlay', true, coordinate, {
-      feature: feature,
+      feature,
       hoverAttribute: hoverAttr
     });
     me.activeOverlayId = overlayId;

src/components/ol/Map.vue

@@ -52,11 +52,11 @@ export default {
       mapGeodataDragDop: this.$appConfig.mapGeodataDragDop,
       // mapping format string to OL module / class
       formatMapping: {
-        GPX: GPX,
-        GeoJSON: GeoJSON,
-        IGC: IGC,
-        KML: KML,
-        TopoJSON: TopoJSON
+        GPX,
+        GeoJSON,
+        IGC,
+        KML,
+        TopoJSON
       },
       dragDropLayerCreated: false
     }
@@ -163,12 +163,12 @@ export default {
 
     this.map = new Map({
       layers: [],
-      controls: controls,
-      interactions: interactions,
+      controls,
+      interactions,
       view: new View({
         center: this.center,
         zoom: this.zoom,
-        projection: projection
+        projection
       })
     });
 

src/components/ol/PermalinkController.js

@@ -108,7 +108,7 @@ export default class PermalinkController {
       const key = layer.on('change:visible', () => {
         this.onMapChange();
       });
-      this.layerListeners.push({ key: key, layer: layer });
+      this.layerListeners.push({ key, layer });
     });
   }
 
@@ -284,8 +284,8 @@ export default class PermalinkController {
     }
     return {
       zoom: mapView.getZoom(),
-      center: center,
-      extent: extent,
+      center,
+      extent,
       rotation: mapView.getRotation(),
       layers: this.getLayerIds()
     };

src/components/overviewmap/OverviewMapController.js

@@ -23,7 +23,7 @@ export default class OverviewMapController {
 
     this.overviewMapControl = new OverviewMap({
       className: 'ol-overviewmap wgu-overviewmap-ctrl',
-      target: target,
+      target,
       collapsible: false,
       rotateWithView: this.conf.rotateWithView
     });

src/factory/Layer.js

@@ -121,7 +121,7 @@ export const LayerFactory = {
       ...this.getCommonLayerOptions(lConf),
       source: new ImageWMS({
         url: lConf.url,
-        params: params,
+        params,
         serverType: lConf.serverType,
         ratio: lConf.ratio,
         interpolate: lConf.interpolate,
@@ -151,7 +151,7 @@ export const LayerFactory = {
       ...this.getCommonLayerOptions(lConf),
       source: new TileWmsSource({
         url: lConf.url,
-        params: params,
+        params,
         serverType: lConf.serverType,
         tileGrid: lConf.tileGrid,
         projection: lConf.projection,

src/util/ViewAnimation.js

@@ -209,7 +209,7 @@ const PanAnimation = {
 
     view.animate({
       center: location,
-      duration: duration,
+      duration,
       zoom: Math.min(zoom, maxZoom)
     }, callback);
   }
@@ -304,7 +304,7 @@ const FlyAnimation = {
 
     view.animate({
       center: location,
-      duration: duration
+      duration
     }, callback);
 
     view.animate({
@@ -403,13 +403,13 @@ const BounceAnimation =
 
     view.animate({
       center: location,
-      duration: duration,
+      duration,
       easing: this.elastic
     }, callback);
 
     view.animate({
       zoom: Math.min(zoom, maxZoom),
-      duration: duration
+      duration
     }, callback);
   }
 };

tests/unit/specs/components/layerlist/LayerLegendImage.spec.js

@@ -96,7 +96,7 @@ describe('layerlist/LayerLegendImage.vue', () => {
         legendUrl: 'http://my-image.png'
       });
 
-      await comp.setProps({ layer: layer });
+      await comp.setProps({ layer });
       expect(vm.legendURL).to.equal('http://my-image.png');
     });
 
@@ -109,7 +109,7 @@ describe('layerlist/LayerLegendImage.vue', () => {
           width: 14
         }
       });
-      await comp.setProps({ layer: layer });
+      await comp.setProps({ layer });
       expect(vm.legendURL).to.equal('http://my-image.png?transparent=true&width=14&SCALE=139770566.00717944&language=en');
     });
 

tests/unit/specs/components/modulecore/MapOverlay.spec.js

@@ -1,4 +1,3 @@
-
 import MapOverlay from '@/components/modulecore/MapOverlay'
 import { WguEventBus } from '@/WguEventBus'
 import OlMap from 'ol/Map';

tests/unit/specs/components/ol/Map.spec.js

@@ -79,7 +79,7 @@ describe('ol/Map.vue', () => {
     let comp;
     let vm;
     beforeEach(() => {
-      Vue.prototype.$appConfig = { tileGridDefs: tileGridDefs };
+      Vue.prototype.$appConfig = { tileGridDefs };
       comp = mount(Map, { vuetify });
       vm = comp.vm;
     });
@@ -242,7 +242,7 @@ describe('ol/Map.vue', () => {
         projectionDefs: [
           ['EPSG:28992', '+proj=sterea +lat_0=52.15616055555555 +lon_0=5.38763888888889 +k=0.999908 +x_0=155000 +y_0=463000 +ellps=bessel +units=m +towgs84=565.2369,50.0087,465.658,-0.406857330322398,0.350732676542563,-1.8703473836068,4.0812 +no_defs']
         ],
-        tileGridDefs: tileGridDefs,
+        tileGridDefs,
         mapLayers: [{
           type: 'XYZ',
           lid: 'brtachtergrondkaart',

tests/unit/specs/components/overviewmap/OverviewMapPanel.spec.js

@@ -1,4 +1,3 @@
-
 import { shallowMount } from '@vue/test-utils';
 import OverviewMapPanel from '@/components/overviewmap/OverviewMapPanel';
 import OlMap from 'ol/Map';

tests/unit/specs/util/ViewAnimation.spec.js

@@ -36,7 +36,7 @@ describe('ViewAnimationUtil', () => {
     describe('animation type ' + animType, () => {
       beforeEach(() => {
         Vue.prototype.$appConfig = {
-          viewAnimation: { type: animType, options: options }
+          viewAnimation: { type: animType, options }
         };
       });