1
votes

What is the best way to set up the DS.store for testing Ember-data models?

UPDATE: Here is a fiddle: http://jsfiddle.net/jdcravens/B7Jy6/

I'm using the yeoman ember-generator, and I want to provide a guide for a simple getting started setup for QUnit and Mocha tests.

I've bootstrapped a project using:

$ yo ember --karma

What I am unable to do so far is access the ember-data store from my tests?

First, I've tried to do a setup similar to ember-data test suite abstracting store setup to the initializer.

document.write('<div id="ember-testing-container"><div id="ember-testing"></div></div>');
document.write('<style>#ember-testing-container { position: absolute; background: white; bottom: 0; right: 0; width: 800px; height: 500px; overflow: auto; z-index: 9999; border: 5px solid #ccc; } #ember-testing { zoom: 80%; }</style>');

Ember.testing = true;
App.rootElement = "#ember-testing";

App.setupForTesting();
App.injectTestHelpers();

//Ember.run(App, App.advanceReadiness);

// Error: Assertion Failed: You cannot defer readiness since the `ready()` hook 
// has already been called.

window.setupStore = function(options) {
    var env = {};
    options = options || {};

    var container = env.container = new Ember.Container();

    var adapter = env.adapter = (options.adapter || DS.Adapter);
    delete options.adapter;

    for (var prop in options) {
      container.register('model:' + prop, options[prop]);
    }

    container.register('store:main', DS.Store.extend({
      adapter: adapter
    }));

    container.register('serializer:-default', DS.JSONSerializer);
    container.register('serializer:-rest', DS.RESTSerializer);
    container.register('adapter:-rest', DS.RESTAdapter);

    container.injection('serializer', 'store', 'store:main');

    env.serializer = container.lookup('serializer:-default');
    env.restSerializer = container.lookup('serializer:-rest');
    env.store = container.lookup('store:main');
    env.adapter = env.store.get('defaultAdapter');

    return env;
};

window.createStore = function(options) {
    return setupStore(options).store;
};

window.start = function () {};
window.stop = function () {};

Then from my tests:

/*global describe, it */
'use strict';
(function () {

//var store = App.__container__.lookup('store:main');
//console.log(store);

// LOG: undefined
// PhantomJS 1.9.6 (Mac OS X): Executed 0 of 0 ERROR (0.684 secs / 0 secs)

//So then, I try to generate use createStore() from the initializer.

  var store;

  module("unit/model - DS.Activity", {
    setup: function() {
      store = createStore();
    },

    teardown: function() {
      store = null;
    }
  });

  test('display_id property returns correct value', function() {
    Ember.run(function () {
      var activity = store.push('App.Activity', {'id': 1, 'display_id': 'activity1'});
      var result = activity.get('display_id');
      equal(result, 'activity1', "display_id was " + result);
    });  
  });

// PhantomJS 1.9.6 (Mac OS X) unit/model - DS.Activity display_id property returns
// display_id FAILED
// Died on test #1 at ../node_modules/qunitjs/qunit/qunit.js:42
// at ../test/spec/test.js:58
// at ../test/spec/test.js:60: No model was found for 'App.Activity'
// Error: No model was found for 'App.Activity'
// PhantomJS 1.9.6 (Mac OS X): Executed 1 of 1 (1 FAILED) ERROR (0.743 secs / 0.003 secs)

})();

So the question is .. what is the best way to access the store and test Ember-data models using Karma Qunit basic setup?

1

1 Answers

0
votes

Ive updated the fiddle with a few corrections: http://jsfiddle.net/jdcravens/B7Jy6/

  module("unit/model - App.Activity", {
    setup: function() {
      store = createStore({activity: App.Activity}); // Pass the model
    },

    teardown: function() {
      store = null;
    }
  });

then in the tests, notice 'activity', rather than 'App.Activity':

  test('display_id property returns correct value', function() {
    Ember.run(function () {
      var activity = store.push('activity', {'id': 1, 'display_id': 'activity1'});
      var result = activity.get('display_id');
      equal(result, 'activity1', "display_id was " + result);
    });  
  }); 

I also decided to move the creation of the activity record to the setup:

  module("unit/model - App.Activity", {
    setup: function() {
      store = createStore({activity: App.Activity}); // Pass the model

      Ember.run(function () {
        activity = store.push('activity', {
          'id': 1,
          'display_id': 'activity1'
        });
      },

    teardown: function() {
      store = null;
    }
  });

then, in the tests:

  test('display_id property returns correct value', function() {
      var result = activity.get('display_id');
      equal(result, 'activity1', "display_id was " + result);
    });  
  });