title: Using XPath with CasperJS
body: <p>I am using CasperJS to test my frontend, and a new element of "foo" is created with the name "Brand New Name" and there are already existing 'foo' elements. I need to use XPath to select the specific element with the correct name so I can test if it exists using Casper.</p>
  
  <p>This is what I'm doing currently:</p>
  
  <pre><code>this.test.assertExists(x('//*[@class="foo" and text()="Brand New Name"]'), 'new thing exists')
  </code></pre>
  
  <p>But this is not finding what I want, what am I doing wrong?</p>
  
  <p><strong>UPDATE 1</strong></p>
  
  <p>This is the Casper.JS failure message I receive, even though the <code>xPath</code> selector looks correct.</p>
  
  <pre><code>FAIL new category exists
  #    type: assertExists
  #    file: ../../../foo/test/casper/foo_manager/new_category.js
  #    subject: false
  #    selector: {"type":"xpath","path":"//*[@class=\"foo\" and contains(text(), \"Brand New Category\")]"
  </code></pre>
  
  <p>I have realized that there is actually a <code>span</code> in the element I am trying to select. I have tried to account for this, but I just can't get the <code>xPath</code> CasperJS selector to work. I have updated the <code>xPath</code> selector to a <code>contains</code> and it still won't work.</p>
  
  <p>The selector looks like this:</p>
  
  <pre><code>this.test.assertExists(x('//*[@class="foo" and contains(text(), "Brand New Category")]'), 'new category exists')
  </code></pre>
  
  <p>The element in question looks like this: </p>
  
  <pre><code>&lt;a href='#' class='foo' id='foo-bar'&gt;
    Brand New Category
    &lt;span&gt;some text&lt;/span&gt;
  &lt;/a&gt;
  </code></pre>