Search code examples
javascriptcasperjs

Casper.js Click on Button ID with Different Names


I am trying to click on small bullets (button) on a webpage using casper.js and make a screenshot.

<div> == $0
  <input type="image" name="ct100$body$uxDashboardList$ct100$dshButton" id="dshButton" title="Page 1" src="Images/bullet_green.png">
  <input type="image" name="ct101$body$uxDashboardList$ct100$dshButton" id="dshButton" title="Page 2" src="Images/bullet_green.png">
  <input type="image" name="ct102$body$uxDashboardList$ct100$dshButton" id="dshButton" title="Page 3" src="Images/bullet_green.png">
  <input type="image" name="ct103$body$uxDashboardList$ct100$dshButton" id="dshButton" title="Page 4" src="Images/bullet_green.png">
</div>

I am able to take a screenshot on the first landing page using:

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

casper.options.viewportSize = { width: 1920, height: 1080 };
casper.userAgent('Mozilla/5.0 (Windows NT 5.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36');
casper.start('https://websitenotdiscloseasitcontainsprivateinformationsandaspecialkey', function() {

    this.wait(10000, function() {
        this.click('ctl01$Body$uxDashboardList$ctl02$dshButton');
        casper.capture('page2.png');
   });
});

casper.run();

Using this code casper.js does not take any screenshot (guess its not finding the button?)

Could not find a way to click a button that has the same id but has a different name.


Solution

  • So I was not waiting for the page to load after I clicked the link:

    this.wait(5000, function() {
        this.click('input[type="image"][name="ctl00$Body$uxDashboardList$ctl02$dshButton"]');
       });
         this.wait(5000, function() {
             this.capture('test2.png');
      });
    

    Might ot be elegant but it works