Testing Strangeness using Ember Qunit and Test Helpers

[jnhuynh]

I have a test that passes and then upon refresh fails with a unhelpful error. If I run the test by itself, it always passes.

I am not sure if this issue falls under Ember-qunit, Ember-cli, EmberJs. This is a boiler plate Ember-cli project, I am running Ember-cli version 0.0.28.

Am I missing something or is this a bug?

This is the error:

I know that the code works through manual testing. My Tournament model hasMany('competitor'). I have the appropriate Competitor model.

Also, the screen shot below will show that all of my selectors are correct.

This is the integration test:

import { test } from 'ember-qunit';
import startApp from 'scratch-masters/tests/helpers/start-app';

var App;

module('Integration - Competitors Management', {
  setup: function() {
    App = startApp();
  },

  teardown: function() {
    Ember.run(App, App.destroy);
  }
});

var competitorNameInputSelector    = 'input#new-competitor-name',
    addCompetitorButtonSelector    = 'button#add-competitor',
    removeCompetitorButtonSelector = 'button.remove-competitor',
    competitorListSelector         = 'table#competitors-list',
    competitorListItemSelector     = 'table#competitors-list tbody tr';

test('it should have UI for adding and displaying competitors', function() {
  expect(4);

  visit('/tournaments/new');

  andThen(function() {
    shouldHaveElementWithCount(competitorNameInputSelector, 1, null);
    shouldHaveElementWithCount(addCompetitorButtonSelector, 1, null);
    shouldHaveElementWithCount(competitorListSelector, 1, null);
    shouldHaveElementWithCount(competitorListItemSelector, 0, null);
  });
});

test('it should allow competitor adding', function() {
  expect(2);

  visit('/tournaments/new');
  fillIn(competitorNameInputSelector, 'Bob Saget');
  click(addCompetitorButtonSelector);

  andThen(function() {
    shouldHaveElementWithCount(competitorListItemSelector, 1, null);
  });

  fillIn(competitorNameInputSelector, 'Keanu Reeves');
  click(addCompetitorButtonSelector);

  andThen(function() {
    shouldHaveElementWithCount(competitorListItemSelector, 2, null);
  });
});

The main pieces of code that get exercised are the actions in this controller:

var TournamentsNewController = Ember.ObjectController.extend({
  newCompetitorName: '',

  actions: {
    addCompetitor: function() {
      var newCompetitorName = this.get('newCompetitorName'),
          newCompetitor;

      if (newCompetitorName) {
        newCompetitor = this.store.createRecord('competitor', {
          name: newCompetitorName
        });

        this.get('competitors').pushObject(newCompetitor);
        this.set('newCompetitorName', '');
      }
    },

    removeCompetitor: function(competitor) {
      if (competitor) {
        this.get('competitors').removeObject(competitor);
      }
    }
  }
});

export default TournamentsNewController;

[stefanpenner]

@jnhuynh i believe this is a bug in ember-data + the container, but I believe @mixonic submitted a fix which is on ember-data master. Can you confirm this problem stills exists then?

[jnhuynh]

@stefanpenner Sure thing, I'll try to retest against ember-data master and will update this issue accordingly.

[stefanpenner]

@jnhuynh thanks!

[jnhuynh]

So, I updated my bower.json to include "ember-data": "1.0.0-beta.8", ran bower install and things are working.

I am assuming 1.0.0-beta.8 is master since that's the newest I can find on bower.

Either way, my tests are now passing consistently so some something must have changed during the minor version changed. It's probably the fix from @mixonic.

I'm going to close this ticket. @stefanpenner thanks for the help. I also noticed that the latest Ember-cli already has the updated Ember-data version. I really need to update Ember-cli more frequently 😅.