Merge pull request #1536 from terrestris/update-ol

Update `ol` and `turfjs`

.husky/commit-msg

@@ -1,6 +1,3 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
-
 # Disable in CI
 [ -n "$CI" ] && exit 0
 

jest.config.mjs

@@ -13,7 +13,8 @@ export default {
   },
   transformIgnorePatterns: [
     '<rootDir>/node_modules/(?!(ol|@babel|jest-runtime|@terrestris|color-space|color-rgba|color-name|' +
-    'color-parse|shpjs|filter-obj|split-on-first|decode-uri-component|query-string))'
+    'color-parse|shpjs|filter-obj|split-on-first|decode-uri-component|query-string|geostyler-openlayers-parser|' +
+    'geostyler-style))'
   ],
   testRegex: '/src/.*\\.spec.(ts|js)$',
   collectCoverageFrom: [

jest.setup.mjs

@@ -1,5 +1,10 @@
 import 'jest-canvas-mock';
 
+import {
+  TextDecoder,
+  TextEncoder
+} from 'util';
+
 global.fetch = jest.fn();
 
 Object.defineProperty(global, 'ResizeObserver', {
@@ -10,3 +15,5 @@ Object.defineProperty(global, 'ResizeObserver', {
     disconnect: jest.fn()
   }))
 });
+
+Object.assign(global, { TextDecoder, TextEncoder });

package.json

@@ -22,6 +22,7 @@
   "module": "src/index.ts",
   "type": "module",
   "browser": "dist/index.js",
+  "types": "dist/index.d.ts",
   "files": [
     "src",
     "dist",
@@ -44,13 +45,13 @@
   "dependencies": {
     "@mapbox/node-pre-gyp": "^1.0.11",
     "@terrestris/base-util": "^2.0.0",
-    "@turf/turf": "^6.5.0",
+    "@turf/turf": "^7.1.0",
     "fast-xml-parser": "^4.4.0",
-    "geostyler-openlayers-parser": "^4.3.0",
+    "geostyler-openlayers-parser": "^5.0.0",
     "lodash": "^4.17.21",
     "polygon-splitter": "^0.0.11",
     "proj4": "^2.11.0",
-    "shpjs": "^5.0.1"
+    "shpjs": "^6.1.0"
   },
   "devDependencies": {
     "@babel/core": "^7.24.5",
@@ -68,8 +69,10 @@
     "@terrestris/eslint-config-typescript": "5.0.0",
     "@types/geojson": "^7946.0.14",
     "@types/jest": "^29.5.12",
+    "@types/lodash": "^4.17.7",
     "@types/proj4": "^2.5.5",
     "@types/shpjs": "^3.4.7",
+    "@types/url-parse": "^1.4.11",
     "@typescript-eslint/eslint-plugin": "7.17.0",
     "@typescript-eslint/parser": "7.18.0",
     "eslint": "^8.48.0",
@@ -80,7 +83,7 @@
     "jest": "^29.7.0",
     "jest-canvas-mock": "^2.5.2",
     "jest-environment-jsdom": "^29.7.0",
-    "ol": "^9.2.2",
+    "ol": "^10.1.0",
     "rimraf": "^6.0.0",
     "semantic-release": "^24.0.0",
     "typedoc": "^0.26.2",
@@ -89,7 +92,7 @@
     "whatwg-fetch": "^3.6.20"
   },
   "peerDependencies": {
-    "ol": ">=9"
+    "ol": ">=10"
   },
   "engines": {
     "node": ">=20",

src/AnimateUtil/AnimateUtil.ts

@@ -1,12 +1,12 @@
 import _isFunction from 'lodash/isFunction';
 import _isNil from 'lodash/isNil';
 import OlFeature from 'ol/Feature';
-import { FeatureLike as OlFeatureLike } from 'ol/Feature';
 import OlGeometry from 'ol/geom/Geometry';
 import OlLayerVector from 'ol/layer/Vector';
 import OlMap from 'ol/Map';
 import { unByKey } from 'ol/Observable';
 import { getVectorContext } from 'ol/render';
+import OlSourceVector from 'ol/source/Vector';
 import OlStyle from 'ol/style/Style';
 
 /**
@@ -33,7 +33,7 @@ class AnimateUtil {
    */
   static moveFeature(
     map: OlMap,
-    layer: OlLayerVector<OlFeatureLike>,
+    layer: OlLayerVector<OlSourceVector>,
     featureToMove: OlFeature<OlGeometry>,
     duration: number,
     pixel: number,

src/FileUtil/FileUtil.spec.ts

@@ -1,7 +1,10 @@
 /* eslint-env jest*/
 
-import shpwrite, { OutputType } from '@mapbox/shp-write';
+import shpwrite from '@mapbox/shp-write';
+import OlGeomPoint from 'ol/geom/Point';
+import OlLayerVector from 'ol/layer/Vector';
 import OlMap from 'ol/Map';
+import OlSourceVector from 'ol/source/Vector';
 
 import {
   FileUtil
@@ -50,9 +53,9 @@ describe('FileUtil', () => {
         return new Promise((resolve) => {
           const layers = map.getLayers();
           layers.on('add', (event) => {
-            const layer = event.element;
+            const layer = event.element as OlLayerVector<OlSourceVector>;
             expect(layers.getLength()).toBe(2);
-            expect(layer.getSource().getFeatures().length).toBe(16);
+            expect(layer.getSource()?.getFeatures().length).toBe(16);
             resolve(true);
           });
           FileUtil.addGeojsonLayer(JSON.stringify(geoJson), map);
@@ -66,9 +69,9 @@ describe('FileUtil', () => {
         return new Promise((resolve) => {
           const layers = map.getLayers();
           layers.on('add', (event) => {
-            const layer = event.element;
+            const layer = event.element as OlLayerVector<OlSourceVector>;
             expect(layers.getLength()).toBe(2);
-            expect(layer.getSource().getFeatures().length).toBe(16);
+            expect(layer.getSource()?.getFeatures().length).toBe(16);
             resolve(true);
           });
           FileUtil.addGeojsonLayerFromFile(geoJsonFile, map);
@@ -93,14 +96,14 @@ describe('FileUtil', () => {
         return new Promise((resolve) => {
           const layers = map.getLayers();
           layers.on('add', (event) => {
-            const layer = event.element;
+            const layer = event.element as OlLayerVector<OlSourceVector>;
             expect(layers.getLength()).toBe(2);
 
-            var features = layer.getSource().getFeatures();
-            expect(features.length).toBe(1);
-            var feat = features[0];
-            var coords = feat.getGeometry().getCoordinates();
-            var properties = feat.getProperties();
+            const features = layer.getSource()?.getFeatures();
+            expect(features?.length).toBe(1);
+            const feat = features?.[0];
+            const coords = (feat?.getGeometry() as OlGeomPoint)?.getCoordinates();
+            const properties = feat?.getProperties() || {};
 
             expect(coords[0]).toBe(47);
             expect(coords[1]).toBe(-11);

src/GeometryUtil/GeometryUtil.ts

@@ -1,12 +1,16 @@
 import buffer from '@turf/buffer';
 import difference from '@turf/difference';
 import intersect from '@turf/intersect';
-import { flatten } from '@turf/turf';
+import { featureCollection, flatten } from '@turf/turf';
 import union from '@turf/union';
-import { Feature } from 'geojson';
-import { isNil } from 'lodash';
+import {
+  Feature as GeoJSONFeature,
+  MultiPolygon as GeoJSONMultiPolygon,
+  Polygon as GeoJSONPolygon
+} from 'geojson';
+import isNil from 'lodash/isNil';
 import OlFeature from 'ol/Feature';
-import OlFormatGeoJSON, { GeoJSONMultiPolygon, GeoJSONPolygon } from 'ol/format/GeoJSON';
+import OlFormatGeoJSON from 'ol/format/GeoJSON';
 import OlGeometry from 'ol/geom/Geometry';
 import OlGeomLineString from 'ol/geom/LineString';
 import OlGeomMultiLineString from 'ol/geom/MultiLineString';
@@ -104,7 +108,7 @@ class GeometryUtil {
 
     const flattened = flatten(result);
 
-    return flattened.features.map(geojsonFeature => {
+    return flattened.features.map((geojsonFeature: any) => {
       return geoJsonFormat.readGeometry(geojsonFeature.geometry) as OlGeomPolygon;
     });
   }
@@ -153,10 +157,13 @@ class GeometryUtil {
       featureProjection: projection
     });
     const geoJson = geoJsonFormat.writeGeometryObject(geometry);
+    if (geoJson.type === 'GeometryCollection') {
+      return;
+    }
     const buffered = buffer(geoJson, radius, {
       units: 'meters'
     });
-    return geoJsonFormat.readGeometry(buffered.geometry);
+    return geoJsonFormat.readGeometry(buffered?.geometry);
   }
 
   /**
@@ -256,20 +263,15 @@ class GeometryUtil {
 
     const pp = polygons
       .map((p: OlGeomPolygon | OlGeomMultiPolygon) => {
-        let polygon;
         if (p instanceof OlGeomMultiPolygon) {
-          polygon = geoJsonFormat.writeGeometryObject(p) as GeoJSONMultiPolygon;
+          return geoJsonFormat.writeFeatureObject(new OlFeature(p)) as GeoJSONFeature<GeoJSONMultiPolygon>;
         } else {
-          polygon = geoJsonFormat.writeGeometryObject(p) as GeoJSONPolygon;
+          return geoJsonFormat.writeFeatureObject(new OlFeature(p)) as GeoJSONFeature<GeoJSONPolygon>;
         }
-        const feature: Feature<GeoJSONPolygon | GeoJSONMultiPolygon> = {
-          geometry: polygon,
-          properties: {},
-          type: 'Feature'
-        };
-        return feature;
       });
-    const unionGeometry = pp.reduce((prev, next) => union(prev, next) ?? prev);
+
+    const unionGeometry = union(featureCollection<GeoJSONMultiPolygon | GeoJSONPolygon>(pp));
+
     return (geoJsonFormat.readFeature(unionGeometry) as OlFeature).getGeometry() as OlGeomMultiPolygon | OlGeomPolygon;
   }
 
@@ -316,13 +318,16 @@ class GeometryUtil {
     polygon2: OlGeomPolygon,
     projection: ProjectionLike = 'EPSG:3857'
   ): OlGeomMultiPolygon | OlGeomPolygon {
-    const geoJsonFormat = new OlFormatGeoJSON({
+    const geoJsonFormat = new OlFormatGeoJSON<OlFeature<OlGeomPolygon>>({
       dataProjection: 'EPSG:4326',
       featureProjection: projection
     });
-    const geojson1 = geoJsonFormat.writeGeometryObject(polygon1) as GeoJSONPolygon;
-    const geojson2 = geoJsonFormat.writeGeometryObject(polygon2) as GeoJSONPolygon;
-    const intersection = difference(geojson1, geojson2);
+    const geojson1 = geoJsonFormat.writeFeatureObject(new OlFeature(polygon1)) as GeoJSONFeature<GeoJSONPolygon>;
+    const geojson2 = geoJsonFormat.writeFeatureObject(new OlFeature(polygon2)) as GeoJSONFeature<GeoJSONPolygon>;
+
+    const coll = featureCollection([geojson1, geojson2]);
+
+    const intersection = difference(coll);
     const feature = geoJsonFormat.readFeature(intersection);
     return (feature as OlFeature).getGeometry() as OlGeomMultiPolygon | OlGeomPolygon;
   }
@@ -348,7 +353,7 @@ class GeometryUtil {
   ): OlGeomMultiPolygon | OlGeomPolygon | OlFeature<OlGeomPolygon|OlGeomMultiPolygon> | undefined {
     const intersectionGeometry = GeometryUtil.geometryIntersection(toGeom(polygon1), toGeom(polygon2), projection);
     if (isNil(intersectionGeometry)) {
-      return;
+      return undefined;
     }
     if (polygon1 instanceof OlFeature && polygon2 instanceof OlFeature) {
       return new OlFeature(intersectionGeometry);
@@ -378,15 +383,18 @@ class GeometryUtil {
       featureProjection: projection
     });
     const geojson1 = polygon1 instanceof OlGeomMultiPolygon ?
-      geoJsonFormat.writeGeometryObject(polygon1) as GeoJSONMultiPolygon :
-      geoJsonFormat.writeGeometryObject(polygon1) as GeoJSONPolygon;
+      geoJsonFormat.writeFeatureObject(new OlFeature(polygon1)) as GeoJSONFeature<GeoJSONMultiPolygon> :
+      geoJsonFormat.writeFeatureObject(new OlFeature(polygon1)) as GeoJSONFeature<GeoJSONPolygon>;
     const geojson2 = polygon2 instanceof OlGeomMultiPolygon ?
-      geoJsonFormat.writeGeometryObject(polygon2) as GeoJSONMultiPolygon :
-      geoJsonFormat.writeGeometryObject(polygon2) as GeoJSONPolygon;
-    const intersection = intersect(geojson1, geojson2);
+      geoJsonFormat.writeFeatureObject(new OlFeature(polygon2)) as GeoJSONFeature<GeoJSONMultiPolygon> :
+      geoJsonFormat.writeFeatureObject(new OlFeature(polygon2)) as GeoJSONFeature<GeoJSONPolygon>;
+
+    const intersection = intersect(featureCollection<GeoJSONMultiPolygon | GeoJSONPolygon>([geojson1, geojson2]));
+
     if (!intersection) {
-      return;
+      return undefined;
     }
+
     const feature = geoJsonFormat.readFeature(intersection);
     return (feature as OlFeature).getGeometry() as OlGeomMultiPolygon | OlGeomPolygon;
   }

src/LayerUtil/LayerUtil.ts

@@ -5,9 +5,7 @@ import { isNil } from 'lodash';
 import _uniq from 'lodash/uniq';
 import { Extent as OlExtent } from 'ol/extent';
 import OlFormatGeoJSON from 'ol/format/GeoJSON';
-import OlLayerImage from 'ol/layer/Image';
 import OlLayer from 'ol/layer/Layer';
-import OlLayerTile from 'ol/layer/Tile';
 import OlSourceImageWMS from 'ol/source/ImageWMS';
 import OlSourceOSM from 'ol/source/OSM';
 import OlSourceStadiaMaps from 'ol/source/StadiaMaps';

src/WfsFilterUtil/WfsFilterUtil.spec.ts

@@ -162,9 +162,9 @@ describe('WfsFilterUtil', () => {
 
         const res = WfsFilterUtil.getCombinedRequests(testConfig, searchTerm);
         expect(res?.tagName).toBe('GetFeature');
-        expect(res.querySelectorAll('Query').length).toBe(searchConfig.featureTypes!.length);
+        expect(res?.querySelectorAll('Query').length).toBe(searchConfig.featureTypes!.length);
         expect(filterSpy).toHaveBeenCalledTimes(0);
-        res.querySelectorAll('Query').forEach(query => {
+        res?.querySelectorAll('Query').forEach(query => {
           expect(query.children[2].tagName).toBe('Filter');
           expect(query.children[2].getElementsByTagName('Literal')[0].innerHTML).toEqual(`${searchTerm2}`);
           expect(query.getElementsByTagName('PropertyIsGreaterThanOrEqualTo')[0]).toBeDefined();

src/WfsFilterUtil/WfsFilterUtil.ts

@@ -1,7 +1,7 @@
-import _isNil from 'lodash/isNil';
-import { and, equalTo, like, or } from 'ol/format/filter';
-import OlFilter from 'ol/format/filter/Filter';
-import OlFormatWFS, { WriteGetFeatureOptions } from 'ol/format/WFS';
+import _isNil from 'lodash/isNil.js';
+import { and, equalTo, like, or } from 'ol/format/filter.js';
+import OlFilter from 'ol/format/filter/Filter.js';
+import OlFormatWFS, { WriteGetFeatureOptions } from 'ol/format/WFS.js';
 
 export type AttributeSearchSettings = {
   exactSearch?: boolean;
@@ -82,13 +82,13 @@ class WfsFilterUtil {
     const details = attributeDetails[featureType];
 
     if (_isNil(details)) {
-      return;
+      return undefined;
     }
 
     const attributes = Object.keys(details);
 
     if (attributes.length === 0) {
-      return;
+      return undefined;
     }
 
     const propertyFilters = attributes
@@ -173,7 +173,7 @@ class WfsFilterUtil {
     });
 
     if (_isNil(requests)) {
-      return;
+      return undefined;
     }
     const request = requests[0];
     requests.forEach((req, idx) => {

src/typeUtils/typeUtils.spec.ts

@@ -61,9 +61,11 @@ describe('isWmsLayer', () => {
   describe('Combinations of wms like layers with wms like sources', () => {
     const layers = getWmsLikeLayers();
     const sources = getWmsSources();
-    Object.keys(layers).forEach((layerClass) => {
-      Object.keys(sources).forEach((sourceClass) => {
+    Object.keys(layers).forEach(layerClass => {
+      Object.keys(sources).forEach(sourceClass => {
+        // @ts-ignore
         const layer = layers[layerClass];
+        // @ts-ignore
         const source = sources[sourceClass];
         layer.setSource(source);
 
@@ -77,9 +79,11 @@ describe('isWmsLayer', () => {
   describe('Combinations of some non-wms like layers with some non-wms like sources', () => {
     const layers = getNonWmsLikeLayers();
     const sources = getNonWmsSources();
-    Object.keys(layers).forEach((layerClass) => {
-      Object.keys(sources).forEach((sourceClass) => {
+    Object.keys(layers).forEach(layerClass => {
+      Object.keys(sources).forEach(sourceClass => {
+        // @ts-ignore
         const layer = layers[layerClass];
+        // @ts-ignore
         const source = sources[sourceClass];
         layer.setSource(source);
 
@@ -114,7 +118,9 @@ describe('isWmsLayer', () => {
     const sources = getNonWmsSources();
     Object.keys(layers).forEach((layerClass) => {
       Object.keys(sources).forEach((sourceClass) => {
+        // @ts-ignore
         const layer = layers[layerClass];
+        // @ts-ignore
         const source = sources[sourceClass];
         layer.setSource(source);