salix/e2e/helpers/extensions.js

import config from './config.js';
import Nightmare from 'nightmare';
import selectors from './selectors.js';
const components = selectors.components;

function child(selector, childNumber) {
    let aux = selector.split(' ');
    return selector.replace(aux[0], `${aux[0]}:nth-child(${childNumber})`);
}

Nightmare.action('login', function(name, password, done) {
    try {
        this.goto(`${config.url}auth/?apiKey=salix`)
        .wait(`${components.textFieldInput}`)
        .write(`${child(components.textFieldInput, 1)}`, name)
        .write(`${child(components.textFieldInput, 2)}`, password)
        .click(components.submitButton)
        .then(done);
    } catch (err) {
        console.log(err);
    }
});

Nightmare.action('getInnerText', function(selector, done) {
    this.wait(selector)
    .evaluate_now(function(elementToSelect) {
        return document.querySelector(elementToSelect).innerText;
    }, done, selector);
});

Nightmare.action('clearInput', function(selector, done) {
    let backSpaces = [];
    for (let i = 0; i < 50; i += 1) {
        backSpaces.push('\u0008');
    }
    this.wait(selector)
    .type(selector, backSpaces.join(''))
    .then(done);
});

Nightmare.action('write', function(selector, text, done) {
    this.wait(selector)
    .insert(selector, text)
    .then(done);
});

Nightmare.action('waitToClick', function(selector, done) {
    this.wait(selector)
    .click(selector)
    .then(done);
});

Nightmare.action('isVisible', function(selector, done) {
    this.wait(selector)
    .evaluate_now(elementSelector => {
        const selectorMatches = document.querySelectorAll(elementSelector);
        const element = selectorMatches[0];
        if (selectorMatches.length > 1) {
            throw new Error(`multiple matches of ${elementSelector} found`);
        }
        let isVisible = false;
        if (element) {
            const eventHandler = event => {
                event.preventDefault();
                isVisible = true;
            };
            element.addEventListener('mouseover', eventHandler);
            const elementBoundaries = element.getBoundingClientRect();
            const x = elementBoundaries.left + element.offsetWidth / 2;
            const y = elementBoundaries.top + element.offsetHeight / 2;
            const elementInCenter = document.elementFromPoint(x, y);
            const elementInTopLeft = document.elementFromPoint(elementBoundaries.left, elementBoundaries.top);
            const elementInBottomRight = document.elementFromPoint(elementBoundaries.right, elementBoundaries.bottom);
            const e = new MouseEvent('mouseover', {
                view: window,
                bubbles: true,
                cancelable: true
            });
            if (elementInCenter) {
                elementInCenter.dispatchEvent(e);
            }
            if (elementInTopLeft) {
                elementInTopLeft.dispatchEvent(e);
            }
            if (elementInBottomRight) {
                elementInBottomRight.dispatchEvent(e);
            }
            element.removeEventListener('mouseover', eventHandler);
        }
        return isVisible;
    }, done, selector);
});

Nightmare.action('selectText', function(selector, done) {
    this.wait(selector)
    .evaluate(elementToSelect => {
        const range = document.createRange();
        range.selectNodeContents(document.querySelector(elementToSelect));
        const sel = window.getSelection();
        sel.removeAllRanges();
        sel.addRange(range);
    }, selector)
    .mouseup(selector)
    .then(done);
});