I am having a problem that I have been looking for solutions for a while. I have a page (Express app) which has a div#content. Initially, it has nothing in it. On page load, a JavaScript function is called to determine if the user has already logged in. If not, it populates a login form inside div#content. Otherwise, the user profile will be shown in the same div.
This app is a one page app. All the actions are handled by Ajax. Most of the content is generated dynamically as well.
Now, I am trying to write some acceptance tests for this app with Mocha and Zombie.js. However, even a simple test like this one won't pass:
assert.equal(this.browser.text('div#content h1'), 'Login');
.. because div#content is empty.
I am just wondering if there is way to get the page with all dynamically populated content. I tried browser.html(), set debug to true, set runScripts to true, use browser.wait() for div#content, and many other ways but just can't get it to work.
Any help will be highly appreciated. Thank you!