move then into driver

cypress/e2e/accessibility.cy.ts

@@ -1,7 +1,7 @@
-import { MaputnikDriver, then } from "./maputnik-driver";
+import { MaputnikDriver } from "./maputnik-driver";
 
 describe("accessibility", () => {
-  let { beforeAndAfter, get, when, should } = new MaputnikDriver();
+  let { beforeAndAfter, get, when, should, then } = new MaputnikDriver();
   beforeAndAfter();
 
   describe("skip links", () => {

cypress/e2e/history.cy.ts

@@ -1,7 +1,7 @@
 import { MaputnikDriver } from "./maputnik-driver";
 
 describe("history", () => {
-  let { beforeAndAfter, when, get, should } = new MaputnikDriver();
+  let { beforeAndAfter, when, get, should, then } = new MaputnikDriver();
   beforeAndAfter();
 
   let undoKeyCombo: string;

cypress/e2e/keyboard.cy.ts

@@ -1,7 +1,7 @@
-import { MaputnikDriver, then } from "./maputnik-driver";
+import { MaputnikDriver } from "./maputnik-driver";
 
 describe("keyboard", () => {
-  let { beforeAndAfter, given, when, get } = new MaputnikDriver();
+  let { beforeAndAfter, given, when, get, then } = new MaputnikDriver();
   beforeAndAfter();
   describe("shortcuts", () => {
     beforeEach(() => {

cypress/e2e/layers.cy.ts

@@ -1,8 +1,8 @@
 import { v1 as uuid } from "uuid";
-import { MaputnikDriver, then } from "./maputnik-driver";
+import { MaputnikDriver } from "./maputnik-driver";
 
 describe("layers", () => {
-  let { beforeAndAfter, get, when, should } = new MaputnikDriver();
+  let { beforeAndAfter, get, when, should, then } = new MaputnikDriver();
   beforeAndAfter();
   beforeEach(() => {
     when.setStyle("both");
@@ -18,16 +18,14 @@ describe("layers", () => {
     });
 
     it("should update layers in local storage", () => {
-      then(get.maputnikStyleFromLocalStorage()).shouldIncludeLocalStrorageStyle(
+      then(get.maputnikStyleFromLocalStorage()).shouldIncludeLocalStorageStyle({
-        {
+        layers: [
-          layers: [
+          {
-            {
+            id: id,
-              id: id,
+            type: "background",
-              type: "background",
+          },
-            },
+        ],
-          ],
+      });
-        }
-      );
     });
 
     describe("when clicking delete", () => {
@@ -37,7 +35,7 @@ describe("layers", () => {
       it("should empty layers in local storage", () => {
         then(
           get.maputnikStyleFromLocalStorage()
-        ).shouldIncludeLocalStrorageStyle({
+        ).shouldIncludeLocalStorageStyle({
           layers: [],
         });
       });
@@ -50,7 +48,7 @@ describe("layers", () => {
       it("should add copy layer in local storage", () => {
         then(
           get.maputnikStyleFromLocalStorage()
-        ).shouldIncludeLocalStrorageStyle({
+        ).shouldIncludeLocalStorageStyle({
           layers: [
             {
               id: id + "-copy",
@@ -73,7 +71,7 @@ describe("layers", () => {
       it("should update visibility to none in local storage", () => {
         then(
           get.maputnikStyleFromLocalStorage()
-        ).shouldIncludeLocalStrorageStyle({
+        ).shouldIncludeLocalStorageStyle({
           layers: [
             {
               id: id,
@@ -94,7 +92,7 @@ describe("layers", () => {
         it("should update visibility to visible in local storage", () => {
           then(
             get.maputnikStyleFromLocalStorage()
-          ).shouldIncludeLocalStrorageStyle({
+          ).shouldIncludeLocalStorageStyle({
             layers: [
               {
                 id: id,
@@ -184,7 +182,7 @@ describe("layers", () => {
           it("should update min-zoom in local storage", () => {
             then(
               get.maputnikStyleFromLocalStorage()
-            ).shouldIncludeLocalStrorageStyle({
+            ).shouldIncludeLocalStorageStyle({
               layers: [
                 {
                   id: "background:" + bgId,
@@ -200,7 +198,7 @@ describe("layers", () => {
             when.click("max-zoom.input-text");
             then(
               get.maputnikStyleFromLocalStorage()
-            ).shouldIncludeLocalStrorageStyle({
+            ).shouldIncludeLocalStorageStyle({
               layers: [
                 {
                   id: "background:" + bgId,
@@ -223,7 +221,7 @@ describe("layers", () => {
           });
 
           it("should update style in local storage", () => {
-            then(cy.window()).shouldIncludeLocalStrorageStyle({
+            then(cy.window()).shouldIncludeLocalStorageStyle({
               layers: [
                 {
                   id: "background:" + bgId,
@@ -246,10 +244,10 @@ describe("layers", () => {
             when.click("layer-editor.layer-id");
           });
 
-          it("should update style in local stroage", () => {
+          it("should update style in local storage", () => {
             then(
               get.maputnikStyleFromLocalStorage()
-            ).shouldIncludeLocalStrorageStyle({
+            ).shouldIncludeLocalStorageStyle({
               layers: [
                 {
                   id: "background:" + bgId,
@@ -264,14 +262,14 @@ describe("layers", () => {
 
           describe("when unsetting", () => {
             beforeEach(() => {
-              when.type("layer-comment.input", "{backspace}{backspace}");
+              when.clear("layer-comment.input");
               when.click("min-zoom.input-text");
             });
 
             it("should update style in local storage", () => {
               then(
                 get.maputnikStyleFromLocalStorage()
-              ).shouldIncludeLocalStrorageStyle({
+              ).shouldIncludeLocalStorageStyle({
                 layers: [
                   {
                     id: "background:" + bgId,
@@ -294,7 +292,7 @@ describe("layers", () => {
           it("should update style in local storage", () => {
             then(
               get.maputnikStyleFromLocalStorage()
-            ).shouldIncludeLocalStrorageStyle({
+            ).shouldIncludeLocalStorageStyle({
               layers: [
                 {
                   id: "background:" + bgId,
@@ -501,10 +499,10 @@ describe("layers", () => {
         get.elementByTestId("layer-list-group:foo_bar_baz")
       ).shouldNotBeVisible();
       when.click("layer-list-group:foo-0");
-      then(get.elementByTestId("layer-list-group:foo")).shouldBeVisible();
+      then(get.elementByTestId("layer-list-item:foo")).shouldBeVisible();
-      then(get.elementByTestId("layer-list-group:foo_bar")).shouldBeVisible();
+      then(get.elementByTestId("layer-list-item:foo_bar")).shouldBeVisible();
       then(
-        get.elementByTestId("layer-list-group:foo_bar_baz")
+        get.elementByTestId("layer-list-item:foo_bar_baz")
       ).shouldBeVisible();
     });
   });

cypress/e2e/map.cy.ts

@@ -1,7 +1,7 @@
-import { MaputnikDriver, then } from "./maputnik-driver";
+import { MaputnikDriver } from "./maputnik-driver";
 
 describe("map", () => {
-  let { beforeAndAfter, get, when } = new MaputnikDriver();
+  let { beforeAndAfter, get, when, then } = new MaputnikDriver();
   beforeAndAfter();
   describe("zoom level", () => {
     it("via url", () => {

cypress/e2e/maputnik-driver.ts

@@ -1,7 +1,4 @@
-import {
+import { Assertable, then } from "@shellygo/cypress-test-utils/assertable";
-  Assertable,
-  then as baseThen,
-} from "@shellygo/cypress-test-utils/assertable";
 import CypressWrapperDriver from "./cypress-wrapper-driver";
 import ModalDriver from "./modal-driver";
 const baseUrl = "http://localhost:8888/";
@@ -13,20 +10,17 @@ export class MaputnikAssertable<T> extends Assertable<T> {
     const obj = JSON.parse(styleItem || "");
     return obj;
   };
-  shouldIncludeLocalStrorageStyle = (styleObj: Object) =>
+  shouldIncludeLocalStorageStyle = (styleObj: Object) =>
-    baseThen(
+    then(
       cy.window().then((win) => this.getStyleFromWindow(win))
     ).shouldDeepNestedInclude(styleObj);
 
   shouldHaveLocalStorageStyle = (styleObj: Object) =>
-    baseThen(
+    then(
       cy.window().then((win) => this.getStyleFromWindow(win))
     ).shouldDeepEqual(styleObj);
 }
 
-export const then = (chainable: Cypress.Chainable<any>) =>
-  new MaputnikAssertable(chainable);
-
 export class MaputnikDriver {
   private helper = new CypressWrapperDriver();
   private modalDriver = new ModalDriver();
@@ -38,6 +32,9 @@ export class MaputnikDriver {
     });
   };
 
+  public then = (chainable: Cypress.Chainable<any>) =>
+    new MaputnikAssertable(chainable);
+
   public given = {
     ...this.helper.given,
     setupMockBackedResponses: () => {
@@ -111,18 +108,18 @@ export class MaputnikDriver {
     ) => {
       let url = "?debug";
       switch (styleProperties) {
-      case "geojson":
+        case "geojson":
-        url += `&style=${baseUrl}geojson-style.json`;
+          url += `&style=${baseUrl}geojson-style.json`;
-        break;
+          break;
-      case "raster":
+        case "raster":
-        url += `&style=${baseUrl}raster-style.json`;
+          url += `&style=${baseUrl}raster-style.json`;
-        break;
+          break;
-      case "both":
+        case "both":
-        url += `&style=${baseUrl}geojson-raster-style.json`;
+          url += `&style=${baseUrl}geojson-raster-style.json`;
-        break;
+          break;
-      case "layer":
+        case "layer":
-        url += `&style=${baseUrl}/example-layer-style.json`;
+          url += `&style=${baseUrl}/example-layer-style.json`;
-        break;
+          break;
       }
       if (zoom) {
         url += `#${zoom}/41.3805/2.1635`;

cypress/e2e/modals.cy.ts

@@ -1,7 +1,7 @@
-import { MaputnikDriver, then } from "./maputnik-driver";
+import { MaputnikDriver } from "./maputnik-driver";
 
 describe("modals", () => {
-  let { beforeAndAfter, when, get } = new MaputnikDriver();
+  let { beforeAndAfter, when, get, then } = new MaputnikDriver();
   beforeAndAfter();
 
   beforeEach(() => {