If you are familiar with ajax paths, here is a solution that can be implemented by attaching an 'ajaxComplete' event to the client and matching the executed request path:
client
.timeoutsAsyncScript(15000) // set async exec timeout
.click('.btn-submit') // initiate ajax form submit
.executeAsync(
function(targetUrl, done){
var nightwatchAjaxCallback = function(ajaxUrl) {
if(ajaxUrl.indexOf(targetUrl) === 0) { // notify script when URL matches
done(true);
}
};
if(!window.nightwatchAjaxInited) { // ensure ajaxComplete is attached only once
window.nightwatchAjaxInited = true;
$(document).ajaxComplete(function(e, res, req) {
nightwatchAjaxCallback(req.url);
});
}
},
['/ajaxpath'], // expected xhr request path
function(status){
// code to execute once ajax is completed
client.verify.containsText('.entry', 'lorem ipsup...') // verify post creation
}
);
A command called 'ajaxWait' has been created based on the above code:
exports.command = function(targetUrl, action, callback) {
this.timeoutsAsyncScript(15000);
action();
this.executeAsync(function(targetUrl, done){
var nightwatchAjaxCallback = function(ajaxUrl) {
if(ajaxUrl.indexOf(targetUrl) === 0) {
done(true);
}
};
if(!window.nightwatchAjaxInited) {
window.nightwatchAjaxInited = true;
$(document).ajaxComplete(function(e, res, req) {
nightwatchAjaxCallback(req.url);
});
}
}, [targetUrl], function(status){
callback();
});
};
And the usage of this command should resemble the following:
client.ajaxWait('/ajaxpath', function(){
// initiate ajax form submission
client.click('.btn-submit')
}, function(){
// code to execute once ajax is completed
client.verify.containsText('.entry', 'lorem ipsup...') // verify post creation
})