Can use casperjs login to facebook but capture to

Question

Can use casperjs login to facebook but capture to png only show nav bar this my code: facebook.js

casper.start("http://www.facebook.com/login.php", function(response) {
    if (this.exists('[name="lsd"]')) {              
        this.page.evaluate(function(a,b) {
              document.querySelector("input[name='email']").value = a
              document.querySelector("input[name='pass']").value = b;
              document.querySelector("#login_form").submit(); 
              console.log("Login submitted!");
        },user_email,user_pass);                
    } else {
        this.echo('[name="lsd"] not found', 'ERROR');
        phantom.exit();
    }
    this.capture('img/'+user_email+'_login.png');
});

casper.run();

please help me to solve the issue.

Answer 1

The problem is that you immediately capture the page after submitting the login form. You need to wait a bit before the new page is loaded, but this is not the only problem with facebook.

1. You need to run CasperJS like this:

   casperjs --ssl-protocol=tlsv1 facebook.js
   

   because of the recent POODLE SSL vulnerability. (Other answer)

2. When you register to page.error, you see multiple errors popping up, saying that bind is not available. You need a shim for that so that facebook functions properly. I provided a copy paste solution here.

And now the issue of waiting for the page to load... There are several solutions for this.

Add a step

This is the easiest and works on most non-single-page-apps.

casper.start("http://www.facebook.com/login.php", function(response) {
    this.page.evaluate(function(a,b) {
        // login
    }, user_email, user_pass);
}).then(function(){
    this.capture('img/'+user_email+'_login.png');
}).run();

Wait for a selector that exists only on the new page

This is the most robust way and works on all pages.

casper.start("http://www.facebook.com/login.php", function(response) {
    this.page.evaluate(function(a,b) {
        // login
    }, user_email, user_pass);
}).waitForSelector("SOMESELECTORLIKEPROFILEBUTTON", function(){
    this.capture('img/'+user_email+'_login.png');
}).run();

Wait a static amount of time

This is the least robust, but easiest. You may wait longer than necessary or not long enough so that the operation fails.

casper.start("http://www.facebook.com/login.php", function(response) {
    this.page.evaluate(function(a,b) {
        // login
    }, user_email, user_pass);
}).wait(4000, function(){
    this.capture('img/'+user_email+'_login.png');
}).run();

Note: I'm using the promise syntax, but it is not necessary.