geoman-io · Falke-Design · Dec 29, 2024 · Feb 19, 2024 · Feb 19, 2024 · Feb 19, 2024
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -7,11 +7,12 @@ on:
       - 'v*.*.*'
 
 env:
-  FILE_NAME_PREFIX: geoman-io-leaflet-geoman-pro
+  FILE_NAME_PREFIX: geoman-io-leaflet-geoman
   NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
 
 jobs:
   build:
+    environment: release
     name: release job
     runs-on: ubuntu-latest
 

diff --git a/.gitignore b/.gitignore
@@ -8,3 +8,5 @@ npm-debug.log
 /cypress/screenshots
 /cypress/videos
 .eslintcache
+.env
+*.tgz
diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-v16.15.0
+v20.5.1
diff --git a/.tool-versions b/.tool-versions
@@ -0,0 +1 @@
+nodejs 20.5.1
diff --git a/.travis.yml b/.travis.yml
diff --git a/ISSUE_TEMPLATE.md b/ISSUE_TEMPLATE.md
@@ -1 +1 @@
-<!-- hey there, thanks for reporting an issue or feature request. If you found unexpected behaviour or problems using leaflet-geoman, please provide a demo via JSfiddle that reproduces the problem. You can use this as a starting point: https://jsfiddle.net/o1dwu2vg/ . This saves me a lot of time to find the issue and I can help you / fix it much faster :-) - THANKS -->
+<!-- hey there, thanks for reporting an issue or feature request. If you found unexpected behaviour or problems using leaflet-geoman, please provide a demo that reproduces the problem. You can use this as a starting point: https://plnkr.co/edit/3XhAuzVQ2CMyNFSr . This saves a lot of time to find the issue and to help you / fix it much faster :-) - THANKS -->
diff --git a/README.md b/README.md
@@ -1,6 +1,6 @@
 <p align="center">  
   <a href="https://geoman.io">  
-    <img width="130" alt="Geoman Logo" src="https://geoman-static.onrender.com/assets/logo_white_bg.svg" />  
+    <img width="130" alt="Geoman Logo" src="https://assets.geoman.io/assets/logo_white_bg.svg" />  
   </a>  
 </p>  
 <h1 align="center">  
@@ -23,9 +23,8 @@
   </a>  
 </p>
 
-
 <p align="center">
-    <img src="https://geoman-static.onrender.com/assets/draw-example.png" alt="Demo" />  
+    <img src="https://assets.geoman.io/assets/draw-example.png" alt="Demo" />  
 </p>
 
 ## Documentation
@@ -47,37 +46,37 @@ Please see the existing [Feature Requests here](https://github.com/geoman-io/lea
 Clone the repository and then install all npm packages:
 
 ```
-npm install
+pnpm install
 ```
 
 Compile and run `dev` watch version:
 
 ```
-npm run start
+pnpm run start
 ```
 
 Compile and run `build` version:
 
 ```
-npm run prepare
+pnpm run prepare
 ```
 
 Run cypress test:
 
 ```
-npm run test
+pnpm run test
 ```
 
 Open cypress window:
 
 ```
-npm run cypress
+pnpm run cypress
 ```
 
 Open eslint check:
 
 ```
-npm run lint
+pnpm run lint
 ```
 
 Take a look into [CONTRIBUTING](./CONTRIBUTING.md)

diff --git a/bundle.mjs b/bundle.mjs
@@ -23,7 +23,7 @@ const buildOptions = {
     '.svg': 'dataurl' },
   minify: true,
   outfile: './dist/leaflet-geoman.js',
-  sourcemap: process.env.DEV ? true : false,
+  sourcemap: true,
 }
 
 const ctx = await esbuild.context({ ...buildOptions, plugins });
@@ -37,7 +37,7 @@ if (process.env.DEV) {
       servedir: '.',
       fallback: "./index.html"
     });
-  console.log(`Serving app at ${host}:${port}.`);
+  console.log(`Serving app at http://${host}:${port}/demo`);
 } else {
   // Clean /dist folder
   fs.rmSync("./dist", { recursive: true, force: true });
@@ -48,6 +48,11 @@ if (process.env.DEV) {
   // Dispose context
   ctx.dispose();
 
+  // Replace incorrect closing tag in <\/style>
+  const data = fs.readFileSync('./dist/leaflet-geoman.css', 'utf8');
+  const result = data.replace(/<\\\/style>/g, '</style>');
+  fs.writeFileSync('./dist/leaflet-geoman.css', result, 'utf8');
+
   // Copy types
   fs.copyFileSync('leaflet-geoman.d.ts', './dist/leaflet-geoman.d.ts');
   fs.copyFileSync('./dist/leaflet-geoman.js', './dist/leaflet-geoman.min.js');

diff --git a/cypress.config.js b/cypress.config.js
@@ -0,0 +1,16 @@
+const { defineConfig } = require('cypress');
+
+module.exports = defineConfig({
+  video: false,
+  e2e: {
+    // We've imported your old cypress plugins here.
+    // You may want to clean this up later by importing these.
+    setupNodeEvents(on, config) {
+      return require('./cypress/plugins/index.js')(on, config);
+    },
+    experimentalRunAllSpecs: true,
+  },
+  retries: {
+    runMode: 2,
+  },
+});
diff --git a/cypress.json b/cypress.json
diff --git a/cypress/integration/circle.spec.js → cypress/e2e/circle.cy.js b/cypress/integration/circle.spec.js → cypress/e2e/circle.cy.js
@@ -115,6 +115,12 @@ describe('Draw Circle', () => {
     // draw with continueDrawing: true the second circle
     cy.get(mapSelector).click(300, 200).click(350, 250);
 
+    cy.window().then(({ map }) => {
+      const latlng = map.pm.Draw.Circle._hintMarker.getLatLng();
+      const pxLatLng = map.containerPointToLatLng([350, 250]);
+      expect(pxLatLng).to.deep.equal(latlng);
+    });
+
     // additional click because cypress lose the focus on the window ... wtf ...
     cy.get(mapSelector).click();
     cy.toolbarButton('edit').click();
@@ -225,6 +231,8 @@ describe('Draw Circle', () => {
       // move marker
       const marker = circle.pm._markers[1];
       marker.setLatLng([marker.getLatLng().lng, marker.getLatLng().lat + 10]);
+      circle.pm._resizeCircle();
+
       expect(167).to.eq(Math.floor(circle.getRadius()));
     });
   });
@@ -275,7 +283,7 @@ describe('Draw Circle', () => {
       const layer = map.pm.getGeomanDrawLayers()[0];
       layer.remove();
     });
-    cy.hasLayers(3);
+    cy.hasLayers(2);
   });
   it('check if snapping works with max radius of circle', () => {
     cy.toolbarButton('circle')
@@ -348,10 +356,10 @@ describe('Draw Circle', () => {
     });
   });
 
-  it('creates circles (non-resizableCircle)', () => {
+  it('creates circles (non-resizeableCircle)', () => {
     cy.window().then(({ map }) => {
       map.pm.setGlobalOptions({
-        resizableCircle: false,
+        resizeableCircle: false,
         continueDrawing: true,
       });
     });
@@ -373,9 +381,9 @@ describe('Draw Circle', () => {
     cy.hasCircleLayers(3);
   });
 
-  it('disable dragging correctly (non-resizableCircle)', () => {
+  it('disable dragging correctly (non-resizeableCircle)', () => {
     cy.window().then(({ map }) => {
-      map.pm.setGlobalOptions({ resizableCircle: false });
+      map.pm.setGlobalOptions({ resizeableCircle: false });
     });
 
     cy.toolbarButton('circle')
@@ -397,9 +405,9 @@ describe('Draw Circle', () => {
     });
   });
 
-  it('deletes no circles by right-click (non-resizableCircle)', () => {
+  it('deletes no circles by right-click (non-resizeableCircle)', () => {
     cy.window().then(({ map }) => {
-      map.pm.setGlobalOptions({ resizableCircle: false });
+      map.pm.setGlobalOptions({ resizeableCircle: false });
     });
 
     cy.toolbarButton('circle')
@@ -421,9 +429,9 @@ describe('Draw Circle', () => {
     cy.hasCircleLayers(1);
   });
 
-  it('change color of circleMarker while drawing (non-resizableCircle)', () => {
+  it('change color of circleMarker while drawing (non-resizeableCircle)', () => {
     cy.window().then(({ map }) => {
-      map.pm.setGlobalOptions({ resizableCircle: false });
+      map.pm.setGlobalOptions({ resizeableCircle: false });
     });
 
     cy.toolbarButton('circle')
@@ -469,4 +477,53 @@ describe('Draw Circle', () => {
     cy.get(mapSelector).click(200, 200);
     cy.get(mapSelector).click(300, 200);
   });
+
+  it('checks if editing with snappable:false works', () => {
+    cy.toolbarButton('circle')
+      .click()
+      .closest('.button-container')
+      .should('have.class', 'active');
+
+    cy.get(mapSelector).click(200, 200);
+    cy.get(mapSelector).click(300, 200);
+
+    cy.window().then(({ map }) => {
+      map.pm.setGlobalOptions({ snappable: false });
+    });
+
+    cy.window().then(({ map }) => {
+      const layer = map.pm.getGeomanLayers()[0];
+      expect(layer.getLatLng().lat).to.eq(51.51034504891232);
+      expect(layer.getLatLng().lng).to.eq(-0.14144897460937503);
+      expect(layer.getRadius()).to.eq(1187.9783670191234);
+    });
+
+    cy.toolbarButton('edit').click();
+
+    // change radius
+    cy.get(mapSelector)
+      .trigger('mousedown', 300, 200, { which: 1 })
+      .trigger('mousemove', 300, 250, { which: 1 })
+      .trigger('mouseup', 300, 250, { which: 1 });
+
+    cy.window().then(({ map }) => {
+      const layer = map.pm.getGeomanLayers()[0];
+      expect(layer.getLatLng().lat).to.eq(51.51034504891232);
+      expect(layer.getLatLng().lng).to.eq(-0.14144897460937503);
+      expect(layer.getRadius()).to.eq(1328.278061564339);
+    });
+
+    // change center
+    cy.get(mapSelector)
+      .trigger('mousedown', 200, 200, { which: 1 })
+      .trigger('mousemove', 200, 250, { which: 1 })
+      .trigger('mouseup', 200, 250, { which: 1 });
+
+    cy.window().then(({ map }) => {
+      const layer = map.pm.getGeomanLayers()[0];
+      expect(layer.getLatLng().lat).to.eq(51.50500286265417);
+      expect(layer.getLatLng().lng).to.eq(-0.14144897460937503);
+      expect(layer.getRadius()).to.eq(1328.278061564339);
+    });
+  });
 });
diff --git a/cypress/integration/circlemarker.spec.js → cypress/e2e/circlemarker.cy.js b/cypress/integration/circlemarker.spec.js → cypress/e2e/circlemarker.cy.js
@@ -162,6 +162,12 @@ describe('Draw Circle Marker', () => {
     // draw with continueDrawing: ture the second circle
     cy.get(mapSelector).click(300, 200).click(350, 250);
 
+    cy.window().then(({ map }) => {
+      const latlng = map.pm.Draw.CircleMarker._hintMarker.getLatLng();
+      const pxLatLng = map.containerPointToLatLng([350, 250]);
+      expect(pxLatLng).to.deep.equal(latlng);
+    });
+
     // additional click because cypress lose the focus on the window ... wtf ...
     cy.get(mapSelector).click();
 
@@ -436,7 +442,7 @@ describe('Draw Circle Marker', () => {
       const layer = map.pm.getGeomanDrawLayers()[0];
       layer.remove();
     });
-    cy.hasLayers(3);
+    cy.hasLayers(2);
   });
 
   it('check if snapping works with max radius of circle', () => {

diff --git a/cypress/integration/developing.spec.js → cypress/e2e/developing.cy.js b/cypress/integration/developing.spec.js → cypress/e2e/developing.cy.js
diff --git a/cypress/integration/events.spec.js → cypress/e2e/events.cy.js b/cypress/integration/events.spec.js → cypress/e2e/events.cy.js
diff --git a/cypress/integration/globalmodes.spec.js → cypress/e2e/globalmodes.cy.js b/cypress/integration/globalmodes.spec.js → cypress/e2e/globalmodes.cy.js
diff --git a/cypress/integration/helpers.spec.js → cypress/e2e/helpers.cy.js b/cypress/integration/helpers.spec.js → cypress/e2e/helpers.cy.js
diff --git a/cypress/integration/imageoverlay.spec.js → cypress/e2e/imageoverlay.cy.js b/cypress/integration/imageoverlay.spec.js → cypress/e2e/imageoverlay.cy.js
diff --git a/cypress/integration/layergroup.spec.js → cypress/e2e/layergroup.cy.js b/cypress/integration/layergroup.spec.js → cypress/e2e/layergroup.cy.js
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<!-- hey there, thanks for reporting an issue or feature request. If you found unexpected behaviour or problems using leaflet-geoman, please provide a demo via JSfiddle that reproduces the problem. You can use this as a starting point: https://jsfiddle.net/o1dwu2vg/ . This saves me a lot of time to find the issue and I can help you / fix it much faster :-) - THANKS -->
		<!-- hey there, thanks for reporting an issue or feature request. If you found unexpected behaviour or problems using leaflet-geoman, please provide a demo that reproduces the problem. You can use this as a starting point: https://plnkr.co/edit/3XhAuzVQ2CMyNFSr . This saves a lot of time to find the issue and to help you / fix it much faster :-) - THANKS -->