ashatora/editor
1
0
Fork 0
mirror of https://github.com/maputnik/editor.git synced 2025-12-25 23:50:02 +00:00
Code Issues Projects Releases Wiki Activity

Added more functional tests.

Browse Source
This commit is contained in:
orangemug
2020-05-31 15:33:09 +01:00
parent 3d4cc34a08
commit 8d3ad6b1a1
19 changed files with 1085 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
test/functional/accessibility/index.js Normal file
View File

@@ -0,0 +1,3 @@
describe("accessibility", function () {
require("./skip-links");
})

51
test/functional/accessibility/skip-links.js Normal file
View File

@@ -0,0 +1,51 @@
var assert = require("assert");
var config = require("../../config/specs");
var helper = require("../helper");
var wd = require("../../wd-helper");
describe("skip links", function() {
beforeEach(function () {
browser.url(config.baseUrl+"?debug&style="+helper.getGeoServerUrl("example-layer-style.json"));
browser.acceptAlert();
});
it("skip link to layer list", function() {
const selector = wd.$("root:skip:layer-list")
const elem = $(selector);
assert(elem.isExisting());
browser.keys(['Tab']);
assert(elem.isFocused());
elem.click();
const targetEl = $("#skip-target-layer-list");
assert(targetEl.isFocused());
});
it("skip link to layer editor", function() {
const selector = wd.$("root:skip:layer-editor")
const elem = $(selector);
assert(elem.isExisting());
browser.keys(['Tab']);
browser.keys(['Tab']);
assert(elem.isFocused());
elem.click();
const targetEl = $("#skip-target-layer-editor");
assert(targetEl.isFocused());
});
it("skip link to map view", function() {
const selector = wd.$("root:skip:map-view")
const elem = $(selector);
assert(elem.isExisting());
browser.keys(['Tab']);
browser.keys(['Tab']);
browser.keys(['Tab']);
assert(elem.isFocused());
elem.click();
const targetEl = $(".mapboxgl-canvas");
assert(targetEl.isFocused());
});
});

40
test/functional/history/index.js
View File

@@ -3,7 +3,23 @@ var config = require("../../config/specs");
var helper = require("../helper");
describe.skip("history", function() {
describe("history", function() {
let undoKeyCombo;
let undoKeyComboReset;
let redoKeyCombo;
let redoKeyComboReset;
before(function() {
const isMac = browser.execute(function() {
return navigator.platform.toUpperCase().indexOf('MAC') >= 0;
});
undoKeyCombo = ['Meta', 'z'];
undoKeyComboReset = ['Meta'];
redoKeyCombo = isMac ? ['Meta', 'Shift', 'z'] : ['Meta', 'y'];
redoKeyComboReset = isMac ? ['Meta', 'Shift'] : ['Meta'];
});
/**
* See <https://github.com/webdriverio/webdriverio/issues/1126>
*/
@@ -13,7 +29,7 @@ describe.skip("history", function() {
browser.url(config.baseUrl+"?debug&style="+helper.getStyleUrl([
"geojson:example"
]));
browser.alertAccept();
browser.acceptAlert();
helper.modal.addLayer.open();
@@ -51,9 +67,8 @@ describe.skip("history", function() {
}
]);
browser
.keys(['Control', 'z'])
.keys(['Control']);
browser.keys(undoKeyCombo)
browser.keys(undoKeyComboReset);
styleObj = helper.getStyleStore(browser);
assert.deepEqual(styleObj.layers, [
{
@@ -62,16 +77,14 @@ describe.skip("history", function() {
}
]);
browser
.keys(['Control', 'z'])
.keys(['Control']);
browser.keys(undoKeyCombo)
browser.keys(undoKeyComboReset);
styleObj = helper.getStyleStore(browser);
assert.deepEqual(styleObj.layers, [
]);
browser
.keys(['Control', 'y'])
.keys(['Control']);
browser.keys(redoKeyCombo)
browser.keys(redoKeyComboReset);
styleObj = helper.getStyleStore(browser);
assert.deepEqual(styleObj.layers, [
{
@@ -80,9 +93,8 @@ describe.skip("history", function() {
}
]);
browser
.keys(['Control', 'y'])
.keys(['Control']);
browser.keys(redoKeyCombo)
browser.keys(redoKeyComboReset);
styleObj = helper.getStyleStore(browser);
assert.deepEqual(styleObj.layers, [
{

2
test/functional/index.js
View File

@@ -37,6 +37,8 @@ describe('maputnik', function() {
require("./map");
require("./modals");
require("./screenshots");
require("./accessibility");
require("./keyboard");
// ------------------------
});

58
test/functional/keyboard/index.js Normal file
View File

@@ -0,0 +1,58 @@
var assert = require("assert");
var config = require("../../config/specs");
var helper = require("../helper");
var wd = require("../../wd-helper");
describe("keyboard", function() {
describe("shortcuts", function() {
it("ESC should unfocus", function() {
const tmpTargetEl = $(wd.$("nav:inspect") + " select");
tmpTargetEl.click();
assert(tmpTargetEl.isFocused());
browser.keys(["Escape"]);
assert($("body").isFocused());
});
it("'?' should show shortcuts modal", function() {
browser.keys(["?"]);
assert($(wd.$("modal:shortcuts")).isDisplayed());
});
it("'o' should show open modal", function() {
browser.keys(["o"]);
assert($(wd.$("modal:open")).isDisplayed());
});
it("'e' should show export modal", function() {
browser.keys(["e"]);
assert($(wd.$("modal:export")).isDisplayed());
});
it("'d' should show sources modal", function() {
browser.keys(["d"]);
assert($(wd.$("modal:sources")).isDisplayed());
});
it("'s' should show settings modal", function() {
browser.keys(["s"]);
assert($(wd.$("modal:settings")).isDisplayed());
});
it.skip("'i' should change map to inspect mode", function() {
// browser.keys(["i"]);
});
it("'m' should focus map", function() {
browser.keys(["m"]);
$(".mapboxgl-canvas").isFocused();
});
it("'!' should show debug modal", function() {
browser.keys(["!"]);
assert($(wd.$("modal:debug")).isDisplayed());
});
});
});

64
test/functional/layers/index.js
View File

@@ -115,12 +115,6 @@ describe("layers", function() {
})
})
describe("grouped", function() {
it("with underscore")
it("no without underscore")
it("double underscore only grouped once")
})
describe("tooltips", function() {
})
@@ -130,20 +124,18 @@ describe("layers", function() {
describe('background', function () {
it.skip("add", function() {
it("add", function() {
var id = helper.modal.addLayer.fill({
type: "background"
})
browser.waitUntil(function() {
var styleObj = helper.getStyleStore(browser);
assert.deepEqual(styleObj.layers, [
{
"id": id,
"type": 'background'
}
]);
});
var styleObj = helper.getStyleStore(browser);
assert.deepEqual(styleObj.layers, [
{
"id": id,
"type": 'background'
}
]);
});
describe("modify", function() {
@@ -192,9 +184,6 @@ describe("layers", function() {
]);
});
// NOTE: This needs to be removed from the code
it("type");
it("min-zoom", function() {
var bgId = createBackground();
@@ -340,7 +329,7 @@ describe("layers", function() {
});
describe('fill', function () {
it.skip("add", function() {
it("add", function() {
// browser.debug();
var id = helper.modal.addLayer.fill({
@@ -363,7 +352,7 @@ describe("layers", function() {
});
describe('line', function () {
it.skip("add", function() {
it("add", function() {
var id = helper.modal.addLayer.fill({
type: "line",
layer: "example"
@@ -386,7 +375,7 @@ describe("layers", function() {
});
describe('symbol', function () {
it.skip("add", function() {
it("add", function() {
var id = helper.modal.addLayer.fill({
type: "symbol",
layer: "example"
@@ -404,7 +393,7 @@ describe("layers", function() {
});
describe('raster', function () {
it.skip("add", function() {
it("add", function() {
var id = helper.modal.addLayer.fill({
type: "raster",
layer: "raster"
@@ -422,7 +411,7 @@ describe("layers", function() {
});
describe('circle', function () {
it.skip("add", function() {
it("add", function() {
var id = helper.modal.addLayer.fill({
type: "circle",
layer: "example"
@@ -441,7 +430,7 @@ describe("layers", function() {
});
describe('fill extrusion', function () {
it.skip("add", function() {
it("add", function() {
var id = helper.modal.addLayer.fill({
type: "fill-extrusion",
layer: "example"
@@ -459,12 +448,12 @@ describe("layers", function() {
});
describe.skip("groups", function() {
describe("groups", function() {
it("simple", function() {
browser.url(config.baseUrl+"?debug&style="+getStyleUrl([
browser.url(config.baseUrl+"?debug&style="+helper.getStyleUrl([
"geojson:example"
]));
browser.alertAccept();
browser.acceptAlert();
helper.modal.addLayer.open();
var aId = helper.modal.addLayer.fill({
@@ -480,21 +469,22 @@ describe("layers", function() {
helper.modal.addLayer.open();
var bId = helper.modal.addLayer.fill({
id: "foo_baz",
id: "foo_bar_baz",
type: "background"
})
browser.waitForExist(wd.$("layer-list-group:foo-0"));
const groupEl = $(wd.$("layer-list-group:foo-0"));
groupEl.isDisplayed();
assert.equal(browser.isVisibleWithinViewport(wd.$("layer-list-item:foo")), false);
assert.equal(browser.isVisibleWithinViewport(wd.$("layer-list-item:foo_bar")), false);
assert.equal(browser.isVisibleWithinViewport(wd.$("layer-list-item:foo_baz")), false);
assert.equal($(wd.$("layer-list-item:foo")).isDisplayedInViewport(), true);
assert.equal($(wd.$("layer-list-item:foo_bar")).isDisplayedInViewport(), false);
assert.equal($(wd.$("layer-list-item:foo_bar_baz")).isDisplayedInViewport(), false);
browser.click(wd.$("layer-list-group:foo-0"));
groupEl.click();
assert.equal(browser.isVisibleWithinViewport(wd.$("layer-list-item:foo")), true);
assert.equal(browser.isVisibleWithinViewport(wd.$("layer-list-item:foo_bar")), true);
assert.equal(browser.isVisibleWithinViewport(wd.$("layer-list-item:foo_baz")), true);
assert.equal($(wd.$("layer-list-item:foo")).isDisplayedInViewport(), true);
assert.equal($(wd.$("layer-list-item:foo_bar")).isDisplayedInViewport(), true);
assert.equal($(wd.$("layer-list-item:foo_bar_baz")).isDisplayedInViewport(), true);
})
})
});

60
test/functional/modals/index.js
View File

@@ -41,7 +41,7 @@ describe("modals", function() {
});
it("close", function() {
closeModal("open-modal");
closeModal("modal:open");
});
// "chooseFile" command currently not available for wdio v5 https://github.com/webdriverio/webdriverio/pull/3632
@@ -57,9 +57,9 @@ describe("modals", function() {
it("load from url", function() {
var styleFileUrl = helper.getGeoServerUrl("example-style.json");
browser.setValueSafe(wd.$("open-modal.url.input"), styleFileUrl);
browser.setValueSafe(wd.$("modal:open.url.input"), styleFileUrl);
const selector = $(wd.$("open-modal.url.button"));
const selector = $(wd.$("modal:open.url.button"));
selector.click();
// Allow the network request to happen
@@ -74,6 +74,24 @@ describe("modals", function() {
it("gallery")
})
describe("shortcuts", function() {
it("open/close", function() {
browser.url(config.baseUrl+"?debug");
const elem = $(".maputnik-toolbar-link");
elem.waitForExist();
browser.flushReactUpdates();
browser.keys(["?"]);
const modalEl = $(wd.$("modal:shortcuts"))
assert(modalEl.isDisplayed());
closeModal("modal:shortcuts");
});
});
describe("export", function() {
beforeEach(function() {
@@ -89,14 +107,12 @@ describe("modals", function() {
});
it("close", function() {
closeModal("export-modal");
closeModal("modal:export");
});
// TODO: Work out how to download a file and check the contents
it("download")
// TODO: Work out how to mock the end git points
it("save to gist")
})
describe("sources", function() {
@@ -131,8 +147,8 @@ describe("modals", function() {
});
it("name", function() {
browser.setValueSafe(wd.$("modal-settings.name"), "foobar")
const elem = $(wd.$("modal-settings.owner"));
browser.setValueSafe(wd.$("modal:settings.name"), "foobar")
const elem = $(wd.$("modal:settings.owner"));
elem.click();
browser.flushReactUpdates();
@@ -140,8 +156,8 @@ describe("modals", function() {
assert.equal(styleObj.name, "foobar");
})
it("owner", function() {
browser.setValueSafe(wd.$("modal-settings.owner"), "foobar")
const elem = $(wd.$("modal-settings.name"));
browser.setValueSafe(wd.$("modal:settings.owner"), "foobar")
const elem = $(wd.$("modal:settings.name"));
elem.click();
browser.flushReactUpdates();
@@ -149,8 +165,8 @@ describe("modals", function() {
assert.equal(styleObj.owner, "foobar");
})
it("sprite url", function() {
browser.setValueSafe(wd.$("modal-settings.sprite"), "http://example.com")
const elem = $(wd.$("modal-settings.name"));
browser.setValueSafe(wd.$("modal:settings.sprite"), "http://example.com")
const elem = $(wd.$("modal:settings.name"));
elem.click();
browser.flushReactUpdates();
@@ -159,8 +175,8 @@ describe("modals", function() {
})
it("glyphs url", function() {
var glyphsUrl = "http://example.com/{fontstack}/{range}.pbf"
browser.setValueSafe(wd.$("modal-settings.glyphs"), glyphsUrl)
const elem = $(wd.$("modal-settings.name"));
browser.setValueSafe(wd.$("modal:settings.glyphs"), glyphsUrl)
const elem = $(wd.$("modal:settings.name"));
elem.click();
browser.flushReactUpdates();
@@ -170,8 +186,8 @@ describe("modals", function() {
it("mapbox access token", function() {
var apiKey = "testing123";
browser.setValueSafe(wd.$("modal-settings.maputnik:mapbox_access_token"), apiKey);
const elem = $(wd.$("modal-settings.name"));
browser.setValueSafe(wd.$("modal:settings.maputnik:mapbox_access_token"), apiKey);
const elem = $(wd.$("modal:settings.name"));
elem.click();
browser.flushReactUpdates();
@@ -183,8 +199,8 @@ describe("modals", function() {
it("maptiler access token", function() {
var apiKey = "testing123";
browser.setValueSafe(wd.$("modal-settings.maputnik:openmaptiles_access_token"), apiKey);
const elem = $(wd.$("modal-settings.name"));
browser.setValueSafe(wd.$("modal:settings.maputnik:openmaptiles_access_token"), apiKey);
const elem = $(wd.$("modal:settings.name"));
elem.click();
browser.flushReactUpdates();
@@ -194,8 +210,8 @@ describe("modals", function() {
it("thunderforest access token", function() {
var apiKey = "testing123";
browser.setValueSafe(wd.$("modal-settings.maputnik:thunderforest_access_token"), apiKey);
const elem = $(wd.$("modal-settings.name"));
browser.setValueSafe(wd.$("modal:settings.maputnik:thunderforest_access_token"), apiKey);
const elem = $(wd.$("modal:settings.name"));
elem.click();
browser.flushReactUpdates();
@@ -204,9 +220,9 @@ describe("modals", function() {
})
it("style renderer", function() {
const selector = $(wd.$("modal-settings.maputnik:renderer"));
const selector = $(wd.$("modal:settings.maputnik:renderer"));
selector.selectByAttribute('value', "ol");
const elem = $(wd.$("modal-settings.name"));
const elem = $(wd.$("modal:settings.name"));
elem.click();
browser.flushReactUpdates();