Ember Mocha tests fail when async (using ember-moc

Question

I can't get mocha working with Ember due to the fact that it fails when a test of the following nature is executed:

describe('Location Panel', function () {
  beforeEach(function () {
    App.reset();
    visit('/map/41.76721,-72.66907');
  });

  it('Have proper address', function () {
    var $title = find('.panel-header h2');
    expect($title).to.have.text('476 Columbus Blvd, Hartford');
  });
});

Basically it can't find any of the DOM elements, because it runs the test before the route has finished loading.. The same happens if I visit from within the test, and use andThen, etc..

Here's a jsbin for debugging.

Edit

In the jsbin, I'm using a mocked ajax call, but in my tests the ajax calls are real. I am using Ember.$.ajax wrapped in the following:

function ajax (url, options) {
  return new Ember.RSVP.Promise(function (resolve, reject) {
    options = options || {};
    options.url = url;

    options.success = function (data) {
      Ember.run(null, resolve, data);
    };

    options.error = function (jqxhr, status, something) {
      Ember.run(null, reject, arguments);
    };

    Ember.$.ajax(options);
  });
}

Should I be using Ember.run.later as well?

Answer 1

You should use Ember.run.later instead of setTimeout so that the wait helper knows that it should wait.

Alternatively you can use Ember.test.registerWaiter though I don't think you need it here.

Updated JSBIN: http://emberjs.jsbin.com/gahe/1/edit