#55 data option

changelog.md

@@ -1,5 +1,8 @@
 # Changelog
 
+## 0.6.0
+- Added a `data` option to specify initial data properties.
+
 ## 0.5.0
 - `vuenit.http` now uses the `mock-http-client` library.
 - `vuenit.store` now uses the `mock-vuex` library.

lib/component/component.js

@@ -42,6 +42,7 @@ exports.mergeComponent = function (component, options) {
     mergeDirectives(component, options);
     mergeProps(component, options);
     mergeMixins(component, options);
+    mergeData(component, options);
   }else{
     // Register all stubbed components globally
     Object.keys(options.components).forEach(function (key) {
@@ -143,6 +144,24 @@ function mergeMixins(component, options) {
   }
 }
 
+function mergeData(component, options) {
+  if (options.data){
+    var dataFn = component.data;
+    component.data = function () {
+      var data = {};
+      if (typeof dataFn === 'function'){
+        Object.assign(data, dataFn.call(this));
+      }
+      if (typeof options.data === 'function'){
+        Object.assign(data, options.data.call(this));
+      }else{
+        Object.assign(data, options.data);
+      }
+      return data;
+    };
+  }
+}
+
 // Creates a wrapper component that contains the vm component
 exports.createComponentWrapper = function (component, options) {
   var name = componentName(component, options);

lib/component/options.js

@@ -23,6 +23,7 @@ exports.mergeOptions = function (options, config, Vue, injector) {
     name : null,
     install : null,
     before : null,
+    data : null,
     defaultTemplate : '<div><slot></slot></div>'
   };
   var mergedOptions = Object.assign(defaultOptions, config, options);

spec/component/data.spec.js

@@ -0,0 +1,110 @@
+import test from 'ava-spec';
+import sinon from 'sinon';
+import vuenit from '../../lib';
+
+test.beforeEach(t => {
+  let spy1 = sinon.spy();
+  let spy2 = sinon.spy();
+  let c = {
+    name : 'test',
+    template : `<div>{{value}}</div>`,
+    data(){
+      return {
+        value : 'initial',
+        uuid : null,
+        dontUpdate : 'foo'
+      };
+    },
+    watch : {
+      uuid(newVal, oldVal){
+        if (oldVal){
+          spy1();
+        }
+        if (newVal){
+          spy2();
+        }
+      }
+    }
+  };
+
+  t.context = {spy1, spy2, c};
+});
+
+test('uses real data values', async t => {
+  let {c, spy1, spy2} = t.context;
+  let vm = vuenit.mount(c);
+
+  t.is(vm.value, 'initial');
+  t.is(vm.uuid, null);
+  t.is(vm.dontUpdate, 'foo');
+
+  t.false(spy1.called);
+  t.false(spy2.called);
+
+  vm.uuid = 1234;
+  await vm.$nextTick();
+
+  t.false(spy1.called);
+  t.true(spy2.called);
+
+  vm.uuid = 5678;
+  await vm.$nextTick();
+
+  t.true(spy1.called);
+});
+test('merges with a data object', t => {
+  let {c} = t.context;
+  let vm = vuenit.mount(c, {
+    data : {
+      value : 'overwritten',
+      uuid : 1234
+    }
+  });
+
+  t.is(vm.value, 'overwritten');
+  t.is(vm.uuid, 1234);
+  t.is(vm.dontUpdate, 'foo');
+});
+test('merges with a data function', t => {
+  let {c} = t.context;
+  let vm = vuenit.mount(c, {
+    data(){
+      return {
+        value : 'overwritten',
+        uuid : 1234
+      }
+    }
+  });
+
+  t.is(vm.value, 'overwritten');
+  t.is(vm.uuid, 1234);
+  t.is(vm.dontUpdate, 'foo');
+});
+test('has access to vm context', t => {
+  let {c} = t.context;
+  let vm2;
+  let vm = vuenit.mount(c, {
+    data(){
+      vm2 = this;
+    }
+  });
+
+  t.is(vm2, vm);
+});
+test('actives both spies as expected', async t => {
+  let {c, spy1, spy2} = t.context;
+  let vm = vuenit.mount(c, {
+    data : {
+      uuid : 1234
+    }
+  });
+
+  t.false(spy1.called);
+  t.false(spy2.called);
+
+  vm.uuid = 5678;
+  await vm.$nextTick();
+
+  t.true(spy1.called);
+  t.true(spy2.called);
+});