Version 1.0.4.1 open Links in new Tab for polylines and devices work it without disablePolylineEvents(window.polylines);

.env.local

@@ -18,30 +18,30 @@
 #########################
 
 
-#DB_HOST=10.10.0.70
+DB_HOST=10.10.0.70
-#DB_USER=root
-#DB_PASSWORD="root#$"
-#DB_NAME=talas_v5
-#DB_PORT=3306
-
-
-#########################
-
-#NEXT_PUBLIC_BASE_URL="http://10.10.0.30/talas5/devices/"
-#NEXT_PUBLIC_SERVER_URL="http://10.10.0.70"
-#NEXT_PUBLIC_PROXY_TARGET="http://10.10.0.70"
-#NEXT_PUBLIC_ONLINE_TILE_LAYER="http://10.10.0.13:3000/mapTiles/{z}/{x}/{y}.png"
-#NEXT_PUBLIC_ONLINE_TILE_LAYER="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
-#########################
-
-DB_HOST=192.168.10.167
 DB_USER=root
 DB_PASSWORD="root#$"
 DB_NAME=talas_v5
 DB_PORT=3306
+
+
+#########################
+
+NEXT_PUBLIC_BASE_URL="http://10.10.0.30/talas5/devices/"
+NEXT_PUBLIC_SERVER_URL="http://10.10.0.70"
+NEXT_PUBLIC_PROXY_TARGET="http://10.10.0.70"
+NEXT_PUBLIC_ONLINE_TILE_LAYER="http://10.10.0.13:3000/mapTiles/{z}/{x}/{y}.png"
+#NEXT_PUBLIC_ONLINE_TILE_LAYER="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
+#########################
+
+#DB_HOST=192.168.10.167
+#DB_USER=root
+#DB_PASSWORD="root#$"
+#DB_NAME=talas_v5
+#DB_PORT=3306
 #########################
 #URLs für den Client (clientseitig)
-NEXT_PUBLIC_BASE_URL="http://192.168.10.167/talas5/devices/"
+#NEXT_PUBLIC_BASE_URL="http://192.168.10.167/talas5/devices/"
-NEXT_PUBLIC_SERVER_URL="http://192.168.10.167"
+#NEXT_PUBLIC_SERVER_URL="http://192.168.10.167"
-NEXT_PUBLIC_PROXY_TARGET="http://192.168.10.167"
+#NEXT_PUBLIC_PROXY_TARGET="http://192.168.10.167"
-NEXT_PUBLIC_ONLINE_TILE_LAYER="http://192.168.10.14:3000/mapTiles/{z}/{x}/{y}.png"
+#NEXT_PUBLIC_ONLINE_TILE_LAYER="http://192.168.10.14:3000/mapTiles/{z}/{x}/{y}.png"

cypress.config.js

@@ -0,0 +1,16 @@
+const { defineConfig } = require("cypress");
+
+module.exports = defineConfig({
+  e2e: {
+    setupNodeEvents(on, config) {
+      // implement node event listeners here
+    },
+  },
+
+  component: {
+    devServer: {
+      framework: "next",
+      bundler: "webpack",
+    },
+  },
+});

cypress/e2e/spec.cy.js

@@ -0,0 +1,46 @@
+describe("Map Initial Load Test", () => {
+  it("should load the map with the correct center and zoom", () => {
+    // Besuche die Seite, auf der die Karte angezeigt wird
+    cy.visit("http://192.168.10.167:3000/?m=12&u=485");
+
+    // Überprüfe, ob das Kartenelement existiert
+    cy.get("#map").should("be.visible");
+
+    // Überprüfe, ob die Karte das korrekte Zentrum und den korrekten Zoom hat
+    cy.window().then((win) => {
+      const map = win.L.map;
+      const center = map.getCenter();
+      const zoom = map.getZoom();
+
+      expect(center.lat).to.be.closeTo(53.111111, 0.0001);
+      expect(center.lng).to.be.closeTo(8.4625, 0.0001);
+      expect(zoom).to.eq(12);
+    });
+  });
+});
+describe("Map Context Menu Test", () => {
+  it("should show context menu on right click", () => {
+    cy.visit("http://192.168.10.167:3000/?m=12&u=485");
+
+    // Rechte Maustaste auf eine Koordinate in der Karte klicken
+    cy.get("#map").rightclick(400, 300); // Rechtsklick auf eine Position in der Karte
+
+    // Überprüfen, ob das Kontextmenü angezeigt wird
+    cy.contains("Station öffnen (Tab)").should("be.visible");
+  });
+
+  it("should open a new tab when context menu option is clicked", () => {
+    cy.visit("http://192.168.10.167:3000/?m=12&u=485");
+
+    cy.get("#map").rightclick(400, 300);
+
+    cy.contains("Station öffnen (Tab)").click();
+
+    // Testen, ob ein neuer Tab mit dem richtigen Link geöffnet wird
+    cy.window().then((win) => {
+      cy.stub(win, "open").as("windowOpen");
+    });
+
+    cy.get("@windowOpen").should("be.calledWith", "https://example.com"); // Ersetze dies durch die tatsächliche URL
+  });
+});

cypress/fixtures/example.json

@@ -0,0 +1,5 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "hello@cypress.io",
+  "body": "Fixtures are a great way to mock data for responses to routes"
+}

cypress/integration/map_test_spec.js

@@ -0,0 +1,20 @@
+describe("Map Initial Load Test", () => {
+  it("should load the map with the correct center and zoom", () => {
+    // Besuche die Seite, auf der die Karte angezeigt wird
+    cy.visit("http://192.168.10.167:3000/?m=12&u=485");
+
+    // Überprüfe, ob das Kartenelement existiert
+    cy.get("#map").should("be.visible");
+
+    // Überprüfe, ob die Karte das korrekte Zentrum und den korrekten Zoom hat
+    cy.window().then((win) => {
+      const map = win.L.map;
+      const center = map.getCenter();
+      const zoom = map.getZoom();
+
+      expect(center.lat).to.be.closeTo(53.111111, 0.0001);
+      expect(center.lng).to.be.closeTo(8.4625, 0.0001);
+      expect(zoom).to.eq(12);
+    });
+  });
+});

cypress/support/commands.js

@@ -0,0 +1,25 @@
+// ***********************************************
+// This example commands.js shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add('login', (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This will overwrite an existing command --
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })

cypress/support/component-index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <title>Components App</title>
+    <!-- Used by Next.js to inject CSS. -->
+    <div id="__next_css__DO_NOT_USE__"></div>
+  </head>
+  <body>
+    <div data-cy-root></div>
+  </body>
+</html>

cypress/support/component.js

@@ -0,0 +1,27 @@
+// ***********************************************************
+// This example support/component.js is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands'
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')
+
+import { mount } from 'cypress/react18'
+
+Cypress.Commands.add('mount', mount)
+
+// Example use:
+// cy.mount(<MyComponent />)

cypress/support/e2e.js

@@ -0,0 +1,20 @@
+// ***********************************************************
+// This example support/e2e.js is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands'
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')

package.json

@@ -24,7 +24,9 @@
     "build": "next build",
     "start": "next start",
     "export": "next export",
-    "test": "jest"
+    "test": "jest",
+    "cypress": "cypress open",   
+    "cypress:run": "cypress run" 
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",
@@ -34,6 +36,7 @@
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.5.2",
     "babel-jest": "^29.7.0",
+    "cypress": "^13.14.2",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",

utils/createAndSetDevices.js

@@ -68,7 +68,7 @@ export const createAndSetDevices = async (systemId, setMarkersFunction, GisSyste
             event.preventDefault(); // Verhindert das Standard-Kontextmenü
           }
           //setPolylineEventsDisabled(true);
-          disablePolylineEvents(window.polylines);
+          //disablePolylineEvents(window.polylines);
           this.openPopup();
         });