lundi 3 août 2015

Debugging Ember CLI Mirage in an acceptance test

I'm trying to setup a mock server in for my Ember CLI (1.13.1) acceptance test with Ember CLI Mirage. I'm stuck on how to debug the setup and actually test the model data available in the view.

I tried adding a console log statement inside my mirage route:

this.get('/users', function(db){
  console.log(db.users);
  return db.users;
});

Which tells me that the mirage route is called and there should be three users present. But my test is still failing. How do I check what is in the store in my acceptance test or in my template?

tests/acceptance/users/index-test.js

/* jshint expr:true */
import {
  describe,
  it,
  beforeEach,
  afterEach
} from 'mocha';
import { expect } from 'chai';
import Ember from 'ember';
import startApp from 'tagged/tests/helpers/start-app';

describe('Acceptance: UsersIndex', function() {
  var application;
  var users;

  beforeEach(function() {
    application = startApp();
    users = server.createList('user', 3);
  });

  afterEach(function() {
    Ember.run(application, 'destroy');
  });

  it('can visit /users/index', function() {
    visit('/users');
    andThen(function() {
      expect(currentPath()).to.equal('users.index');
    });
  });

  it('lists the users', function(){
    visit('/users');
    andThen(function() {
      users = server.createList('user', 3);
      expect(find('.user').length).to.equal(3); // fails
    });
  });
});

AssertionError: expected 0 to equal 3

app/mirage/config.js

export default function() {
  /*
    Config (with defaults).

    Note: these only affect routes defined *after* them!
  */
  this.namespace = '/api/v1';    // make this `api`, for example, if your API is namespaced
  // this.timing = 400;      // delay for each request, automatically set to 0 during testing

  this.get('/users');
}


// You can optionally export a config that is only loaded during tests
export function testConfig() {
  this.timing = 1;
}

app/mirage/factories/user.js

import Mirage, {faker} from 'ember-cli-mirage';
export default Mirage.Factory.extend({
  email: function(){ return faker.internet.email(); }
});

app/routes/users/index.js

import Ember from 'ember';

export default Ember.Route.extend({
  model: function(){
    return this.store.findAll('user');
  }
});

app/templates/users/index.hbs

<h2>Users</h2>

<table>
  <thead>
    <tr>
      <th>Actions</th>
      <th>Email</th>
    </tr>
  </thead>
  <tbody>

  {{#each model as |user|}}
    <tr class="user">
      <td class="actions"><a href="#">Show</a></td>
      <td class="email">{{ user.email }}</td>
    </tr>
  {{/each}}
  </tbody>
</table>




Aucun commentaire:

Enregistrer un commentaire