From f7b48139a467b486bf1c89a7ef255c276aa82189 Mon Sep 17 00:00:00 2001 From: HarelM Date: Wed, 8 Jul 2026 12:42:13 +0300 Subject: [PATCH] test: adopt Playwright test()/test.describe() naming in e2e specs Mechanical rename of it() -> test() and describe() -> test.describe() so the subsequent Playwright migration diff only touches test bodies, not the suite/case wrappers. --- e2e/accessibility.spec.ts | 10 ++-- e2e/code-editor.spec.ts | 6 +-- e2e/history.spec.ts | 6 +-- e2e/i18n.spec.ts | 12 ++--- e2e/keyboard.spec.ts | 22 ++++---- e2e/layer-editor.spec.ts | 72 ++++++++++++------------- e2e/layers-list.spec.ts | 92 ++++++++++++++++---------------- e2e/map.spec.ts | 20 +++---- e2e/modals.spec.ts | 108 +++++++++++++++++++------------------- 9 files changed, 174 insertions(+), 174 deletions(-) diff --git a/e2e/accessibility.spec.ts b/e2e/accessibility.spec.ts index 7703169a..8e2e7e61 100644 --- a/e2e/accessibility.spec.ts +++ b/e2e/accessibility.spec.ts @@ -1,15 +1,15 @@ import { MaputnikDriver } from "./maputnik-driver"; -describe("accessibility", () => { +test.describe("accessibility", () => { const { beforeAndAfter, get, when, then } = new MaputnikDriver(); beforeAndAfter(); - describe("skip links", () => { + test.describe("skip links", () => { beforeEach(() => { when.setStyle("layer"); }); - it("skip link to layer list", () => { + test("skip link to layer list", () => { const selector = "root:skip:layer-list"; then(get.elementByTestId(selector)).shouldExist(); when.tab(); @@ -18,7 +18,7 @@ describe("accessibility", () => { then(get.skipTargetLayerList()).shouldBeFocused(); }); - it("skip link to layer editor", () => { + test("skip link to layer editor", () => { const selector = "root:skip:layer-editor"; then(get.elementByTestId(selector)).shouldExist(); then(get.elementByTestId("skip-target-layer-editor")).shouldExist(); @@ -28,7 +28,7 @@ describe("accessibility", () => { then(get.skipTargetLayerEditor()).shouldBeFocused(); }); - it("skip link to map view", () => { + test("skip link to map view", () => { const selector = "root:skip:map-view"; then(get.elementByTestId(selector)).shouldExist(); when.tab().tab().tab(); diff --git a/e2e/code-editor.spec.ts b/e2e/code-editor.spec.ts index e9dff130..abfb63c1 100644 --- a/e2e/code-editor.spec.ts +++ b/e2e/code-editor.spec.ts @@ -1,15 +1,15 @@ import { MaputnikDriver } from "./maputnik-driver"; -describe("code editor", () => { +test.describe("code editor", () => { const { beforeAndAfter, when, get, then } = new MaputnikDriver(); beforeAndAfter(); - it("open code editor", () => { + test("open code editor", () => { when.click("nav:code-editor"); then(get.element(".maputnik-code-editor")).shouldExist(); }); - it("closes code editor", () => { + test("closes code editor", () => { when.click("nav:code-editor"); then(get.element(".maputnik-code-editor")).shouldExist(); when.click("nav:code-editor"); diff --git a/e2e/history.spec.ts b/e2e/history.spec.ts index 499a09b2..5cefef01 100644 --- a/e2e/history.spec.ts +++ b/e2e/history.spec.ts @@ -1,6 +1,6 @@ import { MaputnikDriver } from "./maputnik-driver"; -describe("history", () => { +test.describe("history", () => { const { beforeAndAfter, when, get, then } = new MaputnikDriver(); beforeAndAfter(); @@ -13,7 +13,7 @@ describe("history", () => { redoKeyCombo = isMac ? "{meta}{shift}z" : "{ctrl}y"; }); - it("undo/redo", () => { + test("undo/redo", () => { when.setStyle("geojson"); when.modal.open(); @@ -87,7 +87,7 @@ describe("history", () => { }); }); - it("should not redo after undo and value change", () => { + test("should not redo after undo and value change", () => { when.setStyle("geojson"); when.modal.open(); when.modal.fillLayers({ diff --git a/e2e/i18n.spec.ts b/e2e/i18n.spec.ts index 23d1a407..db296ce7 100644 --- a/e2e/i18n.spec.ts +++ b/e2e/i18n.spec.ts @@ -1,29 +1,29 @@ import { MaputnikDriver } from "./maputnik-driver"; -describe("i18n", () => { +test.describe("i18n", () => { const { beforeAndAfter, get, when, then } = new MaputnikDriver(); beforeAndAfter(); - describe("language detector", () => { - it("English", () => { + test.describe("language detector", () => { + test("English", () => { const url = "?lng=en"; when.visit(url); then(get.elementByTestId("maputnik-lang-select")).shouldHaveValue("en"); }); - it("Japanese", () => { + test("Japanese", () => { const url = "?lng=ja"; when.visit(url); then(get.elementByTestId("maputnik-lang-select")).shouldHaveValue("ja"); }); }); - describe("language switcher", () => { + test.describe("language switcher", () => { beforeEach(() => { when.setStyle("layer"); }); - it("the language switcher switches to Japanese", () => { + test("the language switcher switches to Japanese", () => { const selector = "maputnik-lang-select"; then(get.elementByTestId(selector)).shouldExist(); when.select(selector, "ja"); diff --git a/e2e/keyboard.spec.ts b/e2e/keyboard.spec.ts index 2f52b1e8..7292f30b 100644 --- a/e2e/keyboard.spec.ts +++ b/e2e/keyboard.spec.ts @@ -1,15 +1,15 @@ import { MaputnikDriver } from "./maputnik-driver"; -describe("keyboard", () => { +test.describe("keyboard", () => { const { beforeAndAfter, given, when, get, then } = new MaputnikDriver(); beforeAndAfter(); - describe("shortcuts", () => { + test.describe("shortcuts", () => { beforeEach(() => { given.setupMockBackedResponses(); when.setStyle(""); }); - it("ESC should unfocus", () => { + test("ESC should unfocus", () => { const targetSelector = "maputnik-select"; when.focus(targetSelector); then(get.elementByTestId(targetSelector)).shouldBeFocused(); @@ -17,42 +17,42 @@ describe("keyboard", () => { then(get.elementByTestId(targetSelector)).shouldNotBeFocused(); }); - it("'?' should show shortcuts modal", () => { + test("'?' should show shortcuts modal", () => { when.typeKeys("?"); then(get.elementByTestId("modal:shortcuts")).shouldBeVisible(); }); - it("'o' should show open modal", () => { + test("'o' should show open modal", () => { when.typeKeys("o"); then(get.elementByTestId("modal:open")).shouldBeVisible(); }); - it("'e' should show export modal", () => { + test("'e' should show export modal", () => { when.typeKeys("e"); then(get.elementByTestId("modal:export")).shouldBeVisible(); }); - it("'d' should show sources modal", () => { + test("'d' should show sources modal", () => { when.typeKeys("d"); then(get.elementByTestId("modal:sources")).shouldBeVisible(); }); - it("'s' should show settings modal", () => { + test("'s' should show settings modal", () => { when.typeKeys("s"); then(get.elementByTestId("modal:settings")).shouldBeVisible(); }); - it("'i' should change map to inspect mode", () => { + test("'i' should change map to inspect mode", () => { when.typeKeys("i"); then(get.inputValue("maputnik-select")).shouldEqual("inspect"); }); - it("'m' should focus map", () => { + test("'m' should focus map", () => { when.typeKeys("m"); then(get.canvas()).shouldBeFocused(); }); - it("'!' should show debug modal", () => { + test("'!' should show debug modal", () => { when.typeKeys("!"); then(get.elementByTestId("modal:debug")).shouldBeVisible(); }); diff --git a/e2e/layer-editor.spec.ts b/e2e/layer-editor.spec.ts index a7906b8c..c75588de 100644 --- a/e2e/layer-editor.spec.ts +++ b/e2e/layer-editor.spec.ts @@ -1,7 +1,7 @@ import { MaputnikDriver } from "./maputnik-driver"; import { v1 as uuid } from "uuid"; -describe("layer editor", () => { +test.describe("layer editor", () => { const { beforeAndAfter, get, when, then } = new MaputnikDriver(); beforeAndAfter(); beforeEach(() => { @@ -28,8 +28,8 @@ describe("layer editor", () => { return id; } - it("expand/collapse"); - it("id", () => { + test("expand/collapse"); + test("id", () => { const bgId = createBackground(); when.click("layer-list-item:background:" + bgId); @@ -48,8 +48,8 @@ describe("layer editor", () => { }); }); - describe("source", () => { - it("should show error when the source is invalid", () => { + test.describe("source", () => { + test("should show error when the source is invalid", () => { when.modal.fillLayers({ type: "circle", layer: "invalid", @@ -58,7 +58,7 @@ describe("layer editor", () => { }); }); - describe("min-zoom", () => { + test.describe("min-zoom", () => { let bgId: string; beforeEach(() => { @@ -68,7 +68,7 @@ describe("layer editor", () => { when.click("layer-editor.layer-id"); }); - it("should update min-zoom in local storage", () => { + test("should update min-zoom in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ layers: [ { @@ -80,7 +80,7 @@ describe("layer editor", () => { }); }); - it("when clicking next layer should update style on local storage", () => { + test("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 +95,7 @@ describe("layer editor", () => { }); }); - describe("max-zoom", () => { + test.describe("max-zoom", () => { let bgId: string; beforeEach(() => { @@ -105,7 +105,7 @@ describe("layer editor", () => { when.click("layer-editor.layer-id"); }); - it("should update style in local storage", () => { + test("should update style in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ layers: [ { @@ -118,7 +118,7 @@ describe("layer editor", () => { }); }); - describe("comments", () => { + test.describe("comments", () => { let bgId: string; const comment = "42"; @@ -129,7 +129,7 @@ describe("layer editor", () => { when.click("layer-editor.layer-id"); }); - it("should update style in local storage", () => { + test("should update style in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ layers: [ { @@ -143,13 +143,13 @@ describe("layer editor", () => { }); }); - describe("when unsetting", () => { + test.describe("when unsetting", () => { beforeEach(() => { when.clear("layer-comment.input"); when.click("min-zoom.input-text"); }); - it("should update style in local storage", () => { + test("should update style in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ layers: [ { @@ -162,7 +162,7 @@ describe("layer editor", () => { }); }); - describe("color", () => { + test.describe("color", () => { let bgId: string; beforeEach(() => { bgId = createBackground(); @@ -170,7 +170,7 @@ describe("layer editor", () => { when.click("spec-field:background-color"); }); - it("should update style in local storage", () => { + test("should update style in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ layers: [ { @@ -182,7 +182,7 @@ describe("layer editor", () => { }); }); - describe("opacity", () => { + test.describe("opacity", () => { let bgId: string; beforeEach(() => { bgId = createBackground(); @@ -190,11 +190,11 @@ describe("layer editor", () => { when.type("spec-field-input:background-opacity", "0."); }); - it("should keep '.' in the input field", () => { + test("should keep '.' in the input field", () => { then(get.elementByTestId("spec-field-input:background-opacity")).shouldHaveValue("0."); }); - it("should revert to a valid value when focus out", () => { + test("should revert to a valid value when focus out", () => { when.click("layer-list-item:background:" + bgId); then(get.elementByTestId("spec-field-input:background-opacity")).shouldHaveValue("0"); }); @@ -202,13 +202,13 @@ describe("layer editor", () => { - describe("filter", () => { - it("expand/collapse"); - it("compound filter"); + test.describe("filter", () => { + test("expand/collapse"); + test("compound filter"); }); - describe("layout", () => { - it("text-font", () => { + test.describe("layout", () => { + test("text-font", () => { when.setStyle("font"); when.collapseGroupInLayerEditor(); when.collapseGroupInLayerEditor(1); @@ -221,15 +221,15 @@ describe("layer editor", () => { }); }); - describe("paint", () => { - it("expand/collapse"); - it("color"); - it("pattern"); - it("opacity"); + test.describe("paint", () => { + test("expand/collapse"); + test("color"); + test("pattern"); + test("opacity"); }); - describe("json-editor", () => { - it("add", () => { + test.describe("json-editor", () => { + test("add", () => { const id = when.modal.fillLayers({ type: "circle", layer: "example", @@ -254,10 +254,10 @@ describe("layer editor", () => { }); - it("expand/collapse"); - it("modify"); + test("expand/collapse"); + test("modify"); - it("parse error", () => { + test("parse error", () => { const bgId = createBackground(); when.click("layer-list-item:background:" + bgId); @@ -272,8 +272,8 @@ describe("layer editor", () => { }); }); - describe("sticky header", () => { - it("should keep layer header visible when scrolling properties", () => { + test.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({ type: "symbol", diff --git a/e2e/layers-list.spec.ts b/e2e/layers-list.spec.ts index f8048d90..0a1a845d 100644 --- a/e2e/layers-list.spec.ts +++ b/e2e/layers-list.spec.ts @@ -1,6 +1,6 @@ import { MaputnikDriver } from "./maputnik-driver"; -describe("layers list", () => { +test.describe("layers list", () => { const { beforeAndAfter, get, when, then } = new MaputnikDriver(); beforeAndAfter(); beforeEach(() => { @@ -8,7 +8,7 @@ describe("layers list", () => { when.modal.open(); }); - describe("ops", () => { + test.describe("ops", () => { let id: string; beforeEach(() => { id = when.modal.fillLayers({ @@ -16,7 +16,7 @@ describe("layers list", () => { }); }); - it("should update layers in local storage", () => { + test("should update layers in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ layers: [ { @@ -27,22 +27,22 @@ describe("layers list", () => { }); }); - describe("when clicking delete", () => { + test.describe("when clicking delete", () => { beforeEach(() => { when.click("layer-list-item:" + id + ":delete"); }); - it("should empty layers in local storage", () => { + test("should empty layers in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ layers: [], }); }); }); - describe("when clicking duplicate", () => { + test.describe("when clicking duplicate", () => { beforeEach(() => { when.click("layer-list-item:" + id + ":copy"); }); - it("should add copy layer in local storage", () => { + test("should add copy layer in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ layers: [ { @@ -58,12 +58,12 @@ describe("layers list", () => { }); }); - describe("when clicking hide", () => { + test.describe("when clicking hide", () => { beforeEach(() => { when.click("layer-list-item:" + id + ":toggle-visibility"); }); - it("should update visibility to none in local storage", () => { + test("should update visibility to none in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ layers: [ { @@ -77,12 +77,12 @@ describe("layers list", () => { }); }); - describe("when clicking show", () => { + test.describe("when clicking show", () => { beforeEach(() => { when.click("layer-list-item:" + id + ":toggle-visibility"); }); - it("should update visibility to visible in local storage", () => { + test("should update visibility to visible in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ layers: [ { @@ -97,7 +97,7 @@ describe("layers list", () => { }); }); - describe("when selecting a layer", () => { + test.describe("when selecting a layer", () => { let secondId: string; beforeEach(() => { when.modal.open(); @@ -106,7 +106,7 @@ describe("layers list", () => { type: "background", }); }); - it("should show the selected layer in the editor", () => { + test("should show the selected layer in the editor", () => { when.realClick("layer-list-item:" + secondId); then(get.elementByTestId("layer-editor.layer-id.input")).shouldHaveValue(secondId); when.realClick("layer-list-item:" + id); @@ -116,8 +116,8 @@ describe("layers list", () => { }); }); - describe("background", () => { - it("add", () => { + test.describe("background", () => { + test("add", () => { const id = when.modal.fillLayers({ type: "background", }); @@ -131,11 +131,11 @@ describe("layers list", () => { }); }); - describe("modify", () => {}); + test.describe("modify", () => {}); }); - describe("fill", () => { - it("add", () => { + test.describe("fill", () => { + test("add", () => { const id = when.modal.fillLayers({ type: "fill", layer: "example", @@ -153,11 +153,11 @@ describe("layers list", () => { }); // TODO: Change source - it("change source"); + test("change source"); }); - describe("line", () => { - it("add", () => { + test.describe("line", () => { + test("add", () => { const id = when.modal.fillLayers({ type: "line", layer: "example", @@ -174,7 +174,7 @@ describe("layers list", () => { }); }); - it("groups", () => { + test("groups", () => { when.modal.open(); const id1 = when.modal.fillLayers({ id: "aa", @@ -229,8 +229,8 @@ describe("layers list", () => { }); }); - describe("symbol", () => { - it("add", () => { + test.describe("symbol", () => { + test("add", () => { const id = when.modal.fillLayers({ type: "symbol", layer: "example", @@ -247,7 +247,7 @@ describe("layers list", () => { }); }); - it("should show spec info when hovering and clicking single line property", () => { + test("should show spec info when hovering and clicking single line property", () => { when.modal.fillLayers({ type: "symbol", layer: "example", @@ -259,7 +259,7 @@ describe("layers list", () => { then(get.elementByTestId("spec-field-doc")).shouldContainText("Rotates the "); }); - it("should show spec info when hovering and clicking multi line property", () => { + test("should show spec info when hovering and clicking multi line property", () => { when.modal.fillLayers({ type: "symbol", layer: "example", @@ -271,7 +271,7 @@ describe("layers list", () => { then(get.elementByTestId("spec-field-doc")).shouldContainText("Offset distance"); }); - it("should hide spec info when clicking a second time", () => { + test("should hide spec info when clicking a second time", () => { when.modal.fillLayers({ type: "symbol", layer: "example", @@ -286,8 +286,8 @@ describe("layers list", () => { }); }); - describe("raster", () => { - it("add", () => { + test.describe("raster", () => { + test("add", () => { const id = when.modal.fillLayers({ type: "raster", layer: "raster", @@ -305,8 +305,8 @@ describe("layers list", () => { }); }); - describe("circle", () => { - it("add", () => { + test.describe("circle", () => { + test("add", () => { const id = when.modal.fillLayers({ type: "circle", layer: "example", @@ -324,8 +324,8 @@ describe("layers list", () => { }); }); - describe("fill extrusion", () => { - it("add", () => { + test.describe("fill extrusion", () => { + test("add", () => { const id = when.modal.fillLayers({ type: "fill-extrusion", layer: "example", @@ -343,8 +343,8 @@ describe("layers list", () => { }); }); - describe("hillshade", () => { - it("add", () => { + test.describe("hillshade", () => { + test("add", () => { const id = when.modal.fillLayers({ type: "hillshade", layer: "example", @@ -361,7 +361,7 @@ describe("layers list", () => { }); }); - it("set hillshade illumination direction array", () => { + test("set hillshade illumination direction array", () => { const id = when.modal.fillLayers({ type: "hillshade", layer: "example", @@ -387,7 +387,7 @@ describe("layers list", () => { }); }); - it("set hillshade highlight color array", () => { + test("set hillshade highlight color array", () => { const id = when.modal.fillLayers({ type: "hillshade", layer: "example", @@ -412,8 +412,8 @@ describe("layers list", () => { }); }); - describe("color-relief", () => { - it("add", () => { + test.describe("color-relief", () => { + test("add", () => { const id = when.modal.fillLayers({ type: "color-relief", layer: "example", @@ -430,7 +430,7 @@ describe("layers list", () => { }); }); - it("adds elevation expression when clicking the elevation button", () => { + test("adds elevation expression when clicking the elevation button", () => { when.modal.fillLayers({ type: "color-relief", layer: "example", @@ -441,8 +441,8 @@ describe("layers list", () => { }); }); - describe("groups", () => { - it("simple", () => { + test.describe("groups", () => { + test("simple", () => { when.setStyle("geojson"); when.modal.open(); @@ -477,8 +477,8 @@ describe("layers list", () => { }); }); - describe("drag and drop", () => { - it("move layer should update local storage", () => { + test.describe("drag and drop", () => { + test("move layer should update local storage", () => { when.modal.open(); const firstId = when.modal.fillLayers({ id: "a", @@ -516,8 +516,8 @@ describe("layers list", () => { }); }); - describe("sticky header", () => { - it("should keep header visible when scrolling layer list", () => { + test.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++) { when.modal.open(); diff --git a/e2e/map.spec.ts b/e2e/map.spec.ts index c131422c..4ed7acf7 100644 --- a/e2e/map.spec.ts +++ b/e2e/map.spec.ts @@ -1,10 +1,10 @@ import { MaputnikDriver } from "./maputnik-driver"; -describe("map", () => { +test.describe("map", () => { const { beforeAndAfter, get, when, then } = new MaputnikDriver(); beforeAndAfter(); - describe("zoom level", () => { - it("via url", () => { + test.describe("zoom level", () => { + test("via url", () => { const zoomLevel = 12.37; when.setStyle("geojson", zoomLevel); then(get.elementByTestId("maplibre:ctrl-zoom")).shouldBeVisible(); @@ -13,7 +13,7 @@ describe("map", () => { ); }); - it("via map controls", () => { + test("via map controls", () => { const zoomLevel = 12.37; when.setStyle("geojson", zoomLevel); then(get.elementByTestId("maplibre:ctrl-zoom")).shouldBeVisible(); @@ -23,7 +23,7 @@ describe("map", () => { ); }); - it("via style file definition", () => { + test("via style file definition", () => { when.setStyle("zoom_7_center_0_51"); then(get.elementByTestId("maplibre:ctrl-zoom")).shouldBeVisible(); then(get.elementByTestId("maplibre:ctrl-zoom")).shouldContainText( @@ -39,23 +39,23 @@ describe("map", () => { }); }); - describe("search", () => { - it("should exist", () => { + test.describe("search", () => { + test("should exist", () => { then(get.searchControl()).shouldBeVisible(); }); }); - describe("popup", () => { + test.describe("popup", () => { beforeEach(() => { when.setStyle("rectangles"); then(get.locationHash().should("exist")); }); - it("should open on feature click", () => { + test("should open on feature click", () => { when.clickCenter("maplibre:map"); then(get.elementByTestId("feature-layer-popup")).shouldBeVisible(); }); - it("should open a second feature after closing popup", () => { + test("should open a second feature after closing popup", () => { when.clickCenter("maplibre:map"); then(get.elementByTestId("feature-layer-popup")).shouldBeVisible(); when.closePopup(); diff --git a/e2e/modals.spec.ts b/e2e/modals.spec.ts index 89b01b8d..e442f945 100644 --- a/e2e/modals.spec.ts +++ b/e2e/modals.spec.ts @@ -1,34 +1,34 @@ import { MaputnikDriver } from "./maputnik-driver"; import tokens from "../../src/config/tokens.json" with {type: "json"}; -describe("modals", () => { +test.describe("modals", () => { const { beforeAndAfter, when, get, given, then } = new MaputnikDriver(); beforeAndAfter(); beforeEach(() => { when.setStyle(""); }); - describe("open", () => { + test.describe("open", () => { beforeEach(() => { when.click("nav:open"); }); - it("close", () => { + test("close", () => { when.modal.close("modal:open"); then(get.elementByTestId("modal:open")).shouldNotExist(); }); - it("upload", () => { + test("upload", () => { when.chooseExampleFile(); then(get.fixture("example-style.json")).shouldEqualToStoredStyle(); }); - it("upload via drag and drop", () => { + test("upload via drag and drop", () => { when.dropExampleFile(); then(get.fixture("example-style.json")).shouldEqualToStoredStyle(); }); - describe("when click open url", () => { + test.describe("when click open url", () => { beforeEach(() => { const styleFileUrl = get.exampleFileUrl(); @@ -36,14 +36,14 @@ describe("modals", () => { when.click("modal:open.url.button"); when.wait(200); }); - it("load from url", () => { + test("load from url", () => { then(get.responseBody("example-style.json")).shouldEqualToStoredStyle(); }); }); }); - describe("shortcuts", () => { - it("open/close", () => { + test.describe("shortcuts", () => { + test("open/close", () => { when.setStyle(""); when.typeKeys("?"); when.modal.close("modal:shortcuts"); @@ -51,30 +51,30 @@ describe("modals", () => { }); }); - describe("export", () => { + test.describe("export", () => { beforeEach(() => { when.click("nav:export"); }); - it("close", () => { + test("close", () => { when.modal.close("modal:export"); then(get.elementByTestId("modal:export")).shouldNotExist(); }); // TODO: Work out how to download a file and check the contents - it("download"); + test("download"); }); - describe("sources", () => { + test.describe("sources", () => { beforeEach(() => { when.setStyle("layer"); when.click("nav:sources"); }); - it("active sources"); - it("public source"); + test("active sources"); + test("public source"); - it("add new source", () => { + test("add new source", () => { const sourceId = "n1z2v3r"; when.setValue("modal:sources.add.source_id", sourceId); when.select("modal:sources.add.source_type", "tile_vector"); @@ -88,7 +88,7 @@ describe("modals", () => { }); }); - it("add new pmtiles source", () => { + test("add new pmtiles source", () => { const sourceId = "pmtilestest"; when.setValue("modal:sources.add.source_id", sourceId); when.select("modal:sources.add.source_type", "pmtiles_vector"); @@ -106,7 +106,7 @@ describe("modals", () => { }); }); - it("add new raster source", () => { + test("add new raster source", () => { const sourceId = "rastertest"; when.setValue("modal:sources.add.source_id", sourceId); when.select("modal:sources.add.source_type", "tile_raster"); @@ -122,59 +122,59 @@ describe("modals", () => { }); }); - describe("inspect", () => { - it("toggle", () => { + test.describe("inspect", () => { + test("toggle", () => { // There is no assertion in this test when.setStyle("geojson"); when.select("maputnik-select", "inspect"); }); }); - describe("style settings", () => { + test.describe("style settings", () => { beforeEach(() => { when.click("nav:settings"); }); - describe("when click name filed spec information", () => { + test.describe("when click name filed spec information", () => { beforeEach(() => { when.click("field-doc-button-Name"); }); - it("should show the spec information", () => { + test("should show the spec information", () => { then(get.elementsText("spec-field-doc")).shouldInclude( "name for the style" ); }); }); - describe("when set name and click owner", () => { + test.describe("when set name and click owner", () => { beforeEach(() => { when.setValue("modal:settings.name", "foobar"); when.click("modal:settings.owner"); when.wait(200); }); - it("show name specifications", () => { + test("show name specifications", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ name: "foobar", }); }); }); - describe("when set owner and click name", () => { + test.describe("when set owner and click name", () => { beforeEach(() => { when.setValue("modal:settings.owner", "foobar"); when.click("modal:settings.name"); when.wait(200); }); - it("should update owner in local storage", () => { + test("should update owner in local storage", () => { then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ owner: "foobar", }); }); }); - it("sprite url", () => { + test("sprite url", () => { when.setTextInJsonEditor("\"http://example.com\""); when.click("modal:settings.name"); then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ @@ -182,7 +182,7 @@ describe("modals", () => { }); }); - it("sprite object", () => { + test("sprite object", () => { when.setTextInJsonEditor(JSON.stringify([{ id: "1", url: "2" }])); when.click("modal:settings.name"); @@ -191,7 +191,7 @@ describe("modals", () => { }); }); - it("glyphs url", () => { + test("glyphs url", () => { const glyphsUrl = "http://example.com/{fontstack}/{range}.pbf"; when.setValue("modal:settings.glyphs", glyphsUrl); when.click("modal:settings.name"); @@ -200,7 +200,7 @@ describe("modals", () => { }); }); - it("maptiler access token", () => { + test("maptiler access token", () => { const apiKey = "testing123"; when.setValue( "modal:settings.maputnik:openmaptiles_access_token", @@ -214,7 +214,7 @@ describe("modals", () => { }); }); - it("thunderforest access token", () => { + test("thunderforest access token", () => { const apiKey = "testing123"; when.setValue( "modal:settings.maputnik:thunderforest_access_token", @@ -226,7 +226,7 @@ describe("modals", () => { ).shouldInclude({ "maputnik:thunderforest_access_token": apiKey }); }); - it("stadia access token", () => { + test("stadia access token", () => { const apiKey = "testing123"; when.setValue( "modal:settings.maputnik:stadia_access_token", @@ -238,7 +238,7 @@ describe("modals", () => { ).shouldInclude({ "maputnik:stadia_access_token": apiKey }); }); - it("locationiq access token", () => { + test("locationiq access token", () => { const apiKey = "testing123"; when.setValue( "modal:settings.maputnik:locationiq_access_token", @@ -250,14 +250,14 @@ describe("modals", () => { ).shouldInclude({ "maputnik:locationiq_access_token": apiKey }); }); - it("style projection mercator", () => { + test("style projection mercator", () => { when.select("modal:settings.projection", "mercator"); then( get.styleFromLocalStorage().then((style) => style.projection) ).shouldInclude({ type: "mercator" }); }); - it("style projection globe", () => { + test("style projection globe", () => { when.select("modal:settings.projection", "globe"); then( get.styleFromLocalStorage().then((style) => style.projection) @@ -265,7 +265,7 @@ describe("modals", () => { }); - it("style projection vertical-perspective", () => { + test("style projection vertical-perspective", () => { when.select("modal:settings.projection", "vertical-perspective"); then( get.styleFromLocalStorage().then((style) => style.projection) @@ -273,7 +273,7 @@ describe("modals", () => { }); - it("style renderer", () => { + test("style renderer", () => { cy.on("uncaught:exception", () => false); // this is due to the fact that this is an invalid style for openlayers when.select("modal:settings.maputnik:renderer", "ol"); then(get.inputValue("modal:settings.maputnik:renderer")).shouldEqual( @@ -288,7 +288,7 @@ describe("modals", () => { - it("include API key when change renderer", () => { + test("include API key when change renderer", () => { when.click("modal:settings.close-modal"); when.click("nav:open"); @@ -321,13 +321,13 @@ describe("modals", () => { }); - describe("add layer", () => { + test.describe("add layer", () => { beforeEach(() => { when.setStyle("layer"); when.modal.open(); }); - it("shows duplicate id error", () => { + test("shows duplicate id error", () => { when.setValue("add-layer.layer-id.input", "background"); when.click("add-layer"); then(get.elementByTestId("modal:add-layer")).shouldExist(); @@ -337,16 +337,16 @@ describe("modals", () => { }); }); - describe("sources", () => { - it("toggle"); + test.describe("sources", () => { + test("toggle"); }); - describe("global state", () => { + test.describe("global state", () => { beforeEach(() => { when.click("nav:global-state"); }); - it("add variable", () => { + test("add variable", () => { when.wait(100); when.click("global-state-add-variable"); then(get.styleFromLocalStorage()).shouldDeepNestedInclude({ @@ -355,7 +355,7 @@ describe("modals", () => { }); - it("add multiple variables", () => { + test("add multiple variables", () => { when.click("global-state-add-variable"); when.click("global-state-add-variable"); when.click("global-state-add-variable"); @@ -365,7 +365,7 @@ describe("modals", () => { }); }); - it("remove variable", () => { + test("remove variable", () => { when.click("global-state-add-variable"); when.click("global-state-add-variable"); when.click("global-state-add-variable"); @@ -376,7 +376,7 @@ describe("modals", () => { }); }); - it("edit variable key", () => { + test("edit variable key", () => { when.click("global-state-add-variable"); when.wait(100); when.setValue("global-state-variable-key:0", "mykey"); @@ -387,7 +387,7 @@ describe("modals", () => { }); }); - it("edit variable value", () => { + test("edit variable value", () => { when.click("global-state-add-variable"); when.wait(100); when.setValue("global-state-variable-value:0", "myvalue"); @@ -399,12 +399,12 @@ describe("modals", () => { }); }); - describe("error panel", () => { - it("not visible when no errors", () => { + test.describe("error panel", () => { + test("not visible when no errors", () => { then(get.element("maputnik-message-panel-error")).shouldNotExist(); }); - it("visible on style error", () => { + test("visible on style error", () => { when.modal.open(); when.modal.fillLayers({ type: "circle", @@ -414,8 +414,8 @@ describe("modals", () => { }); }); - describe("Handle localStorage QuotaExceededError", () => { - it("handles quota exceeded error when opening style from URL", () => { + test.describe("Handle localStorage QuotaExceededError", () => { + test("handles quota exceeded error when opening style from URL", () => { // Clear localStorage to start fresh cy.clearLocalStorage();