client path e2e tests refactor

client/core/src/autocomplete/autocomplete.spec.js

@@ -2,31 +2,23 @@ import './autocomplete.js';
 
 describe('Core', () => {
     describe('Component mdlUpdate', () => {
-    });
+        let $componentController;
+        let $state;
+
+        beforeEach(() => {
+            angular.mock.module('client');
         });
 
+        beforeEach(angular.mock.inject((_$componentController_, _$state_) => {
+            $componentController = _$componentController_;
+            $state = _$state_;
+            $state.params.id = '1234';
+        }));
 
-// import './address-create.js';
+        it('should define and set address property', () => {
-
+            let controller = $componentController('vnAddressCreate', {$state: $state});
-// describe('Client', () => {
+            expect(controller.address.clientFk).toBe(1234);
-//     describe('Component vnAddressCreate', () => {
+            expect(controller.address.enabled).toBe(true);
-//         let $componentController;
+        });
-//         let $state;
+    });
-
+});
-//         beforeEach(() => {
-//             angular.mock.module('client');
-//         });
-
-//         beforeEach(angular.mock.inject((_$componentController_, _$state_) => {
-//             $componentController = _$componentController_;
-//             $state = _$state_;
-//             $state.params.id = '1234';
-//         }));
-
-//         it('should define and set address property', () => {
-//             let controller = $componentController('vnAddressCreate', {$state: $state});
-//             expect(controller.address.clientFk).toBe(1234);
-//             expect(controller.address.enabled).toBe(true);
-//         });
-//     });
-// });

e2e/helpers.js

@@ -1,17 +0,0 @@
-import Nightmare from 'nightmare';
-
-Nightmare.action('login', function(name, password, done) {
-    this.goto('http://localhost:5000/auth/?apiKey=salix')
-    .wait('body > vn-login > div > div > div > form > vn-textfield:nth-child(1) > div > input')
-    .type('body > vn-login > div > div > div > form > vn-textfield:nth-child(1) > div > input', name)
-    .type('body > vn-login > div > div > div > form > vn-textfield:nth-child(2) > div > input', password)
-    .click('input[type="submit"]')
-    .then(done);
-});
-
-Nightmare.action('getInnerText', function(selector, done) {
-    this.wait(selector)
-    .evaluate_now(function(elementToSelect) {
-        return document.querySelector(elementToSelect).innerText;
-    }, done, selector);
-});

e2e/helpers/config.js

@@ -0,0 +1,3 @@
+export default {
+    url: 'http://localhost:5000/'
+};

e2e/helpers/extensions.js

@@ -0,0 +1,105 @@
+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);
+});

e2e/helpers/nightmare.js

@@ -1,6 +1,5 @@
 /* eslint no-console: 0 */
 import Nightmare from 'nightmare';
-import './helpers';
 
 export default function createNightmare(width = 1100, height = 600) {
     const nightmare = new Nightmare({show: true, typeInterval: 10}).viewport(width, height);
@@ -17,6 +16,5 @@ export default function createNightmare(width = 1100, height = 600) {
             console.log(message);
         }
     });
-
     return nightmare;
 }

e2e/helpers/selectors.js

@@ -0,0 +1,10 @@
+// eslint max-len: ["error", 500]
+// eslint key-spacing: ["error", 500]
+export default {
+    components: {
+        textFieldInput: 'vn-textfield > div > input',
+        topBar: 'vn-topbar',
+        submitButton: 'vn-submit > input[type="submit"]'
+    }
+};
+

e2e/paths/clients_path.spec.js

@@ -1,15 +1,18 @@
-import createNightmare from '../nightmare';
+import config from '../helpers/config.js';
+import createNightmare from '../helpers/nightmare';
+import selectors from '../helpers/selectors.js';
+let components = selectors.components;
+
 const nightmare = createNightmare();
 
 describe('Clients path', () => {
-    it('should log in', done => {
+    fit('should log in', done => {
-        // nightmare user to go any further.
         nightmare
-        .login('Nightmare', 'NightmarePassword')
+        .login('nightmare', 'NightmarePassword')
-        .wait('body > vn-app > vn-vertical > vn-topbar')
+        .wait(1000)
         .url()
         .then(url => {
-            expect(url).toBe('http://localhost:5000/#!/');
+            expect(url).toBe(config.url + '#!/');
             done();
         });
     });
@@ -17,21 +20,21 @@ describe('Clients path', () => {
     it('should access to the clients index by clicking the clients button', done => {
         nightmare
         .click('body > vn-app > vn-vertical > vn-vertical > vn-home > vn-vertical > vn-module-container > a:nth-child(1)')
-        .wait('body > vn-app > vn-vertical > vn-vertical > vn-client-index > div > a > vn-float-button > button')
+        .wait(1000)
         .url()
         .then(url => {
-            expect(url).toBe('http://localhost:5000/#!/clients');
+            expect(url).toBe(config.url + '#!/clients');
             done();
         });
     });
 
     it('should access to the create client by clicking the create-client button', done => {
         nightmare
-        .click('body > vn-app > vn-vertical > vn-vertical > vn-client-index > div > a > vn-float-button > button')
+        .click('body > vn-app > vn-vertical > vn-vertical > vn-client-index > div > a')
-        .wait('body > vn-app > vn-vertical > vn-vertical > vn-client-create > form > div > vn-card > div > vn-vertical > vn-title > h3')
+        .wait(1000)
         .url()
         .then(url => {
-            expect(url).toBe('http://localhost:5000/#!/create');
+            expect(url).toBe(config.url + '#!/create');
             done();
         });
     });

e2e_tests.js

@@ -18,12 +18,11 @@ var SpecReporter = require('jasmine-spec-reporter').SpecReporter;
 
 jasmine.loadConfig({
     spec_files: [
-        './helpers.js',
+        './e2e/helpers/extensions.js',
-        './**/*[sS]pec.js'
+        './e2e/**/*[sS]pec.js'
     ],
     helpers: [
-        // to implement
+        // '/services/utils/jasmineHelpers.js'
-        // '/api/utils/jasmineHelpers.js'
     ]
 });