CasperJS Invoke Javascript function on browser console
<p>I am trying to invoke a Javascript method using CasperJS.
The web page simply consist of a link that allows me to change back to my default country.</p>
<pre><code>&lt;a id=&quot;defaultCountry&quot; href=&quot;javascript:__doPostBack('cty$UK$default','')&quot;&gt;Default Country&lt;/a&gt;
</code></pre>
<p>I want CasperJS to invoke the Javascript method that is called after clicking the link.
I assumed that mimicking a mouse click on the link would invoke the Javascript method but it doesn't.
I've tried the following methods with no success:</p>
<pre><code> casper.then(function() {
        casper.click(x('//*[@id=&quot;defaultCountry&quot;]'));
        casper.evaluate(function() {
              __doPostBack('cty$UK$default',''); //this is the javascript function. im not sure if thats how you would call it though
        });
</code></pre>
<p>or</p>
<pre><code>this.clickLabel('Default Country', 'a');
</code></pre>
<p>I know that if I invoke the Javascript function on the browser console, it will work. I simply type:</p>
<pre><code>__doPostBack('cty$UK$default','');
</code></pre>
<p>in the console and it magically works.
Any help appreciated!</p>
<hr />
<p>Edit:</p>
<p>@Rippo This is a snippet of what I ran. It seems like CasperJS bypasses my eval statement. The last few lines are from the console directly. I know my page loads with the selector because of the screenshot. I've even used the <code>casper.waitforselector</code> method to confirm.</p>
<pre><code>casper.thenOpen('http://example.com');

casper.wait(5000, function() {
    console.log('page opened');
    casper.capture('page.png');
    console.log('capture page complete');
});

casper.thenEvaluate(function() {
    console.log('invoking javascript');
    __doPostBack('cty$UK$default','');
    console.log('javascript invoked');
});
</code></pre>
<p>This is from the console:</p>
<pre><code>[info] [phantom] wait() finished waiting for 5000ms.
page opened
[debug] [phantom] Capturing page to C:/Users/page.png
[info] [phantom] Capture saved to C:/Users/page.png
capture page complete
[info] [phantom] Step _step 8/8 http://example.com (HTTP 200)
[info] [phantom] Step _step 8/8: done in 16240ms.
[info] [phantom] Done 8 steps in 16259ms
[debug] [phantom] Navigation requested: url=about:blank, type=Other, willNavigate=true, isMainFrame=true
[debug] [phantom] url changed to &quot;about:blank&quot;
</code></pre>
<p>This is the last line from the console before it exits.</p>
<hr />
<p>Edit 7/17/2016 12:40AM</p>
<p>@Artjom B.
Here's a snippet of the code I ran with your suggestions:</p>
<pre><code>...snipped some prior    
function() {
    console.log('Page loaded');
    casper.capture('page.png');
    console.log('Starting 1st postback call');
    this.evaluate(function() {
        console.log('postback call');
         __doPostBack('cty$UK$default','');
        });
    console.log('passed postback');
    casper.capture('post-postback.png');

//At this point, it skips this function and goes straight to console.log then comes back to this function. Not sure why...
casper.then(function() {
    console.log('trying to change again');
    this.click(x('//*[@id=&quot;defaultCountry&quot;]'));
    this.evaluate(function() {
        __doPostBack('cty$UK$default','');
        console.log('javascript invoked');
    });
});

//skipped to this console.log
console.log('waiting country to change');
this.waitForSelector('.countryuk', 
    function() {
        console.log('country change completed. Capturing image');
        this.capture('uk.png');
    },

    function() {
        console.log('timed out waiting for country to change.');
        this.capture('uk-timeout.png');
    },5000);
</code></pre>
<p>};</p>
<p>Here is the console output:</p>
<pre><code>Page loaded
[debug] [phantom] Capturing page to C:/Users/page.png
[info] [phantom] Capture saved to C:/Users/page.png
Starting 1st postback call
Console: postback call
Error: ReferenceError: Can't find variable: __doPostBack
passed postback
[debug] [phantom] Capturing page to C:/Users/post-postback.png
[info] [phantom] Capture saved to C:/Users/post-postback.png
waiting country to change
[info] [phantom] Step anonymous 10/11 http://example.com/page.aspx?r=2 (HTTP 200)
trying to change again
[debug] [phantom] Mouse event 'mousedown' on selector: xpath selector: //*[@id=&quot;defaultCountry&quot;]
[debug] [phantom] Mouse event 'mouseup' on selector: xpath selector: //*[@id=&quot;defaultCountry&quot;]
[debug] [phantom] Mouse event 'click' on selector: xpath selector: //*[@id=&quot;defaultCountry&quot;]
Error: ReferenceError: Can't find variable: __doPostBack
Error: ReferenceError: Can't find variable: __doPostBack
[info] [phantom] Step anonymous 10/11: done in 22567ms.
[info] [phantom] Step _step 11/11 http://example.com/page.aspx?r=2 (HTTP 200)
[info] [phantom] Step _step 11/11: done in 22573ms.
[warning] [phantom] Casper.waitFor() timeout
timed out waiting for country to change.
[debug] [phantom] Capturing page to C:/Users/uk-timeout.png
[info] [phantom] Capture saved to C:/Users/uk-timeout.png
[info] [phantom] Done 11 steps in 27825ms
[debug] [phantom] Navigation requested: url=about:blank, type=Other, willNavigate=true, isMainFrame=true
[debug] [phantom] url changed to &quot;about:blank&quot;
</code></pre>
<p>Clearly it cant find the postback function. I'm not sure why though. It's not a hidden element. It's exactly as I posted above (a link). It's nested within a bunch of div tags but that's about it.</p>