Add readyCallback

Closes #69 Allows to pass a callback that is called once the data has been retrieved. This callback is only called once.
vuejs · Feb 26, 2017 · 102e0b1 · 102e0b1
1 parent 23c8edf
commit 102e0b1
Show file tree

Hide file tree

Showing 2 changed files with 96 additions and 4 deletions.
diff --git a/src/vuefire.js b/src/vuefire.js
@@ -80,10 +80,12 @@ function indexForKey (array, key) {
 function bind (vm, key, source) {
   var asObject = false
   var cancelCallback = null
+  var readyCallback = null
   // check { source, asArray, cancelCallback } syntax
   if (isObject(source) && source.hasOwnProperty('source')) {
     asObject = source.asObject
     cancelCallback = source.cancelCallback
+    readyCallback = source.readyCallback
     source = source.source
   }
   if (!isObject(source)) {
@@ -98,6 +100,9 @@ function bind (vm, key, source) {
   } else {
     bindAsArray(vm, key, source, cancelCallback)
   }
+  if (readyCallback) {
+    source.once('value', readyCallback.bind(vm))
+  }
 }
 
 /**
@@ -250,20 +255,22 @@ function install (_Vue) {
   mergeStrats.firebase = mergeStrats.methods
 
   // extend instance methods
-  Vue.prototype.$bindAsObject = function (key, source, cancelCallback) {
+  Vue.prototype.$bindAsObject = function (key, source, cancelCallback, readyCallback) {
     ensureRefs(this)
     bind(this, key, {
       source: source,
       asObject: true,
-      cancelCallback: cancelCallback
+      cancelCallback: cancelCallback,
+      readyCallback: readyCallback
     })
   }
 
-  Vue.prototype.$bindAsArray = function (key, source, cancelCallback) {
+  Vue.prototype.$bindAsArray = function (key, source, cancelCallback, readyCallback) {
     ensureRefs(this)
     bind(this, key, {
       source: source,
-      cancelCallback: cancelCallback
+      cancelCallback: cancelCallback,
+      readyCallback: readyCallback
     })
   }
 

diff --git a/tests/vuefire.spec.js b/tests/vuefire.spec.js
@@ -39,6 +39,91 @@ describe('VueFire', function () {
     })
   })
 
+  describe('on ready callback', function () {
+    it('arrays', function (done) {
+      firebaseRef.set({
+        first: { index: 0 },
+        second: { index: 1 },
+        third: { index: 2 }
+      }, function () {
+        new Vue({
+          firebase: {
+            items: {
+              source: firebaseRef,
+              readyCallback: function () {
+                expect(this.items).to.deep.equal([
+                  { '.key': 'first', index: 0 },
+                  { '.key': 'second', index: 1 },
+                  { '.key': 'third', index: 2 }
+                ])
+                done()
+              }
+            }
+          }
+        }).$mount()
+      })
+    })
+
+    it('objects', function (done) {
+      firebaseRef.child('first').set({
+        index: 0
+      }, function () {
+        new Vue({
+          firebase: {
+            item: {
+              source: firebaseRef.child('first'),
+              asObject: true,
+              readyCallback: function () {
+                expect(this.item).to.deep.equal(
+                  { '.key': 'first', index: 0 }
+                )
+                done()
+              }
+            }
+          }
+        }).$mount()
+      })
+    })
+
+    it('$bindAsArray', function (done) {
+      firebaseRef.set({
+        first: { index: 0 },
+        second: { index: 1 },
+        third: { index: 2 }
+      }, function () {
+        new Vue({
+          created: function () {
+            this.$bindAsArray('items', firebaseRef, null, function () {
+              expect(this.items).to.deep.equal([
+                { '.key': 'first', index: 0 },
+                { '.key': 'second', index: 1 },
+                { '.key': 'third', index: 2 }
+              ])
+              done()
+            })
+          }
+        }).$mount()
+      })
+    })
+
+    it('$bindAsObject', function (done) {
+      firebaseRef.child('first').set({
+        index: 0
+      }, function () {
+        new Vue({
+          created: function () {
+            this.$bindAsObject('item', firebaseRef.child('first'), null, function () {
+              expect(this.item).to.deep.equal(
+                { '.key': 'first', index: 0 }
+              )
+              done()
+            })
+          }
+        }).$mount()
+      })
+    })
+  })
+
   describe('bind as Array', function () {
     it('throws error for invalid firebase ref', function () {
       helpers.invalidFirebaseRefs.forEach(function (ref) {