mirror of
https://github.com/maputnik/editor.git
synced 2026-06-18 13:17:27 +00:00
Improve drivers (#856)
Co-authored-by: shelly_goldblit <shelly_goldblit@dell.com> Co-authored-by: HarelM <harel.mazor@gmail.com>
This commit is contained in:
ShellyDCMS
GitHub
+108
-100
@@ -1,46 +1,106 @@
|
||||
import CypressWrapperDriver from "./cypress-wrapper-driver";
|
||||
import { CypressHelper } from "@shellygo/cypress-test-utils";
|
||||
import { Assertable, then } from "@shellygo/cypress-test-utils/assertable";
|
||||
import MaputnikCypressHelper from "./maputnik-cypress-helper";
|
||||
import ModalDriver from "./modal-driver";
|
||||
const baseUrl = "http://localhost:8888/";
|
||||
|
||||
const SERVER_ADDRESS = "http://localhost:8888/";
|
||||
const styleFromWindow = (win: Window) => {
|
||||
const styleId = win.localStorage.getItem("maputnik:latest_style");
|
||||
const styleItem = win.localStorage.getItem(`maputnik:style:${styleId}`);
|
||||
const obj = JSON.parse(styleItem || "");
|
||||
return obj;
|
||||
};
|
||||
|
||||
export default class MaputnikDriver {
|
||||
private helper = new CypressWrapperDriver();
|
||||
export class MaputnikAssertable<T> extends Assertable<T> {
|
||||
shouldEqualToStoredStyle = () =>
|
||||
then(
|
||||
new CypressHelper().get.window().then((win) => {
|
||||
const style = styleFromWindow(win);
|
||||
then(this.chainable).shouldDeepNestedInclude(style);
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
export class MaputnikDriver {
|
||||
private helper = new MaputnikCypressHelper();
|
||||
private modalDriver = new ModalDriver();
|
||||
|
||||
public beforeAndAfter = () => {
|
||||
beforeEach(() => {
|
||||
this.given.setupInterception();
|
||||
this.given.setupMockBackedResponses();
|
||||
this.when.setStyle("both");
|
||||
});
|
||||
};
|
||||
|
||||
public given = {
|
||||
setupInterception: () => {
|
||||
this.helper.given.interceptGetToFile(SERVER_ADDRESS + "example-style.json");
|
||||
this.helper.given.interceptGetToFile(SERVER_ADDRESS + "example-layer-style.json");
|
||||
this.helper.given.interceptGetToFile(SERVER_ADDRESS + "geojson-style.json");
|
||||
this.helper.given.interceptGetToFile(SERVER_ADDRESS + "raster-style.json");
|
||||
this.helper.given.interceptGetToFile(SERVER_ADDRESS + "geojson-raster-style.json");
|
||||
public then = (chainable: Cypress.Chainable<any>) =>
|
||||
new MaputnikAssertable(chainable);
|
||||
|
||||
this.helper.given.interceptAndIgnore("*example.local/*");
|
||||
this.helper.given.interceptAndIgnore("*example.com/*");
|
||||
public given = {
|
||||
...this.helper.given,
|
||||
setupMockBackedResponses: () => {
|
||||
this.helper.given.interceptAndMockResponse({
|
||||
method: "GET",
|
||||
url: baseUrl + "example-style.json",
|
||||
response: {
|
||||
fixture: "example-style.json",
|
||||
},
|
||||
alias: "example-style.json",
|
||||
});
|
||||
this.helper.given.interceptAndMockResponse({
|
||||
method: "GET",
|
||||
url: baseUrl + "example-layer-style.json",
|
||||
response: {
|
||||
fixture: "example-layer-style.json",
|
||||
},
|
||||
});
|
||||
this.helper.given.interceptAndMockResponse({
|
||||
method: "GET",
|
||||
url: baseUrl + "geojson-style.json",
|
||||
response: {
|
||||
fixture: "geojson-style.json",
|
||||
},
|
||||
});
|
||||
this.helper.given.interceptAndMockResponse({
|
||||
method: "GET",
|
||||
url: baseUrl + "raster-style.json",
|
||||
response: {
|
||||
fixture: "raster-style.json",
|
||||
},
|
||||
});
|
||||
this.helper.given.interceptAndMockResponse({
|
||||
method: "GET",
|
||||
url: baseUrl + "geojson-raster-style.json",
|
||||
response: {
|
||||
fixture: "geojson-raster-style.json",
|
||||
},
|
||||
});
|
||||
this.helper.given.interceptAndMockResponse({
|
||||
method: "GET",
|
||||
url: "*example.local/*",
|
||||
response: [],
|
||||
});
|
||||
this.helper.given.interceptAndMockResponse({
|
||||
method: "GET",
|
||||
url: "*example.com/*",
|
||||
response: [],
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
public when = {
|
||||
...this.helper.when,
|
||||
modal: this.modalDriver.when,
|
||||
within: (selector: string, fn: () => void) => {
|
||||
this.helper.when.within(fn, selector);
|
||||
},
|
||||
tab: () => this.helper.get.elementByClassOrType("body").tab(),
|
||||
waitForExampleFileRequset: () => {
|
||||
tab: () => this.helper.get.element("body").tab(),
|
||||
waitForExampleFileResponse: () => {
|
||||
this.helper.when.waitForResponse("example-style.json");
|
||||
},
|
||||
chooseExampleFile: () => {
|
||||
this.helper.get.elementByClassOrType("input[type='file']").selectFile(
|
||||
"cypress/fixtures/example-style.json",
|
||||
{ force: true }
|
||||
);
|
||||
this.helper.get
|
||||
.bySelector("type", "file")
|
||||
.selectFile("cypress/fixtures/example-style.json", { force: true });
|
||||
},
|
||||
setStyle: (
|
||||
styleProperties: "geojson" | "raster" | "both" | "layer" | "",
|
||||
@@ -49,52 +109,43 @@ export default class MaputnikDriver {
|
||||
let url = "?debug";
|
||||
switch (styleProperties) {
|
||||
case "geojson":
|
||||
url += `&style=${SERVER_ADDRESS}geojson-style.json`;
|
||||
url += `&style=${baseUrl}geojson-style.json`;
|
||||
break;
|
||||
case "raster":
|
||||
url += `&style=${SERVER_ADDRESS}raster-style.json`;
|
||||
url += `&style=${baseUrl}raster-style.json`;
|
||||
break;
|
||||
case "both":
|
||||
url += `&style=${SERVER_ADDRESS}geojson-raster-style.json`;
|
||||
url += `&style=${baseUrl}geojson-raster-style.json`;
|
||||
break;
|
||||
case "layer":
|
||||
url += `&style=${SERVER_ADDRESS}/example-layer-style.json`;
|
||||
url += `&style=${baseUrl}/example-layer-style.json`;
|
||||
break;
|
||||
}
|
||||
if (zoom) {
|
||||
url += `#${zoom}/41.3805/2.1635`;
|
||||
}
|
||||
this.helper.when.visit(SERVER_ADDRESS + url);
|
||||
this.helper.when.visit(baseUrl + url);
|
||||
if (styleProperties) {
|
||||
this.helper.when.confirmAlert();
|
||||
this.helper.when.acceptConfirm();
|
||||
}
|
||||
this.helper.get.element("toolbar:link").should("be.visible");
|
||||
// when methods should not include assertions
|
||||
this.helper.get.elementByTestId("toolbar:link").should("be.visible");
|
||||
},
|
||||
|
||||
typeKeys: (keys: string, selector?: string) => {
|
||||
if (selector) {
|
||||
this.helper.get.element(selector).type(keys);
|
||||
} else {
|
||||
this.helper.get.elementByClassOrType("body").type(keys);
|
||||
}
|
||||
},
|
||||
typeKeys: (keys: string) => this.helper.get.element("body").type(keys),
|
||||
|
||||
click: (selector: string) => {
|
||||
this.helper.when.click(selector);
|
||||
},
|
||||
|
||||
clickZoomin: () => {
|
||||
this.helper.get.elementByClassOrType(".maplibregl-ctrl-zoom-in").click();
|
||||
clickZoomIn: () => {
|
||||
this.helper.get.element(".maplibregl-ctrl-zoom-in").click();
|
||||
},
|
||||
|
||||
selectWithin: (selector: string, value: string) => {
|
||||
this.when.within(selector, () => {
|
||||
this.helper.get.elementByClassOrType("select").select(value);
|
||||
this.helper.get.element("select").select(value);
|
||||
});
|
||||
},
|
||||
|
||||
select: (selector: string, value: string) => {
|
||||
this.helper.get.element(selector).select(value);
|
||||
this.helper.get.elementByTestId(selector).select(value);
|
||||
},
|
||||
|
||||
focus: (selector: string) => {
|
||||
@@ -102,72 +153,29 @@ export default class MaputnikDriver {
|
||||
},
|
||||
|
||||
setValue: (selector: string, text: string) => {
|
||||
this.helper.get.element(selector).clear().type(text, { parseSpecialCharSequences: false });
|
||||
this.helper.get
|
||||
.elementByTestId(selector)
|
||||
.clear()
|
||||
.type(text, { parseSpecialCharSequences: false });
|
||||
},
|
||||
};
|
||||
|
||||
public get = {
|
||||
...this.helper.get,
|
||||
isMac: () => {
|
||||
return Cypress.platform === "darwin";
|
||||
},
|
||||
styleFromWindow: (win: Window) => {
|
||||
const styleId = win.localStorage.getItem("maputnik:latest_style");
|
||||
const styleItem = win.localStorage.getItem(`maputnik:style:${styleId}`);
|
||||
const obj = JSON.parse(styleItem || "");
|
||||
return obj;
|
||||
},
|
||||
|
||||
styleFromLocalStorage: () =>
|
||||
this.helper.get.window().then((win) => styleFromWindow(win)),
|
||||
|
||||
exampleFileUrl: () => {
|
||||
return SERVER_ADDRESS + "example-style.json";
|
||||
return baseUrl + "example-style.json";
|
||||
},
|
||||
};
|
||||
|
||||
public should = {
|
||||
canvasBeFocused: () => {
|
||||
this.when.within("maplibre:map", () => {
|
||||
this.helper.get.elementByClassOrType("canvas").should("be.focused");
|
||||
});
|
||||
},
|
||||
notExist: (selector: string) => {
|
||||
this.helper.get.elementByClassOrType(selector).should("not.exist");
|
||||
},
|
||||
beFocused: (selector: string) => {
|
||||
this.helper.get.element(selector).should("have.focus");
|
||||
},
|
||||
|
||||
notBeFocused: (selector: string) => {
|
||||
this.helper.get.element(selector).should("not.have.focus");
|
||||
},
|
||||
|
||||
beVisible: (selector: string) => {
|
||||
this.helper.get.element(selector).should("be.visible");
|
||||
},
|
||||
|
||||
notBeVisible: (selector: string) => {
|
||||
this.helper.get.element(selector).should("not.be.visible");
|
||||
},
|
||||
|
||||
equalStyleStore: (getter: (obj: any) => any, styleObj: any) => {
|
||||
cy.window().then((win: any) => {
|
||||
const obj = this.get.styleFromWindow(win);
|
||||
assert.deepEqual(getter(obj), styleObj);
|
||||
});
|
||||
},
|
||||
|
||||
styleStoreEqualToExampleFileData: () => {
|
||||
cy.window().then((win: any) => {
|
||||
const obj = this.get.styleFromWindow(win);
|
||||
this.helper.given.fixture("example-style.json", "file:example-style.json").should("deep.equal", obj);
|
||||
});
|
||||
},
|
||||
|
||||
exist: (selector: string) => {
|
||||
this.helper.get.element(selector).should("exist");
|
||||
},
|
||||
beSelected: (selector: string, value: string) => {
|
||||
this.helper.get.element(selector).find(`option[value="${value}"]`).should("be.selected");
|
||||
},
|
||||
containText: (selector: string, text: string) => {
|
||||
this.helper.get.element(selector).should("contain.text", text);
|
||||
}
|
||||
skipTargetLayerList: () =>
|
||||
this.helper.get.elementByTestId("skip-target-layer-list"),
|
||||
skipTargetLayerEditor: () =>
|
||||
this.helper.get.elementByTestId("skip-target-layer-editor"),
|
||||
canvas: () => this.helper.get.element("canvas"),
|
||||
};
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user