0

Why this wait in 'clickOldShares' is not working? Even when I put inside a evaluate the the wait doesn't work. I believe that is a small detail with references, but I'm out of ideas right now.

function clickOldShares(){
  console.log("Waiting for Old Shares");
  element = document.querySelector("#pagelet_scrolling_pager > div > div > a"); 
  console.log("ELEMENT: " + element);
  if(element){
    console.log('click and waiting...');
    element.click();
    console.log('clicked!'+ element);

    //THIS WAIT IS NOT WORKING!!!! I DON'T KNOW WHY!!!!
    this.wait(2000,clickOldShares);

  }
  else {
    console.log("done!");
  }
  return element;
};

//Initializing Casper
casper.start('https://www.facebook.com/', function() {
   console.log("Entering on Facebook"); 
});

//Remote Message Handler - now I can see what happen inside evaluates
casper.on('remote.message', function(msg) {
  this.echo(msg);
})


//Facebook login
casper.then(function(){
    console.log("Login using username and password");
    this.evaluate(function(){
      document.getElementById("email").value = 'foo@bar';
      document.getElementById("pass").value = 'somepass';
      document.getElementById("login_form").submit();
      })
    if(this.exists('#u_0_2 > div:nth-child(1) > div:nth-child(1) > div > a > span')){
      console.log("Login ok!");
    }
    else {
      console.log("Login not ok!");
      casper.exit();
    }
});


    casper.thenOpen("https://www.facebook.com/shares/view?id=1063249230414580" ,function(){
    console.log("Open post with object-id");
  });


casper.thenClick("#pagelet_scrolling_pager > div > div > a",function(){ 
      this.wait(2000,function(){ this.evaluate(clickOldShares)});
 });
Artjom B.
  • 58,311
  • 24
  • 111
  • 196
Andre Carneiro
  • 641
  • 5
  • 20

1 Answers1

0

this inside of the page context (inside of casper.evaluate()) refers to window and not casper. You can't use casper inside of the page context.

You need to move stuff around:

function clickOldShares(){
    var elementAvailable = this.evaluate(function(){
      console.log("Waiting for Old Shares");
      element = document.querySelector("#pagelet_scrolling_pager > div > div > a"); 
      console.log("ELEMENT: " + element);
      if(element){
        console.log('click and waiting...');
        element.click();
        console.log('clicked!'+ element);
      }
      return !!element;
    });
    if (elementAvailable) {
      this.wait(2000, clickOldShares);
    }
};

and use it like this:

casper.thenClick("#pagelet_scrolling_pager > div > div > a",function(){ 
    this.wait(2000, clickOldShares);
});

Since DOM nodes cannot be passed out, you need some kind of representation that a DOM element existed in the page context. This can be easily achieved by coercing the DOM node to boolean with !element and then negating it immediately !!element to check if element is "truthy".

Artjom B.
  • 58,311
  • 24
  • 111
  • 196
  • I was so close! But thanks to you, I understand a little more about the 'game of scopes' in javascript. Thank you so much! The image is not ok because is a lot of data. But I've call for getHTML to see and everything is there! I owe you a beer! Thanks again! :D – Andre Carneiro Apr 26 '16 at 11:08
  • What about the '!!element'. I didn't know this in javascript. There is a documentation about it? Speaking of which, may I ask you a recommendation of article of Javascript? – Andre Carneiro Apr 26 '16 at 11:10
  • The [What does this symbol mean in JavaScript?](http://stackoverflow.com/q/9549780/1816580) reference question links to [What is the !! (not not) operator in JavaScript?](http://stackoverflow.com/q/784929/1816580), which is needed here since DOM nodes cannot be passed out of the page context. This limitation is a peculiarity of PhantomJS and not due to JavaScript. – Artjom B. Apr 26 '16 at 11:31
  • Great! Thank you! – Andre Carneiro Apr 26 '16 at 11:37