Async call in ember testing

Question

In my ember application i use bootbox (http://bootboxjs.com/) for confirming to delete some models. In my qunit test i click on the button with an {{ action }}, in this action i open a bootbox. In the text i click the OK button on the bootbox.

But the andThen method does not wait for the bootbox to disappear. The check if a model is removed is therefore always false. I tried to return an promise but the andThen helper also doesn't wait for promises.

Is there a way to let the test wait until the promise of the bootbox is resolved, or the callback of the bootbox is finished?

Extra information: My template is:

    <button class="btn btn-default" {{action 'askDelete' target="view"}} data-toggle="tooltip" data-placement="right" {{translateAttr title="trips.remove"}}><i class="fa fa-trash-o"></i></button>

My View is:

actions: {
    askDelete: function(){
        var self = this;
        self.$('td').slideUp('500').promise().then(function(){
            self.get('controller').send('delete');
        });
    }
}

My controller:

actions: {
    save: function(){
                self.get('content').save().then(function(){
                self.get('controllers.history').transitionToPrevious('trips.index');
            });

My test:

click(".specific-row .action-buttons button");

andThen(function() {
    // Check if the row is indeed removed from the table
    ok(find(".content-row table tr:contains('content-of-row')").length === 0, "deleted and removed from the table");
});

But the latest ok is called before the save action in the controller is triggered, and therefore always false.

I made a jsfiddle with a minimal situation at: http://jsfiddle.net/21af9puz/1/

I found an alternative way to show a modal:jsfiddle.net/21af9puz/14 — Lrdv

Kingpin2k Kingpin2k · Accepted Answer · 2014-08-26T19:37:20

You'll need to do some manual managing of the testing process since you have a process that works outside of the ember run loop. Something along these lines:

test('Test ', function(){
    console.log(find('#link'));
  visit('/');
  andThen(function() {
      equal(find('#block').length,1, 'There should be a block on the page');
      click("#link"); 

      stop();
      Em.run.later(function(){
        start();
        $('.btn.btn-primary').click();
        equal(find('#block').length,0, 'There should be no block on the page');
      }, 1000);


  });
});

http://jsfiddle.net/xke7851k/

Async call in ember testing

1 Answers