waitForSelector timing out

36 views
Skip to first unread message

Steven Leiva

unread,
Sep 8, 2016, 11:17:40 AM9/8/16
to CasperJS
Hello folks. 

I am having a problem using CasperJS. Basically, here are the steps I want to go through:

  1. Go to loginUrl
  2. Fill in the login form with the correct username and password
  3. Submit the login form
  4. Wait until the right selector is on the page, and then take a screenshot of the page.
Here is my setup for Steps 1 through 3. (I capture an image here to make sure that I am able to log into the website);

Steps 1 through 3 (plus screenshot):

var env = require('system').env;
var casper = require('casper').create();


var loginUrl = env.loginUrl;
var login = env.login;
var password = env.password;


casper
.on('remote.message', function(event) { // log messages from browser
  console
.log(event);
});


casper
.userAgent('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36'); // set user agent


casper
.start(loginUrl); // open the following url


casper
.then(function() { // login
 
this.fill('#form_signin', {username: login, password: password}, true);
});

casper
.wait(2000, function() {
 
this.capture('./output/test.png');
});


casper
.run();

The above works well. The image that is captured is exactly what I was expecting. However, I don't want to use a wait - instead, I'd like to use a waitForSelector. I replace by wait function above with this:

casper.waitForSelector('#attendance', function() {
 
this.capture('./output/test.png');
})

Unfortunately, this doesn't work. At first I though that it might be because the selector is wrong. However, when I log into the site manually, with Chrome, and I run document.getElementById("attendance") I get the expected element back. 

I thought I might have better luck if I tried searching for the selector in the context of the page itself, so instead of replacing wait with waitForSelector, I replaced it with this:

function attendanceCheck() {
 
return this.evaluate(function() {
   
return !!document.getElementById('attendance');
 
});
}


casper
.waitFor(attendanceCheck, function() {
 
this.capture('./output/test.png');
})

Even with this setup, I was getting a timeout, meaning that attendanceCheck was never able to find an element that fits the given selector, even when evaluating in the context of the page.

Can someone help me figure out what I'm doing wrong? I know that I can log in, and I know that, once the entire page loads, there is an element with an id of "attendance", yet waitForSelector and waitFor are not able to find this element. (Eventually, I have to click this element, so I have to be able to find it). 

Thank you very much! 
Message has been deleted

philippe....@oscaro.com

unread,
Sep 13, 2016, 9:47:22 AM9/13/16
to CasperJS
Hello,

Could you try the following code?

casper.waitForSelector('#attendance',
   
function success() {
       
this.capture('./output/test.png');
   
},
   
function fail() {
       
this.die('"#attendance" selector not found');
});



If it still doesn't work, could you copy/paste the following code after your wait function?

casper.then(function() {
   
this.test.assertExists('#attendance', 'Find the element "#attendance"');
});


Reply all
Reply to author
Forward
0 new messages