casper.then does not wait the end of my instruction to execute the next step

Question

I have made this little test:

casper.test.begin('Test', function() {
casper.start();

casper.then(function() {
    casper = this;
    setTimeout(function(casper) {
        casper.echo('wait 5s');
    }, 5000);
});

casper.then(function() {
    this.echo('should appear after 5s');
});

casper.run(function() {
    this.test.done();
});
});

When I execute this test, my console shows only this line "should appear after 5s" but not the first sentence, in fact the second 'then' does not wait for 5 seconds.

It's a huge problem because it's the possible cause of many random failure in my casperjs test suite.

Maybe I have to use async (with series) to execute each step after the other.

Do you have this problem ? What's the best practice to execute some javascript functions one after the other in casperjs tests ?

Answer 1

"What's the best practice to execute some javascript functions one after the other in casperjs tests ?"

Here how i do :

login.js

casper.login = function (id,password) {
    casper.then(function(){ //or this.then(...)
        this.test.comment('----------------Connexion Only ! : --------------------');
        if (!this.visible('#div_boxhover')) {
            this.echo('Connexion box not visible before mouse on it!');
        }
        this.mouse.move(x('//*[@id="identification"]'));
        if (this.visible('#div_boxhover')) {
            this.echo('Connexion box visible after mouse on it!');
        } else { this.echo("FAIL : Connexion box doesn't appear");}
        //this.echo("I can see the logo");
        this.fill(x('//*[@id="div_boxhover"][1]'), { 
                login: id, 
                pass: password
            }, false);
        this.click(x('//*[@name="log_in"]'));
        this.waitForSelector(('.boxValid'), function() {
                this.test.assertSelectorHasText('.boxValid', 'Vous êtes identifié en tant que Membre !');
                this.test.assertTextExists('Succès', 'Page contains "succès" : so identification done');    
            }); 
    });
};

scenario1.js

var x = require('casper').selectXPath;

phantom.injectJs( 'C:/bin/Aptana_casperjs/ccm/_functions/login.js');

casper.test.begin('\n********* Stack title : ***********\n', 3 , function suite(test) {
    casper.start(yourUrl,function(){
        //check one main element in the page
        this.test.assertExists('.search','Search toolbar present');
    })
    //set a viewport (for slimerJS)
    .viewport(1200,800)
    //call an external function
    .then(function() {
        casper.login("pseudo","password");//this.login("pseudo","password");
    })  
    //then click on a link + fill the form which appears
    .thenClick('div.colMiddle > a.button', function(){
        this.fillSelectors('form#frmqa', {
                'select[name="cat"]' : "2",
                'input[name="titre"]' : title,
                'textarea[name="message"]' : message
                }, false);
        this.click('input#submitqa');
    })  
    //wait for the redirection after a click at the end of a step
    .waitForText(topic, function() {
        this.test.assertSelectorHasText('.boxTitle', 'Mes discussions suivies', "New topic in 'Mes dicussions suivies'");
        this.test.assertExists('a[actid="shqafrm"].button','Button answer topic present');
    })
    //click on a new link
    .thenClick('a[actid="shqafrm"].button', function(){
        //wait for the textarea to appear
        this.waitForSelector('textarea[name="message"]',function(){
            //send message and submit
            this.sendKeys('textarea[name="message"]', newPost);
            this.click('input#submitqa');
        });
    })
    //check redirection or validation after a click on button/form/link
    .waitForSelector('.article',function(){
        test.assertTextExists(newPost, 'Answer in topic ' + title + ' done');
    })
    .run(function() {
            this.test.comment('----------------------- Stack title over ------------------------\n');
            test.done();
    });
});

So i just call my functions in a new step.

Answer 2

Try to use wait() here:

casper.then(function() {
    casper = this;
    casper.echo('wait 5s');
});

casper.then(function() {
    casper.wait(5000, function() {
        this.echo('should appear after 5s');
    });
});