flagpole
Version:
Simple and fast DOM integration, headless or headful browser, and REST API testing framework.
390 lines • 15.9 kB
JavaScript
"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ExtJsComponent = exports.ExtJsComponentTypes = void 0;
const puppeteer_element_1 = require("./puppeteer-element");
const util_1 = require("../util");
const ext = require("./extjs-helper");
const helpers_1 = require("../helpers");
const browser_element_1 = require("./browser-element");
const value_promise_1 = require("../value-promise");
const visible = (c) => c.isVisible(true);
const hidden = (c) => c.isHidden(true);
exports.ExtJsComponentTypes = {
actionsheet: "Ext.ActionSheet",
audio: "Ext.Audio",
button: "Ext.Button",
image: "Ext.Img",
label: "Ext.Label",
loadmask: "Ext.LoadMask",
panel: "Ext.Panel",
segmentedbutton: "Ext.SegmentedButton",
sheet: "Ext.Sheet",
spacer: "Ext.Spacer",
titlebar: "Ext.TitleBar",
toolbar: "Ext.Toolbar",
video: "Ext.Video",
carousel: "Ext.carousel.Carousel",
navigationview: "Ext.navigation.View",
datepicker: "Ext.picker.Date",
picker: "Ext.picker.Picker",
slider: "Ext.slider.Slider",
thumb: "Ext.slider.Thumb",
tabpanel: "Ext.tab.Panel",
viewport: "Ext.viewport.Default",
dataview: "Ext.dataview.DataView",
list: "Ext.dataview.List",
nestedlist: "Ext.dataview.NestedList",
checkboxfield: "Ext.field.Checkbox",
datepickerfield: "Ext.field.DatePicker",
emailfield: "Ext.field.Email",
hiddenfield: "Ext.field.Hidden",
numberfield: "Ext.field.Number",
passwordfield: "Ext.field.Password",
radiofield: "Ext.field.Radio",
searchfield: "Ext.field.Search",
selectfield: "Ext.field.Select",
sliderfield: "Ext.field.Slider",
spinnerfield: "Ext.field.Spinner",
textfield: "Ext.field.Text",
textareafield: "Ext.field.TextArea",
togglefield: "Ext.field.Toggle",
treelist: "Ext.list.Tree",
urlfield: "Ext.field.Url",
fieldset: "Ext.form.FieldSet",
formpanel: "Ext.form.Panel",
};
class ExtJsComponent extends puppeteer_element_1.PuppeteerElement {
constructor(handle, context, name, path) {
super(handle, context, name, path || name);
this._path = path || name;
this._input = handle;
}
get $() {
return this._input;
}
get path() {
return this._path;
}
get name() {
return this._name || this._path || "ExtJs Component";
}
get _response() {
return this._context.response;
}
get _isExtComponent() {
return this.toType() == "ext";
}
static create(handle, context, name, path) {
return __awaiter(this, void 0, void 0, function* () {
const element = new ExtJsComponent(handle, context, name, path);
const componentType = yield element._getTagName();
if (!element._name && componentType !== null) {
element._name = `<${componentType}> Component @ ${element.path}`;
}
return element;
});
}
focus() {
return this._action("focus");
}
hover() {
return this._action("hover");
}
blur() {
return this._action("blur");
}
click() {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
const out = this._action("click");
return new Promise((resolve) => {
setTimeout(() => resolve(out), 100);
});
}));
}
getAncestor(selector) {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
const result = yield ext.up(this.$, selector);
return ext.jsHandleToComponent(result, this.context, `${selector} above ${this.name}`, `${this.path}.up(${selector})`);
}));
}
getFirstChild(selector) {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
const result = yield ext.child(this.$, selector);
return ext.jsHandleToComponent(result, this.context, `Child ${selector} ${this.name}`, `${this.path}.child(${selector})`);
}));
}
getLastChild(selector) {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
const result = yield this.getChildren(selector);
return result[result.length - 1];
}));
}
getAncestors(selector) {
return __awaiter(this, void 0, void 0, function* () {
const result = yield ext.ancestors(this.$, selector);
return ext.jsHandleArrayToComponents(result, this.context, `${selector} above ${this.name}`, `${this.path}.ancestors(${selector})`);
});
}
find(selector) {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
const name = `${selector} under ${this.name}`;
const path = `${this.path} ${selector}`;
const result = yield ext.down(this.$, selector);
if (result !== null) {
return ext.jsHandleToComponent(result, this.context, name, path);
}
const el = yield ext.queryDomElementWithinComponent(this.$, selector);
if (el !== null) {
return browser_element_1.BrowserElement.create(el, this.context, name, path);
}
return helpers_1.wrapAsValue(this.context, null, name, path);
}));
}
findAll(selector) {
return __awaiter(this, void 0, void 0, function* () {
const result = yield ext.queryWithinComponent(this.$, selector);
return ext.jsHandleArrayToComponents(result, this.context, selector, selector);
});
}
clear() {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
yield this.focus();
yield this.setValue("");
yield this.blur();
this._completedAction("CLEAR");
return this;
}));
}
type(textToType, opts) {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
yield this.focus();
yield this.setValue(textToType);
this._completedAction("TYPE", (yield this._isPasswordField())
? textToType.replace(/./g, "*")
: textToType);
return this.blur();
}));
}
pressEnter() {
return this._action("action");
}
waitForVisible(timeout) {
return this._waitForIt(visible, "visible", timeout);
}
waitForHidden(timeout) {
return this._waitForIt(hidden, "hidden", timeout);
}
isVisible() {
return __awaiter(this, void 0, void 0, function* () {
return yield this.$.evaluate(visible);
});
}
isHidden() {
return __awaiter(this, void 0, void 0, function* () {
return yield this.$.evaluate(hidden);
});
}
setValue(text) {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
yield this.eval((c, text) => {
if (c.setValue) {
c.setValue(text);
}
if (c.setCriteriaValue) {
c.setCriteriaValue(text);
}
}, text);
return this;
}));
}
getParent() {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
const result = yield ext.parent(this.$);
return ext.jsHandleToComponent(result, this.context, `Parent of ${this.name}`, `${this.path}.getParent()`);
}));
}
getSiblings(selector = "*") {
return __awaiter(this, void 0, void 0, function* () {
const id = yield ext.id(this.$);
const parent = yield ext.parent(this.$);
if (parent === null) {
return [];
}
const parentId = yield ext.id(parent);
const children = yield ext.query(this._page, `#${parentId} > ${selector}`);
const filtered = yield ext.filter(children, (c, id) => c.getId() != id, id);
return util_1.asyncMap(filtered, (sibling, i) => __awaiter(this, void 0, void 0, function* () {
return yield ext.jsHandleToComponent(sibling, this.context, `Sibling of ${this.name}`, `${this.path} ~ ${selector} [${i}]`);
}));
});
}
getFirstSibling(selector = "*") {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
return (yield this.getSiblings(selector))[0];
}));
}
getLastSibling(selector = "*") {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
const siblings = yield this.getSiblings(selector);
return siblings[siblings.length - 1];
}));
}
getChildren(selector = "*") {
return __awaiter(this, void 0, void 0, function* () {
const id = yield ext.id(this.$);
return ext.jsHandleArrayToComponents(yield ext.query(this._page, `#${id} > ${selector}`), this.context, `Children ${selector} of ${this.name}`, this.path);
});
}
getNextSibling(selector) {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
const id = String(yield this.eval((c) => c.nextSibling(selector)));
const component = yield this._response.getComponentById(id);
return (component || this._wrapAsValue(null, `Next Sibling of ${this.name}`));
}));
}
getPreviousSibling(selector) {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
const id = String(yield this.eval((c) => c.previousSibling(selector)));
const component = yield this._response.getComponentById(id);
return (component || this._wrapAsValue(null, `Previous Sibling of ${this.name}`));
}));
}
eval(js, ...args) {
return __awaiter(this, void 0, void 0, function* () {
return this.$.evaluate.apply(this.$, [js, ...args]);
});
}
selectOption(valuesToSelect) {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
valuesToSelect = util_1.toArray(valuesToSelect);
this._completedAction("SELECT", valuesToSelect.join(", "));
const ableToSetValue = yield this.eval((c, valuesToSelect) => {
let value = "";
const displayField = c.getDisplayField();
const valueField = c.getValueField();
const searchValue = valuesToSelect[0];
const store = c.getStore();
const valueResult = store.queryBy(valueField, searchValue);
if (valueResult && valueResult.indices) {
value = Object.keys(valueResult.indices)[0];
}
if (!value.length) {
const displayResult = store.queryBy(displayField, searchValue);
if (displayResult && displayResult.indices) {
value = Object.keys(displayResult.indices)[0];
}
}
if (value.length) {
c.setValue(value);
return true;
}
return false;
}, valuesToSelect);
this.context
.assert(`Select values on ${this.name}`, ableToSetValue)
.equals(true);
return this;
}));
}
scrollTo() {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
yield this.eval((c) => c.element.dom.scrollIntoView());
return this;
}));
}
_action(eventName) {
return value_promise_1.ValuePromise.execute(() => __awaiter(this, void 0, void 0, function* () {
eventName = eventName.toLowerCase();
yield this.eval((c, eventName) => {
c[eventName] && c[eventName]();
c.element && c.element[eventName] && c.element[eventName]();
c.element.dom && c.element.dom[eventName] && c.element.dom[eventName]();
c.fireEvent(eventName);
}, eventName);
this._completedAction(eventName.toUpperCase());
return this;
}));
}
_getClassName() {
return __awaiter(this, void 0, void 0, function* () {
return String(yield this.eval((c) => c.element.dom.className));
});
}
_getAttribute(key) {
return this.eval((c) => c.element.getAttribute(key));
}
_getTagName() {
return __awaiter(this, void 0, void 0, function* () {
this._tagName = String(yield this.eval((c) => c.xtype));
return this._tagName;
});
}
_getInnerText() {
return __awaiter(this, void 0, void 0, function* () {
return String(yield this.eval((c) => c.element.dom.innerText));
});
}
_getInnerHtml() {
return __awaiter(this, void 0, void 0, function* () {
return String(yield this.eval((c) => c.element.dom.innerHTML));
});
}
_getOuterHtml() {
return __awaiter(this, void 0, void 0, function* () {
return String(yield this.eval((c) => c.element.dom.outerHTML));
});
}
_getText() {
return __awaiter(this, void 0, void 0, function* () {
const result = yield this.eval((c) => {
var _a, _b;
if (c.getText) {
return c.getText();
}
if (c.getLabel) {
return c.getLabel();
}
if (c.getTitle) {
return c.getTitle();
}
if (c.getDisplayValue) {
return c.getDisplayValue();
}
if ((_b = (_a = c.element) === null || _a === void 0 ? void 0 : _a.dom) === null || _b === void 0 ? void 0 : _b.innerText) {
return c.element.dom.innerText;
}
return "";
});
return String(result);
});
}
_getValue() {
return __awaiter(this, void 0, void 0, function* () {
return this.eval((c) => {
if (c.getValue) {
return c.getValue();
}
if (c.getCriteriaValue) {
return c.getCriteriaValue();
}
return null;
});
});
}
_isPasswordField() {
return __awaiter(this, void 0, void 0, function* () {
return this.eval((c) => c.inputElement.dom.getAttribute("type") == "password");
});
}
}
exports.ExtJsComponent = ExtJsComponent;
//# sourceMappingURL=extjs-component.js.map