Move things back to where this will still work.

cypress.config.ts

@@ -10,6 +10,7 @@ export default defineConfig({
   },
 
   e2e: {
+    specPattern: 'e2e/**/*.spec.ts',
     setupNodeEvents(on, config) {
       // implement node event listeners here
       require("@cypress/code-coverage/task")(on, config);

e2e/accessibility.spec.ts

@@ -1,10 +1,12 @@
 import { MaputnikDriver } from "./maputnik-driver";
 
-test.describe("accessibility", () => {
+const test = it;
+
+describe("accessibility", () => {
   const { beforeAndAfter, get, when, then } = new MaputnikDriver();
   beforeAndAfter();
 
-  test.describe("skip links", () => {
+  describe("skip links", () => {
     beforeEach(() => {
       when.setStyle("layer");
     });

e2e/code-editor.spec.ts

@@ -1,6 +1,8 @@
 import { MaputnikDriver } from "./maputnik-driver";
 
-test.describe("code editor", () => {
+const test = it;
+
+describe("code editor", () => {
   const { beforeAndAfter, when, get, then } = new MaputnikDriver();
   beforeAndAfter();
 

e2e/history.spec.ts

@@ -1,6 +1,8 @@
 import { MaputnikDriver } from "./maputnik-driver";
 
-test.describe("history", () => {
+const test = it;
+
+describe("history", () => {
   const { beforeAndAfter, when, get, then } = new MaputnikDriver();
   beforeAndAfter();
 

e2e/i18n.spec.ts

@@ -1,10 +1,12 @@
 import { MaputnikDriver } from "./maputnik-driver";
 
-test.describe("i18n", () => {
+const test = it;
+
+describe("i18n", () => {
   const { beforeAndAfter, get, when, then } = new MaputnikDriver();
   beforeAndAfter();
 
-  test.describe("language detector", () => {
+  describe("language detector", () => {
     test("English", () => {
       const url = "?lng=en";
       when.visit(url);
@@ -18,7 +20,7 @@ test.describe("i18n", () => {
     });
   });
 
-  test.describe("language switcher", () => {
+  describe("language switcher", () => {
     beforeEach(() => {
       when.setStyle("layer");
     });

e2e/keyboard.spec.ts

@@ -1,9 +1,10 @@
 import { MaputnikDriver } from "./maputnik-driver";
+const test = it;
 
-test.describe("keyboard", () => {
+describe("keyboard", () => {
   const { beforeAndAfter, given, when, get, then } = new MaputnikDriver();
   beforeAndAfter();
-  test.describe("shortcuts", () => {
+  describe("shortcuts", () => {
     beforeEach(() => {
       given.setupMockBackedResponses();
       when.setStyle("");

e2e/layer-editor.spec.ts

@@ -1,7 +1,9 @@
 import { MaputnikDriver } from "./maputnik-driver";
 import { v1 as uuid } from "uuid";
 
-test.describe("layer editor", () => {
+const test = it;
+
+describe("layer editor", () => {
   const { beforeAndAfter, get, when, then } = new MaputnikDriver();
   beforeAndAfter();
   beforeEach(() => {
@@ -48,7 +50,7 @@ test.describe("layer editor", () => {
     });
   });
 
-  test.describe("source", () => {
+  describe("source", () => {
     test("should show error when the source is invalid", () => {
       when.modal.fillLayers({
         type: "circle",
@@ -58,7 +60,7 @@ test.describe("layer editor", () => {
     });
   });
 
-  test.describe("min-zoom", () => {
+  describe("min-zoom", () => {
     let bgId: string;
 
     beforeEach(() => {
@@ -80,7 +82,7 @@ test.describe("layer editor", () => {
       });
     });
 
-    test("when clicking next layer should update style on local storage", () => {
+    it("when clicking next layer should update style on local storage", () => {
       when.type("min-zoom.input-text", "{backspace}");
       when.click("max-zoom.input-text");
       then(get.styleFromLocalStorage()).shouldDeepNestedInclude({
@@ -95,7 +97,7 @@ test.describe("layer editor", () => {
     });
   });
 
-  test.describe("max-zoom", () => {
+  describe("max-zoom", () => {
     let bgId: string;
 
     beforeEach(() => {
@@ -118,7 +120,7 @@ test.describe("layer editor", () => {
     });
   });
 
-  test.describe("comments", () => {
+  describe("comments", () => {
     let bgId: string;
     const comment = "42";
 
@@ -143,7 +145,7 @@ test.describe("layer editor", () => {
       });
     });
 
-    test.describe("when unsetting", () => {
+    describe("when unsetting", () => {
       beforeEach(() => {
         when.clear("layer-comment.input");
         when.click("min-zoom.input-text");
@@ -162,7 +164,7 @@ test.describe("layer editor", () => {
     });
   });
 
-  test.describe("color", () => {
+  describe("color", () => {
     let bgId: string;
     beforeEach(() => {
       bgId = createBackground();
@@ -182,7 +184,7 @@ test.describe("layer editor", () => {
     });
   });
 
-  test.describe("opacity", () => {
+  describe("opacity", () => {
     let bgId: string;
     beforeEach(() => {
       bgId = createBackground();
@@ -202,12 +204,12 @@ test.describe("layer editor", () => {
 
 
 
-  test.describe("filter", () => {
+  describe("filter", () => {
     test("expand/collapse");
     test("compound filter");
   });
 
-  test.describe("layout", () => {
+  describe("layout", () => {
     test("text-font", () => {
       when.setStyle("font");
       when.collapseGroupInLayerEditor();
@@ -221,14 +223,14 @@ test.describe("layer editor", () => {
     });
   });
 
-  test.describe("paint", () => {
+  describe("paint", () => {
     test("expand/collapse");
     test("color");
     test("pattern");
     test("opacity");
   });
 
-  test.describe("json-editor", () => {
+  describe("json-editor", () => {
     test("add", () => {
       const id = when.modal.fillLayers({
         type: "circle",
@@ -272,7 +274,7 @@ test.describe("layer editor", () => {
     });
   });
 
-  test.describe("sticky header", () => {
+  describe("sticky header", () => {
     test("should keep layer header visible when scrolling properties", () => {
       // Setup: Create a layer with many properties (e.g., symbol layer)
       when.modal.fillLayers({

e2e/layers-list.spec.ts

@@ -1,6 +1,6 @@
 import { MaputnikDriver } from "./maputnik-driver";
 
-test.describe("layers list", () => {
+describe("layers list", () => {
   const { beforeAndAfter, get, when, then } = new MaputnikDriver();
   beforeAndAfter();
   beforeEach(() => {
@@ -8,7 +8,7 @@ test.describe("layers list", () => {
     when.modal.open();
   });
 
-  test.describe("ops", () => {
+  describe("ops", () => {
     let id: string;
     beforeEach(() => {
       id = when.modal.fillLayers({
@@ -27,7 +27,7 @@ test.describe("layers list", () => {
       });
     });
 
-    test.describe("when clicking delete", () => {
+    describe("when clicking delete", () => {
       beforeEach(() => {
         when.click("layer-list-item:" + id + ":delete");
       });
@@ -38,7 +38,7 @@ test.describe("layers list", () => {
       });
     });
 
-    test.describe("when clicking duplicate", () => {
+    describe("when clicking duplicate", () => {
       beforeEach(() => {
         when.click("layer-list-item:" + id + ":copy");
       });
@@ -58,7 +58,7 @@ test.describe("layers list", () => {
       });
     });
 
-    test.describe("when clicking hide", () => {
+    describe("when clicking hide", () => {
       beforeEach(() => {
         when.click("layer-list-item:" + id + ":toggle-visibility");
       });
@@ -77,7 +77,7 @@ test.describe("layers list", () => {
         });
       });
 
-      test.describe("when clicking show", () => {
+      describe("when clicking show", () => {
         beforeEach(() => {
           when.click("layer-list-item:" + id + ":toggle-visibility");
         });
@@ -97,7 +97,7 @@ test.describe("layers list", () => {
         });
       });
 
-      test.describe("when selecting a layer", () => {
+      describe("when selecting a layer", () => {
         let secondId: string;
         beforeEach(() => {
           when.modal.open();
@@ -116,7 +116,7 @@ test.describe("layers list", () => {
     });
   });
 
-  test.describe("background", () => {
+  describe("background", () => {
     test("add", () => {
       const id = when.modal.fillLayers({
         type: "background",
@@ -131,10 +131,10 @@ test.describe("layers list", () => {
       });
     });
 
-    test.describe("modify", () => {});
+    describe("modify", () => {});
   });
 
-  test.describe("fill", () => {
+  describe("fill", () => {
     test("add", () => {
       const id = when.modal.fillLayers({
         type: "fill",
@@ -156,7 +156,7 @@ test.describe("layers list", () => {
     test("change source");
   });
 
-  test.describe("line", () => {
+  describe("line", () => {
     test("add", () => {
       const id = when.modal.fillLayers({
         type: "line",
@@ -229,7 +229,7 @@ test.describe("layers list", () => {
     });
   });
 
-  test.describe("symbol", () => {
+  describe("symbol", () => {
     test("add", () => {
       const id = when.modal.fillLayers({
         type: "symbol",
@@ -286,7 +286,7 @@ test.describe("layers list", () => {
     });
   });
 
-  test.describe("raster", () => {
+  describe("raster", () => {
     test("add", () => {
       const id = when.modal.fillLayers({
         type: "raster",
@@ -305,7 +305,7 @@ test.describe("layers list", () => {
     });
   });
 
-  test.describe("circle", () => {
+  describe("circle", () => {
     test("add", () => {
       const id = when.modal.fillLayers({
         type: "circle",
@@ -324,7 +324,7 @@ test.describe("layers list", () => {
     });
   });
 
-  test.describe("fill extrusion", () => {
+  describe("fill extrusion", () => {
     test("add", () => {
       const id = when.modal.fillLayers({
         type: "fill-extrusion",
@@ -343,7 +343,7 @@ test.describe("layers list", () => {
     });
   });
 
-  test.describe("hillshade", () => {
+  describe("hillshade", () => {
     test("add", () => {
       const id = when.modal.fillLayers({
         type: "hillshade",
@@ -412,7 +412,7 @@ test.describe("layers list", () => {
     });
   });
 
-  test.describe("color-relief", () => {
+  describe("color-relief", () => {
     test("add", () => {
       const id = when.modal.fillLayers({
         type: "color-relief",
@@ -441,7 +441,7 @@ test.describe("layers list", () => {
     });
   });
 
-  test.describe("groups", () => {
+  describe("groups", () => {
     test("simple", () => {
       when.setStyle("geojson");
 
@@ -477,7 +477,7 @@ test.describe("layers list", () => {
     });
   });
 
-  test.describe("drag and drop", () => {
+  describe("drag and drop", () => {
     test("move layer should update local storage", () => {
       when.modal.open();
       const firstId = when.modal.fillLayers({
@@ -516,7 +516,7 @@ test.describe("layers list", () => {
     });
   });
 
-  test.describe("sticky header", () => {
+  describe("sticky header", () => {
     test("should keep header visible when scrolling layer list", () => {
       // Setup: Create multiple layers to enable scrolling
       for (let i = 0; i < 20; i++) {

e2e/map.spec.ts

@@ -1,9 +1,11 @@
 import { MaputnikDriver } from "./maputnik-driver";
 
-test.describe("map", () => {
+const test = it;
+
+describe("map", () => {
   const { beforeAndAfter, get, when, then } = new MaputnikDriver();
   beforeAndAfter();
-  test.describe("zoom level", () => {
+  describe("zoom level", () => {
     test("via url", () => {
       const zoomLevel = 12.37;
       when.setStyle("geojson", zoomLevel);
@@ -39,13 +41,13 @@ test.describe("map", () => {
     });
   });
 
-  test.describe("search", () => {
+  describe("search", () => {
     test("should exist", () => {
       then(get.searchControl()).shouldBeVisible();
     });
   });
 
-  test.describe("popup", () => {
+  describe("popup", () => {
     beforeEach(() => {
       when.setStyle("rectangles");
       then(get.locationHash().should("exist"));

e2e/modals.spec.ts

@@ -1,14 +1,15 @@
 import { MaputnikDriver } from "./maputnik-driver";
-import tokens from "../../src/config/tokens.json" with {type: "json"};
+import tokens from "../src/config/tokens.json" with {type: "json"};
+const test = it;
 
-test.describe("modals", () => {
+describe("modals", () => {
   const { beforeAndAfter, when, get, given, then } = new MaputnikDriver();
   beforeAndAfter();
 
   beforeEach(() => {
     when.setStyle("");
   });
-  test.describe("open", () => {
+  describe("open", () => {
     beforeEach(() => {
       when.click("nav:open");
     });
@@ -28,7 +29,7 @@ test.describe("modals", () => {
       then(get.fixture("example-style.json")).shouldEqualToStoredStyle();
     });
 
-    test.describe("when click open url", () => {
+    describe("when click open url", () => {
       beforeEach(() => {
         const styleFileUrl = get.exampleFileUrl();
 
@@ -42,7 +43,7 @@ test.describe("modals", () => {
     });
   });
 
-  test.describe("shortcuts", () => {
+  describe("shortcuts", () => {
     test("open/close", () => {
       when.setStyle("");
       when.typeKeys("?");
@@ -51,7 +52,7 @@ test.describe("modals", () => {
     });
   });
 
-  test.describe("export", () => {
+  describe("export", () => {
     beforeEach(() => {
       when.click("nav:export");
     });
@@ -65,7 +66,7 @@ test.describe("modals", () => {
     test("download");
   });
 
-  test.describe("sources", () => {
+  describe("sources", () => {
     beforeEach(() => {
       when.setStyle("layer");
       when.click("nav:sources");
@@ -122,7 +123,7 @@ test.describe("modals", () => {
     });
   });
 
-  test.describe("inspect", () => {
+  describe("inspect", () => {
     test("toggle", () => {
       // There is no assertion in this test
       when.setStyle("geojson");
@@ -130,12 +131,12 @@ test.describe("modals", () => {
     });
   });
 
-  test.describe("style settings", () => {
+  describe("style settings", () => {
     beforeEach(() => {
       when.click("nav:settings");
     });
 
-    test.describe("when click name filed spec information", () => {
+    describe("when click name filed spec information", () => {
       beforeEach(() => {
         when.click("field-doc-button-Name");
       });
@@ -147,7 +148,7 @@ test.describe("modals", () => {
       });
     });
 
-    test.describe("when set name and click owner", () => {
+    describe("when set name and click owner", () => {
       beforeEach(() => {
         when.setValue("modal:settings.name", "foobar");
         when.click("modal:settings.owner");
@@ -161,7 +162,7 @@ test.describe("modals", () => {
       });
     });
 
-    test.describe("when set owner and click name", () => {
+    describe("when set owner and click name", () => {
       beforeEach(() => {
         when.setValue("modal:settings.owner", "foobar");
         when.click("modal:settings.name");
@@ -321,7 +322,7 @@ test.describe("modals", () => {
 
   });
 
-  test.describe("add layer", () => {
+  describe("add layer", () => {
     beforeEach(() => {
       when.setStyle("layer");
       when.modal.open();
@@ -337,11 +338,11 @@ test.describe("modals", () => {
     });
   });
 
-  test.describe("sources", () => {
+  describe("sources", () => {
     test("toggle");
   });
 
-  test.describe("global state", () => {
+  describe("global state", () => {
     beforeEach(() => {
       when.click("nav:global-state");
     });
@@ -399,7 +400,7 @@ test.describe("modals", () => {
     });
   });
 
-  test.describe("error panel", () => {
+  describe("error panel", () => {
     test("not visible when no errors", () => {
       then(get.element("maputnik-message-panel-error")).shouldNotExist();
     });
@@ -414,7 +415,7 @@ test.describe("modals", () => {
     });
   });
 
-  test.describe("Handle localStorage QuotaExceededError", () => {
+  describe("Handle localStorage QuotaExceededError", () => {
     test("handles quota exceeded error when opening style from URL", () => {
       // Clear localStorage to start fresh
       cy.clearLocalStorage();

tsconfig.json

@@ -21,7 +21,7 @@
       "noUnusedParameters": true,
       "noFallthroughCasesInSwitch": true
     },
-    "include": ["src", "cypress/e2e"],
+    "include": ["src", "cypress/e2e", "e2e/maputnik-cypress-helper.ts"],
     "exclude": ["dist"],
     "references": [{ "path": "./tsconfig.node.json" }],
     // TODO: Remove when issue is resolved https://github.com/cypress-io/cypress/issues/27448