Unit test.

Author: Godofbrowser

test/unit/assertions/nodeAssertion.js

@@ -2,69 +2,45 @@
  * Created by Emmy on 10/8/2017.
  */
 
-import * as HOOKS from '../../utilities/hooks'
-import {getElem} from '../../utilities/helpers'
-import { assert, expect } from 'chai'
 import Vue from 'vue'
 import Promise from 'promise-polyfill'
+import {assert, expect} from 'chai'
+import * as HOOKS from '../../utilities/hooks'
+import {nodeLength} from '../../utilities/helpers'
 
 Vue.config.productionTip = false
 
 describe('Calling "alert()"', function () {
-    // this.timeout(3000);
-    beforeEach(HOOKS.sanitizeAndPrepareWindow)
+    let dg
+
+    before(HOOKS.sanitizeAndPrepareWindow)
+    before(function (done) {
+        dg = window.vm.triggerAlert()
+        Vue.nextTick(done) // be sure done has updated before proceeding
+    })
 
     it('Should return a promise', function () {
-        let dg = window.vm.triggerAlert()
         expect(dg).to.be.instanceOf(Promise)
     })
 
-    it('Should make the dialog visible', function (done) {
-        let elem = getElem('dg-container')
-        window.vm.triggerAlert().then(() => {}).catch(() => {})
-
-        Vue.nextTick(() => {
-            try{
-                assert.equal(getElem('dg-container').length, 1)
-                done()
-            }catch(err){
-                done(new Error(err.toString()))
-            }
-        })
+    it('Should make the dialog visible', function () {
+        assert.strictEqual(nodeLength('.dg-container'), 1)
     })
-})
-
-describe('with #alert(), Clicking "ok"', function () {
-    // this.timeout(3000);
-    beforeEach(HOOKS.sanitizeAndPrepareWindow)
 
-    it('Should resolve the promise', function (done) {
-        window.vm.triggerAlert()
-            .then(() => {done()}) // expected
-            .catch(err => { done(err.toString())})
+    it('Should make the ok button visible', function () {
+        assert.strictEqual(nodeLength('.dg-btn--ok'), 1)
+    })
 
-        Vue.nextTick(() => {
-            window.vm.clickDialogBtn('ok')
-        })
+    it('Should make the cancel button visible', function () {
+        assert.strictEqual(nodeLength('.dg-btn--cancel'), 0)
     })
 })
 
-describe('with #alert(), user ', function () {
-    // this.timeout(3000);
+describe('Calling "alert()", then Click "ok"', function () {
     before(HOOKS.sanitizeAndPrepareWindow)
-    before(function(){
-        window.vm.triggerAlert()
-    })
 
-    it('Should see ok button', function () {
-        Vue.nextTick(() => {
-            assert.equal(getElem('dg-btn--ok').length, 1)
-        })
-    })
-
-    it('Should not see cancel button', function () {
-        Vue.nextTick(() => {
-            assert.equal(getElem('dg-btn--cancel').length, 0)
-        })
+    it('Should resolve the promise', function (done) {
+        window.vm.triggerAlert().then(() => {done()}) // expected
+        Vue.nextTick(() => window.vm.clickDialogBtn('ok'))
     })
-})
+})

test/unit/specs/plugin/behaviour-for-alert.spec.js

@@ -3,54 +3,55 @@
  */
 
 import * as HOOKS from '../../utilities/hooks'
-import {getElem} from '../../utilities/helpers'
+import {getElem, nodeLength} from '../../utilities/helpers'
 import { assert, expect } from 'chai'
 import Vue from 'vue'
 import Promise from 'promise-polyfill'
 
 Vue.config.productionTip = false
 
 describe('Calling "confirm()"', function () {
-    // this.timeout(3000);
-    beforeEach(HOOKS.sanitizeAndPrepareWindow)
+    let dg
+
+    before(HOOKS.sanitizeAndPrepareWindow)
+    before(function (done) {
+        dg = window.vm.triggerConfirm()
+        Vue.nextTick(done) // be sure done has updated before proceeding
+    })
 
     it('Should return a promise', function () {
-        let dg = window.vm.triggerConfirm()
         expect(dg).to.be.instanceOf(Promise)
     })
 
-    it('Should make the dialog visible', function (done) {
-        window.vm.triggerConfirm()
-        let nodes = getElem('dg-container')
-
-        Vue.nextTick(() => {
-            try{
-                assert.equal(nodes.length, 1)
-                done()
-            }catch(err){
-                done(new Error(err.toString()))
-            }
-        })
+    it('Should make the dialog visible', function () {
+        assert.strictEqual(nodeLength('.dg-container'), 1)
     })
-})
 
+    it('Should make the ok button visible', function () {
+        assert.strictEqual(nodeLength('.dg-btn--ok'), 1)
+    })
 
-describe('with #confirm(), user ', function () {
-    this.timeout(100);
-    before(HOOKS.sanitizeAndPrepareWindow)
-    before(function () {
-        window.vm.triggerConfirm()
+    it('Should make the cancel button visible', function () {
+        assert.strictEqual(nodeLength('.dg-btn--cancel'), 1)
     })
+})
+
+describe('Clicking \'ok\' on #confirm()', function () {
+    beforeEach(HOOKS.sanitizeAndPrepareWindow)
 
-    it('Should see ok button', function () {
-        Vue.nextTick(() => {
-            assert.equal(getElem('dg-btn--ok').length, 1)
-        })
+    it('Should resolve the promise', function (done) {
+        window.vm.triggerConfirm().then(() => {done()}) // expected
+        Vue.nextTick(() => window.vm.clickDialogBtn('ok'))
     })
+})
+
+describe('Clicking \'cancel\' on #confirm()', function () {
+    beforeEach(HOOKS.sanitizeAndPrepareWindow)
 
-    it('Should see cancel button', function () {
-        Vue.nextTick(() => {
-            assert.equal(getElem('dg-btn--cancel').length, 1)
-        })
+    it('Should reject the promise', function (done) {
+        window.vm.triggerConfirm()
+            .then(() => {done(new Error('Cancel button should Reject promise'))})
+            .catch(() => {done()}) // expected
+        Vue.nextTick(() => window.vm.clickDialogBtn('cancel'))
     })
 })

test/unit/specs/plugin/behaviour-for-confirm.spec.js

@@ -2,7 +2,9 @@
  * Created by Emmy on 10/11/2017.
  */
 
-export function getElem(selector) {
-    return document.getElementsByClassName(selector)
-    // return document.querySelector(selector)
-}
+export function getElem(selector, all = false) {
+    return all ? document.querySelectorAll(selector) : document.querySelector(selector)
+}
+export function nodeLength(selector) {
+    return getElem(selector, true).length
+}

test/unit/utilities/helpers.js

@@ -7,8 +7,6 @@ import {setupVmWithLocalVue} from './initializers'
 import Promise from 'promise-polyfill'
 
 export function sanitizeAndPrepareWindow(done) {
-    this.timeout(500)
-
     Promise.resolve()
         .then((function (){
             return new Promise(function (resolve) {
@@ -29,14 +27,15 @@ export function sanitizeAndPrepareWindow(done) {
                     elem.remove()
                     delete window.vm
                 }
-                Vue.nextTick(resolve)
+                resolve()
             })
         })).then(() => {
             // set them up again
             window.vm = setupVmWithLocalVue()
-            done()
+            // Proceed
+            Vue.nextTick(done)
         }).catch((err) => {
-            done(new Error('prepareWindow: '+ err.toString()))
+            done(new Error(err.toString()))
         })
 
 }

test/unit/utilities/hooks.js

@@ -29,8 +29,9 @@ export function setupVmWithLocalVue() {
     })).$mount(node)
 }
 
-function clickDialogBtn(type = 'ok', idx = null) {
-    let node, nodes = (type === 'ok') ? getElem('dg-btn--ok') : getElem('dg-btn--cancel')
+function clickDialogBtn(dgBtn = 'ok', idx = null) {
+    let selector = (dgBtn === 'ok') ? '.dg-btn--ok' : '.dg-btn--cancel'
+    let node, nodes =  getElem(selector, true)
 
     if (nodes.length > 0) {
         if (idx === null) {
@@ -41,9 +42,9 @@ function clickDialogBtn(type = 'ok', idx = null) {
             for (let i = 0; i < nodes.length; i++) {
                 clickNode(nodes[i])
             }
-        } else {
+        } else if (node = nodes[parseInt(idx)]) {
             // click at index
-            (node = nodes[parseInt(idx)]) && clickNode(node)
+            clickNode(node)
         }
     }
-}
+}