CasperJS makes an heavy use of selectors in order to work with the DOM, and can transparently use either CSS3 or XPath expressions.
CSS3 selectors
By default, Casper will accept CSS3 selector strings
to check for elements within the DOM. For example, to check if a <div id="plop">
element exists in a page, you can use:
casper.start('http://domain.tld/page.html', function() {
this.test.assertExists('#plop', 'the element exists');
});
XPath
Added in 0.6.8 You can alternatively use XPath expression strings instead:
casper.thenOpen('http://domain.tld/page.html', function() {
this.test.assertExists({
type: 'xpath',
path: '//*[@id="plop"]'
}, 'the element exists');
});
To ease the use and reading of XPath expressions, a selectXPath
helper is
available from the casper
module:
var x = require('casper').selectXPath;
casper.thenOpen('http://domain.tld/page.html', function() {
this.test.assertExists(x('//*[@id="plop"]'), 'the element exists');
});
Warning The only limitation of XPath use
in CasperJS is in the fill()
method when you want to fill
file fields; PhantomJS natively only allows the use of CSS3 selectors in
its
uploadFile method, hence this limitation.