Update phrases test

mariomka · Dec 22, 2017 · c056826 · c056826
1 parent db2b5ea
commit c056826
Show file tree

Hide file tree

Showing 4 changed files with 59 additions and 72 deletions.
diff --git a/test/helpers/index.js b/test/helpers/index.js
@@ -1,49 +1,6 @@
-import camelcase from 'camelcase'
 import { createVM, Vue } from './utils'
 import { nextTick } from './wait-for-update'
 
-export function dataPropagationTest (Component) {
-  return function () {
-    const spy = sinon.spy()
-    const vm = createVM(this, function (h) {
-      return (
-          <Component staticClass='custom' onClick={spy}>Hello</Component>
-      )
-    })
-    spy.should.have.not.been.called
-    vm.$('.custom').should.exist
-    vm.$('.custom').click()
-    spy.should.have.been.calledOnce
-  }
-}
-
-export function attrTest (it, base, Component, attr) {
-  const attrs = Array.isArray(attr) ? attr : [attr]
-
-  attrs.forEach(attr => {
-    it(attr, function (done) {
-      const vm = createVM(this, function (h) {
-        const opts = {
-          props: {
-            [camelcase(attr)]: this.active
-          }
-        }
-        return (
-          <Component {...opts}>{attr}</Component>
-        )
-      }, {
-        data: { active: true }
-      })
-      vm.$(`.${base}`).should.have.class(`${base}--${attr}`)
-      vm.active = false
-      nextTick().then(() => {
-        vm.$(`.${base}`).should.not.have.class(`${base}--${attr}`)
-        vm.active = true
-      }).then(done)
-    })
-  })
-}
-
 export {
   createVM,
   Vue,

diff --git a/test/helpers/utils.js b/test/helpers/utils.js
@@ -25,8 +25,8 @@ Vue.prototype.$$ = function $$ (selector) {
   const els = document.querySelectorAll(selector)
   const vmEls = this.$el.querySelectorAll(selector)
   const fn = vmEls.length
-          ? el => Array.from(vmEls).find(vmEl => el === vmEl)
-          : el => this.$el === el
+    ? el => Array.from(vmEls).find(vmEl => el === vmEl)
+    : el => this.$el === el
   const found = Array.from(els).filter(fn)
   return found.length
     ? found
@@ -37,18 +37,23 @@ Vue.prototype.$ = function $ (selector) {
   const els = document.querySelectorAll(selector)
   const vmEl = this.$el.querySelector(selector)
   const fn = vmEl
-          ? el => el === vmEl
-          : el => el === this.$el
+    ? el => el === vmEl
+    : el => el === this.$el
   // Allow should chaining for tests
   return Array.from(els).find(fn) || emptyNodes
 }
 
+Vue.prototype.$findChild = function $ (selector) {
+  return this.$children.find(child => child.$el.matches(selector)) ||
+         this.$children.reduce((found, child) => found || child.$findChild(selector), null)
+}
+
 export function createKarmaTest (context, template, opts) {
   const el = document.createElement('div')
   document.getElementById('tests').appendChild(el)
   const render = typeof template === 'string'
-          ? { template: `<div>${template}</div>` }
-          : { render: template }
+    ? { template: `<div>${template}</div>` }
+    : { render: template }
   return new Vue({
     el,
     name: 'Test',

diff --git a/test/specs/Datetime.spec.js b/test/specs/Datetime.spec.js
@@ -24,29 +24,6 @@ describe('Datetime.vue', function () {
       expect(vm.$('.vdatetime-input')).to.match('input')
     })
 
-    it('input should render custom phrases', function () {
-      const vm = createVM(this,
-        `<Datetime :phrases="phrases"></Datetime>`,
-        {
-          components: { Datetime },
-          data () {
-            return {
-              phrases: {
-                cancel: 'Cancelar',
-                ok: 'Confirmar'
-              }
-            }
-          }
-        })
-
-      vm.$('.vdatetime-input').click()
-
-      vm.$nextTick(() => {
-        expect(vm.$('.vdatetime-popup__actions__button--confirm').innerText).to.be.equal('Confirmar')
-        expect(vm.$('.vdatetime-popup__actions__button--cancel').innerText).to.be.equal('Cancelar')
-      })
-    })
-
     it('input should inherit attributes', function () {
       const vm = createVM(this,
         `<Datetime placeholder="Select date..."></Datetime>`,
@@ -75,6 +52,34 @@ describe('Datetime.vue', function () {
     })
   })
 
+  describe('pass props', function () {
+    it('should pass phrases to popup', function (done) {
+      const vm = createVM(this,
+        `<Datetime :phrases="phrases"></Datetime>`,
+        {
+          components: { Datetime },
+          data () {
+            return {
+              phrases: {
+                cancel: 'Cancelar',
+                ok: 'Confirmar'
+              }
+            }
+          }
+        })
+
+      vm.$('.vdatetime-input').click()
+
+      vm.$nextTick(() => {
+        expect(vm.$findChild('.vdatetime-popup').phrases).to.be.eql({
+          cancel: 'Cancelar',
+          ok: 'Confirmar'
+        })
+        done()
+      })
+    })
+  })
+
   describe('types', function () {
     it('should be date type by default', function () {
       const vm = createVM(this,

diff --git a/test/specs/DatetimePopup.spec.js b/test/specs/DatetimePopup.spec.js
@@ -120,6 +120,26 @@ describe('DatetimePopup.vue', function () {
         done()
       })
     })
+
+    it('should render custom phrases', function () {
+      const vm = createVM(this,
+        `<DatetimePopup :datetime="datetime" :phrases="phrases"></DatetimePopup>`,
+        {
+          components: { DatetimePopup },
+          data () {
+            return {
+              datetime: LuxonDatetime.local(),
+              phrases: {
+                cancel: 'Cancelar',
+                ok: 'Confirmar'
+              }
+            }
+          }
+        })
+
+      expect(vm.$('.vdatetime-popup__actions__button--confirm').innerText).to.be.equal('Confirmar')
+      expect(vm.$('.vdatetime-popup__actions__button--cancel').innerText).to.be.equal('Cancelar')
+    })
   })
 
   describe('events', function () {