Integration testing with cascading async requests

Testing
1

I’ve just started a new project with ember-cli, qunit and pretender.

There’s this one page which performs an initial ajax request, then based on the response it renders a few columns which will be filled with data from a second set of ajax requests.

So I have this initial spinner (loading substate) for the first request and then later multiple spinners, one for each column. After each request of the second set resolve, I’ll hide the corresponding spinners for each one and show the final content for each column.

I’d like to test the fact that there will be this initial spinner, it will disappear, then it will show columns with their own set of spinners, and finally they will all disappear when the final content in ready to be displayed.

I’ve been able to test the appearance of the first global spinner, since it’s part of the loading substate before any async task has completed. But I have problems tracking the subsequent columns spinners.

I’ve tried to use the andThen helper, but it looks like it’s invoked right after all async behavior has resolved, which is when the columns are already filled in with data.

I’ve been trying to play with Ember.run loops in the app code and the tests without much success, but it could be possible that I just don’t have a good grasp of it.

Anyone has any idea on how I should approach this situation? Thanks!

2

You need a way to pause your test when a spinner is loaded for each column. How you do that depends on how your columns trigger loading spinner to be displayed. You might want to look at creating a custom async test helper that would wait for a spinner to be displayed and give you an opportunity to perform tests before moving on.

3

I have to agree with @tarasm on this one. We acceptance test foundation modal a fair bit in some of our apps and because it’s using the 3rd party js lib w/ animations we needed to write/use a waitFor helper.