flagpole/dist/browserelement.js

Simple and fast DOM integration, headless or headful browser, and REST API testing framework.

"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.BrowserElement = void 0;
const puppeteerelement_1 = require("./puppeteerelement");
const util_1 = require("./util");
class BrowserElement extends puppeteerelement_1.PuppeteerElement {
    constructor(input, context, name, path) {
        super(input, context, name, path);
        this._input = input;
        this._path = path || "";
    }
    get $() {
        return this._input;
    }
    static create(input, context, name, path) {
        return new Promise((resolve) => {
            const element = new BrowserElement(input, context, name, path);
            if (name === null) {
                element._name = String(path);
            }
            Promise.all([element._getTagName(), element._getSourceCode()]).then(() => {
                resolve(element);
            });
        });
    }
    find(selector) {
        return __awaiter(this, void 0, void 0, function* () {
            const element = yield this.$.$(selector);
            const name = `${selector} under ${this.name}`;
            const path = `${this.path} ${selector}`;
            if (element !== null) {
                return BrowserElement.create(element, this._context, name, path);
            }
            return this._wrapAsValue(null, name);
        });
    }
    findAll(selector) {
        return __awaiter(this, void 0, void 0, function* () {
            const elements = yield this.$.$$(selector);
            const out = [];
            yield util_1.asyncForEach(elements, (element, i) => __awaiter(this, void 0, void 0, function* () {
                out.push(yield BrowserElement.create(element, this._context, `${selector}[${i}] under ${this.name}`, `${this.path} ${selector}[${i}]`));
            }));
            return out;
        });
    }
    getClosest(selector = "*") {
        return __awaiter(this, void 0, void 0, function* () {
            const closest = yield this.$.$x(`ancestor-or-self::${selector}`);
            const name = `Closest ${selector} of ${this.name}`;
            const path = `${this.path}[ancestor-or-self::${selector}]`;
            if (closest.length > 0) {
                return BrowserElement.create(closest[0], this._context, name, path);
            }
            return this._wrapAsValue(null, name, this);
        });
    }
    getChildren(selector = "*") {
        return __awaiter(this, void 0, void 0, function* () {
            const children = yield this.$.$x(`child::${selector}`);
            const out = [];
            yield util_1.asyncForEach(children, (child, i) => __awaiter(this, void 0, void 0, function* () {
                const name = `Child ${selector} ${i} of ${this.name}`;
                const path = `${this.path}[child::${selector}][${i}]`;
                out.push(yield BrowserElement.create(child, this._context, name, path));
            }));
            return out;
        });
    }
    getParent() {
        return __awaiter(this, void 0, void 0, function* () {
            const parents = yield this.$.$x("..");
            const name = `Parent of ${this.name}`;
            const path = `${this.path}[..]`;
            if (parents.length > 0) {
                return BrowserElement.create(parents[0], this._context, name, path);
            }
            return this._wrapAsValue(null, name, this);
        });
    }
    getSiblings(selector = "*") {
        return __awaiter(this, void 0, void 0, function* () {
            const prevSiblings = yield this.$.$x(`preceding-sibling::${selector}`);
            const nextSiblings = yield this.$.$x(`following-sibling::${selector}`);
            const siblings = [];
            yield util_1.asyncForEach(prevSiblings.concat(nextSiblings), (sibling, i) => __awaiter(this, void 0, void 0, function* () {
                const name = `Sibling ${i} of ${this.name}`;
                const path = `${this.path}[sibling::${selector}][${i}]`;
                siblings.push(yield BrowserElement.create(sibling, this._context, name, path));
            }));
            return siblings;
        });
    }
    getPreviousSibling(selector = "*") {
        return __awaiter(this, void 0, void 0, function* () {
            const siblings = yield this.$.$x(`preceding-sibling::${selector}`);
            const name = `Previous Sibling of ${this.name}`;
            const path = `${this.path}[preceding-sibling::${selector}][0]`;
            if (siblings.length > 0) {
                return BrowserElement.create(siblings[0], this._context, name, path);
            }
            return this._wrapAsValue(null, name, this);
        });
    }
    getPreviousSiblings(selector = "*") {
        return __awaiter(this, void 0, void 0, function* () {
            const siblingElements = yield this.$.$x(`preceding-sibling::${selector}`);
            const siblings = [];
            yield util_1.asyncForEach(siblingElements, (sibling, i) => __awaiter(this, void 0, void 0, function* () {
                const name = `Previous Sibling ${i} of ${this.name}`;
                const path = `${this.path}[preceding-sibling::${selector}][${i}]`;
                siblings.push(yield BrowserElement.create(sibling, this._context, name, path));
            }));
            return siblings;
        });
    }
    getNextSibling(selector = "*") {
        return __awaiter(this, void 0, void 0, function* () {
            const siblings = yield this.$.$x(`following-sibling::${selector}`);
            const name = `Next Sibling of ${this.name}`;
            const path = `${this.path}[following-sibling::${selector}][0]`;
            if (siblings.length > 0) {
                return BrowserElement.create(siblings[0], this._context, name, path);
            }
            return this._wrapAsValue(null, name, this);
        });
    }
    getNextSiblings(selector = "*") {
        return __awaiter(this, void 0, void 0, function* () {
            const siblingElements = yield this.$.$x(`following-sibling::${selector}`);
            const siblings = [];
            yield util_1.asyncForEach(siblingElements, (sibling, i) => __awaiter(this, void 0, void 0, function* () {
                const name = `Next Sibling ${i} of ${this.name}`;
                const path = `${this.path}[following-sibling::${selector}][${i}]`;
                siblings.push(yield BrowserElement.create(sibling, this._context, name, path));
            }));
            return siblings;
        });
    }
    getBounds(boxType = "border") {
        return __awaiter(this, void 0, void 0, function* () {
            if (this._context.page == null) {
                throw new Error("Page is null.");
            }
            const allowedTypes = ["content", "padding", "border", "margin"];
            if (allowedTypes.indexOf(boxType) < 0) {
                throw new Error(`${boxType} is not a valid box type. Must be one of the following: ${allowedTypes.join(", ")}.`);
            }
            const boxModel = yield this._input.boxModel();
            if (boxModel !== null) {
                return {
                    x: boxModel[boxType][0].x,
                    y: boxModel[boxType][0].y,
                    width: boxModel.width,
                    height: boxModel.height,
                    points: boxModel[boxType],
                };
            }
            return null;
        });
    }
    focus() {
        return __awaiter(this, void 0, void 0, function* () {
            if (this._context.page == null) {
                throw new Error("Page is null.");
            }
            yield this._input.focus();
            this._completedAction("FOCUS");
        });
    }
    blur() {
        return __awaiter(this, void 0, void 0, function* () {
            if (this._context.page == null) {
                throw new Error("Page is null.");
            }
            yield this._input.evaluate((node) => { var _a; return (_a = node.parentElement) === null || _a === void 0 ? void 0 : _a.focus(); });
            this._completedAction("BLUR");
        });
    }
    hover() {
        return __awaiter(this, void 0, void 0, function* () {
            yield this._input.hover();
            this._completedAction("HOVER");
        });
    }
    tap() {
        return __awaiter(this, void 0, void 0, function* () {
            if (this._context.page == null) {
                throw new Error("Page is null.");
            }
            yield this._input.tap();
            this._completedAction("TAP");
        });
    }
    press(key, opts) {
        return __awaiter(this, void 0, void 0, function* () {
            if (this._context.page == null) {
                throw new Error("Page is null.");
            }
            yield this._input.press(key, opts || {});
            this._completedAction("PRESS", key);
        });
    }
    type(textToType, opts = {}) {
        return __awaiter(this, void 0, void 0, function* () {
            if (this._context.page == null) {
                throw new Error("Page is null.");
            }
            yield this._input.type(textToType, opts);
            this._completedAction("TYPE", (yield this.isPasswordField())
                ? textToType.replace(/./g, "*")
                : textToType);
        });
    }
    clear() {
        return __awaiter(this, void 0, void 0, function* () {
            if (this._context.page == null) {
                throw new Error("Page is null.");
            }
            yield this._input.click({ clickCount: 3 });
            yield this._context.page.keyboard.press("Backspace");
            this._completedAction("CLEAR");
        });
    }
    fillForm(a, b) {
        return __awaiter(this, void 0, void 0, function* () {
            const isForm = yield this._isFormTag();
            if (this._context.page == null) {
                throw new Error("Page is null.");
            }
            if (!isForm) {
                throw new Error("This is not a form element.");
            }
            const page = this._context.page;
            if (page === null) {
                throw new Error("Page is null");
            }
            const attributeName = typeof a === "string" ? a : "name";
            const formData = (typeof a === "string" ? b : a) || {};
            for (let name in formData) {
                const value = formData[name];
                const selector = `${this._path} [${attributeName}="${name}"]`;
                const inputs = yield page.$$(selector);
                if (inputs.length > 0) {
                    const input = inputs[0];
                    const tagName = String(yield (yield input.getProperty("tagName")).jsonValue()).toLowerCase();
                    const inputType = String(yield (yield input.getProperty("type")).jsonValue()).toLowerCase();
                    yield page.focus(selector);
                    if (tagName == "select") {
                        yield page.select(selector, value);
                    }
                    else if (tagName == "input") {
                        if (inputType == "radio" || inputType == "checkbox") {
                            const multiValues = util_1.toType(value) == "array" ? value : [value];
                            for (let i = 0; i < inputs.length; i++) {
                                let checkbox = inputs[i];
                                let isChecked = !!(yield (yield checkbox.getProperty("checked")).jsonValue());
                                let checkboxValue = String(yield (yield checkbox.getProperty("value")).jsonValue());
                                if ((multiValues.indexOf(checkboxValue) >= 0 && !isChecked) ||
                                    (multiValues.indexOf(checkboxValue) < 0 && isChecked)) {
                                    yield checkbox.click();
                                }
                            }
                        }
                        else if (inputType == "button" ||
                            inputType == "submit" ||
                            inputType == "reset") {
                        }
                        else {
                            yield this._context.clearThenType(selector, value);
                        }
                    }
                    else if (tagName == "button") {
                    }
                }
                this._completedAction("FILL");
            }
            return this;
        });
    }
    submit(a, b) {
        return __awaiter(this, void 0, void 0, function* () {
            if (!this._isFormTag()) {
                throw new Error("You can only use .submit() with a form element.");
            }
            if (this._context.page === null) {
                throw new Error("Page was null");
            }
            yield this._context.page.evaluate((form) => form.submit(), this.$);
            this._completedAction("SUBMIT");
        });
    }
    click(a, b) {
        return __awaiter(this, void 0, void 0, function* () {
            this._completedAction("CLICK");
            if (a || b) {
                const overloaded = util_1.getMessageAndCallbackFromOverloading(a, b, this._path);
                return this._loadSubScenario(overloaded);
            }
            else {
                yield this._input.click();
            }
        });
    }
    screenshot(a, b) {
        const localFilePath = typeof a == "string" ? a : undefined;
        const opts = (typeof a !== "string" ? a : b) || {};
        return this._input.screenshot({
            path: localFilePath || opts.path,
            encoding: "binary",
            omitBackground: opts.omitBackground || false,
        });
    }
    selectOption(valuesToSelect) {
        return __awaiter(this, void 0, void 0, function* () {
            valuesToSelect = util_1.arrayify(valuesToSelect);
            this._completedAction("SELECT", valuesToSelect.join(", "));
            const valuesSelected = yield this.$.select.apply(this.$, valuesToSelect);
            this._context
                .assert(`Select values on ${this.name}`, valuesToSelect.length == valuesSelected.length)
                .equals(true);
        });
    }
    pressEnter() {
        return __awaiter(this, void 0, void 0, function* () {
            yield this.$.press("Enter");
            this._completedAction("ENTER");
        });
    }
    scrollTo() {
        return __awaiter(this, void 0, void 0, function* () {
            yield this.$.evaluate((e) => e.scrollIntoView());
        });
    }
    _getInnerText() {
        return __awaiter(this, void 0, void 0, function* () {
            return String(yield this._eval((e) => e.innerText, this.$));
        });
    }
    _getInnerHtml() {
        return __awaiter(this, void 0, void 0, function* () {
            return String(yield this._eval((e) => e.innerHTML, this.$));
        });
    }
    _getOuterHtml() {
        return __awaiter(this, void 0, void 0, function* () {
            return String(yield this._eval((e) => e.outerHTML, this.$));
        });
    }
    _getData(key) {
        return __awaiter(this, void 0, void 0, function* () {
            return (yield this._input.getProperty(key)).jsonValue();
        });
    }
    _getValue() {
        return __awaiter(this, void 0, void 0, function* () {
            return (yield this._input.getProperty("value")).jsonValue();
        });
    }
    _getText() {
        return __awaiter(this, void 0, void 0, function* () {
            return String((yield this._input.getProperty("textContent")).jsonValue());
        });
    }
    _getClassName() {
        return __awaiter(this, void 0, void 0, function* () {
            return String((yield this._input.getProperty("className")).jsonValue());
        });
    }
    _getTagName() {
        return __awaiter(this, void 0, void 0, function* () {
            const handle = yield this._input.getProperty("tagName");
            const value = String(yield handle.jsonValue());
            this._tagName = value.toLowerCase();
            return value;
        });
    }
    _getAttribute(key) {
        return __awaiter(this, void 0, void 0, function* () {
            const handle = yield this._input.getProperty(key);
            return String(yield handle.jsonValue());
        });
    }
    isPasswordField() {
        return __awaiter(this, void 0, void 0, function* () {
            return (yield this.getAttribute("type")).$ == "password";
        });
    }
}
exports.BrowserElement = BrowserElement;
//# sourceMappingURL=browserelement.js.map