ashatora/editor
1
0
Fork 0
mirror of https://github.com/maputnik/editor.git synced 2026-06-15 11:47:26 +00:00
Code Issues Projects Releases Wiki Activity

Improve tests (#854)

Browse Source 
Recover commented out tests, 
Improve usage of helper in driver, 
Added data-wd-key for test to use instead of classes
Moved all non tsx file to a single folder (lib) instead of lib and utils

---------

Co-authored-by: Yuri Astrakhan <yuriastrakhan@gmail.com>
This commit is contained in:
Harel M
2023-12-27 10:19:59 +02:00
committed by GitHub
parent 09a1f3f87b
commit b784bf2b84
31 changed files with 62 additions and 405 deletions
Download Patch File Download Diff File Expand all files Collapse all files
cypress/e2e/driver.ts
+15 -16
View File
@@ -71,7 +71,7 @@ export default class MaputnikDriver {
if (styleProperties) {
cy.on("window:confirm", () => true);
}
cy.get(".maputnik-toolbar-link").should("be.visible");
this.helper.get.element("toolbar:link").should("be.visible");
},
fillLayersModal: (opts: {type: string, layer?: string, id?: string}) => {
var type = opts.type;
@@ -83,22 +83,24 @@ export default class MaputnikDriver {
id = `${type}:${uuid()}`;
}
cy.get(
this.get.dataAttribute("add-layer.layer-type", "select")
).select(type);
cy.get(this.get.dataAttribute("add-layer.layer-id", "input")).type(id);
this.helper.get.element("add-layer.layer-type.select").select(type);
this.helper.get.element("add-layer.layer-id.input").type(id);
if (layer) {
cy.get(
this.get.dataAttribute("add-layer.layer-source-block", "input")
).type(layer);
this.when.within("add-layer.layer-source-block", () => {
cy.get("input").type(layer!);
})
}
this.when.click("add-layer");
return id;
},
typeKeys: (keys: string) => {
cy.get("body").type(keys);
typeKeys: (keys: string, selector?: string) => {
if (selector) {
this.helper.get.element(selector).type(keys);
} else {
cy.get("body").type(keys);
}
},
click: (selector: string) => {
@@ -124,7 +126,7 @@ export default class MaputnikDriver {
},
setValue: (selector: string, text: string) => {
cy.get(selector).clear().type(text, { parseSpecialCharSequences: false });
this.helper.get.element(selector).clear().type(text, { parseSpecialCharSequences: false });
},
closeModal: (key: string) => {
@@ -135,8 +137,8 @@ export default class MaputnikDriver {
openLayersModal: () => {
this.helper.when.click("layer-list:add-layer");
cy.get(this.get.dataAttribute("modal:add-layer")).should("exist");
cy.get(this.get.dataAttribute("modal:add-layer")).should("be.visible");
this.helper.get.element("modal:add-layer").should("exist");
this.helper.get.element("modal:add-layer").should("be.visible");
},
};
@@ -153,9 +155,6 @@ export default class MaputnikDriver {
exampleFileUrl: () => {
return "http://localhost:8888/example-style.json";
},
dataAttribute: (key: string, selector?: string): string => {
return `*[data-wd-key='${key}'] ${selector || ""}`;
},
};
public should = {
cypress/e2e/layers.cy.ts
+19 -36
View File
@@ -134,10 +134,7 @@ describe("layers", () => {
var id = uuid();
when.selectWithin("add-layer.layer-type", "background");
when.setValue(
get.dataAttribute("add-layer.layer-id", "input"),
"background:" + id
);
when.setValue("add-layer.layer-id.input", "background:" + id);
when.click("add-layer");
@@ -162,10 +159,7 @@ describe("layers", () => {
when.click("layer-list-item:background:" + bgId);
var id = uuid();
when.setValue(
get.dataAttribute("layer-editor.layer-id", "input"),
"foobar:" + id
);
when.setValue("layer-editor.layer-id.input", "foobar:" + id);
when.click("min-zoom");
should.equalStyleStore(
@@ -183,10 +177,7 @@ describe("layers", () => {
var bgId = createBackground();
when.click("layer-list-item:background:" + bgId);
when.setValue(
get.dataAttribute("min-zoom", 'input[type="text"]'),
"1"
);
when.setValue("min-zoom.input-text", "1");
when.click("layer-editor.layer-id");
@@ -202,25 +193,20 @@ describe("layers", () => {
);
// AND RESET!
// driver.setValue(driver.get.dataAttribute("min-zoom", "input"), "")
// driver.click(driver.get.dataAttribute("max-zoom", "input"));
when.typeKeys("{backspace}", "min-zoom.input-text");
when.click("max-zoom.input-text");
// driver.isStyleStoreEqual((a: any) => a.layers, [
// {
// "id": 'background:'+bgId,
// "type": 'background'
// }
// ]);
should.equalStyleStore((a: any) => a.layers, [{
"id": 'background:'+bgId,
"type": 'background'
}]);
});
it("max-zoom", () => {
var bgId = createBackground();
when.click("layer-list-item:background:" + bgId);
when.setValue(
get.dataAttribute("max-zoom", 'input[type="text"]'),
"1"
);
when.setValue("max-zoom.input-text", "1");
when.click("layer-editor.layer-id");
@@ -238,10 +224,10 @@ describe("layers", () => {
it("comments", () => {
var bgId = createBackground();
var id = uuid();
var comment = "42";
when.click("layer-list-item:background:" + bgId);
when.setValue(get.dataAttribute("layer-comment", "textarea"), id);
when.setValue("layer-comment.input", comment);
when.click("layer-editor.layer-id");
@@ -252,23 +238,20 @@ describe("layers", () => {
id: "background:" + bgId,
type: "background",
metadata: {
"maputnik:comment": id,
"maputnik:comment": comment,
},
},
]
);
// Unset it again.
// TODO: This fails
// driver.setValue(driver.getDataAttribute("layer-comment", "textarea"), "");
// driver.click(driver.getDataAttribute("min-zoom", "input"));
when.typeKeys("{backspace}{backspace}", "layer-comment.input");
when.click("min-zoom.input-text");
// driver.isStyleStoreEqual((a: any) => a.layers, [
// {
// "id": 'background:'+bgId,
// "type": 'background'
// }
// ]);
should.equalStyleStore((a: any) => a.layers, [{
"id": 'background:' + bgId,
"type": 'background'
}]);
});
it("color", () => {
cypress/e2e/modals.cy.ts
+7 -17
View File
@@ -26,7 +26,7 @@ describe("modals", () => {
it("load from url", () => {
var styleFileUrl = get.exampleFileUrl();
when.setValue(get.dataAttribute("modal:open.url.input"), styleFileUrl);
when.setValue("modal:open.url.input", styleFileUrl);
when.click("modal:open.url.button");
when.waitForExampleFileRequset();
@@ -83,30 +83,27 @@ describe("modals", () => {
});
it("show name specifications", () => {
when.setValue(get.dataAttribute("modal:settings.name"), "foobar");
when.setValue("modal:settings.name", "foobar");
when.click("modal:settings.owner");
should.equalStyleStore((obj) => obj.name, "foobar");
});
it("owner", () => {
when.setValue(get.dataAttribute("modal:settings.owner"), "foobar");
when.setValue("modal:settings.owner", "foobar");
when.click("modal:settings.name");
should.equalStyleStore((obj) => obj.owner, "foobar");
});
it("sprite url", () => {
when.setValue(
get.dataAttribute("modal:settings.sprite"),
"http://example.com"
);
when.setValue("modal:settings.sprite", "http://example.com");
when.click("modal:settings.name");
should.equalStyleStore((obj) => obj.sprite, "http://example.com");
});
it("glyphs url", () => {
var glyphsUrl = "http://example.com/{fontstack}/{range}.pbf";
when.setValue(get.dataAttribute("modal:settings.glyphs"), glyphsUrl);
when.setValue("modal:settings.glyphs", glyphsUrl);
when.click("modal:settings.name");
should.equalStyleStore((obj) => obj.glyphs, glyphsUrl);
@@ -115,9 +112,7 @@ describe("modals", () => {
it("maptiler access token", () => {
var apiKey = "testing123";
when.setValue(
get.dataAttribute(
"modal:settings.maputnik:openmaptiles_access_token"
),
"modal:settings.maputnik:openmaptiles_access_token",
apiKey
);
when.click("modal:settings.name");
@@ -130,12 +125,7 @@ describe("modals", () => {
it("thunderforest access token", () => {
var apiKey = "testing123";
when.setValue(
get.dataAttribute(
"modal:settings.maputnik:thunderforest_access_token"
),
apiKey
);
when.setValue("modal:settings.maputnik:thunderforest_access_token", apiKey);
when.click("modal:settings.name");
should.equalStyleStore(