2

The website displays the visitor's IP address in an h1 tag with id = "ip"

When I use return document.querySelector('#ip').innerText; it displays the correct IP address and everything is well.

However, when I use return $('#ip').text(); it displays null

Any ideas why? 

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

casper.start("http://mikeyaworski.com/IP", function() {

    var ip = this.evaluate(function() {
        // return document.querySelector('#ip').innerText; // does work
        return $('#ip').text(); // doesn't work, but it should
    });

    this.echo("\nYour public IP address is: " + ip);
});

casper.run();
Michael Yaworski
  • 13,410
  • 19
  • 69
  • 97
  • 1
    Are you sure `$` is `jQuery`? Maybe you have some other library loaded and it's conflicting. – Barmar Feb 22 '14 at 06:46
  • @Barmar What I've posted is my entire code and I've not done anything with any libraries (as far as I'm aware). I'm following the answer on [this question](http://stackoverflow.com/questions/17860928/how-do-i-use-jquery-in-casperjs). – Michael Yaworski Feb 22 '14 at 06:52
  • Still, that doesn't mean `$` is jQuery. What does `console.log($.fn.jquery)` tell you? – Felix Kling Feb 22 '14 at 06:55
  • Have you loaded jQuery? – Barmar Feb 22 '14 at 06:57
  • @Barmar: Logging that inside the `evaluate` function does nothing. Logging that outside of the `evaluate` function gives `ReferenceError: Can't find variable: $` which is what I'd expect. And no, I guess I haven't loaded jQuery. However, in another [project I've done](http://code.mikeyaworski.com/CasperJS/twitter), I didn't "load jQuery" (I think) and it ended up working. – Michael Yaworski Feb 22 '14 at 07:01
  • I don't know CasperJS. But see: http://casperjs.readthedocs.org/en/latest/faq.html#can-i-use-jquery-with-casperjs – Barmar Feb 22 '14 at 07:05
  • @Barmar Oh, well thanks for the effort. Yeah I've read that documentation before and it seemed to work without it (before). I'll try it again anyways. – Michael Yaworski Feb 22 '14 at 07:07

2 Answers2

1

I ended up downloading jQuery from here to a place on my computer.

Then I followed the documentation on this topic and it seemed to work (oddly, because in the past, I haven't needed to follow these "rules").

My code ended up like this:

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

casper.start("http://mikeyaworski.com/IP", function() {

    // this is the changed part
    casper.page.injectJs('path/to/jquery-1.11.0.js');

    var ip = this.evaluate(function() {
        // return document.querySelector('#ip').innerText;
        return $('#ip').text();
    });

    this.echo("\nYour public IP address is: " + ip);
});

casper.run();

This worked as well:

// this is the changed part
var casper = require('casper').create({
    clientScripts: ["path/to/jquery-1.11.0.js"]
});

casper.start("http://mikeyaworski.com/IP", function() {

    var ip = this.evaluate(function() {
        // return document.querySelector('#ip').innerText;
        return $('#ip').text();
    });

    this.echo("\nYour public IP address is: " + ip);
});

casper.run();

However, what I still find odd is that on this other script, I used jQuery just fine without injecting it anywhere, or even having it downloaded on my computer. I'd like some more information on that.

Michael Yaworski
  • 13,410
  • 19
  • 69
  • 97
0

Apparently, early versions of jQuery on a page may collide with the version of jQuery you are using in the test. If you upgrade your version, the two jQuerys dont collide. This is related to this other thread:

CasperJS click event having AJAX call

There are other ways to fix it without changing your version of jQuery.

Community
  • 1
  • 1
Tonaz Valadez
  • 1