概要

XPath はXML Path Languageの略です。XML以外の構文を使用して、Webページ内の要素を見つけるための柔軟な方法を提供します。

Nightwatchは、要素の特定にXPathセレクターをサポートしています。ストラテジーが指定されていない場合、デフォルトでCSSセレクターが使用されます。ユースケースに応じて、XPathを使用する方法はいくつかあります。

1. .useXpath()コマンドを使用する

以下の例に示すように、useXpath()コマンドを使用すると便利です。要素コマンドで複数のパラメーターを使用する必要がなく、XPath式を使用する後続の要素コマンド/アサーションが同じテストに複数ある場合があります。CSSに戻すには、useCss()を呼び出します。

tests/sampleTest.js
module.exports = {
  demoTest: function (browser) {
    browser
      .useXpath() // every selector now must be xpath
      .click("//tr[@data-recordid]/span[text()='Search Text']")
      .useCss() // we're back to CSS now
      .setValue('input[type=text]', 'nightwatch')
  }
};

2. XPathセレクターで要素を見つける

要素セレクターオブジェクトを渡すか、最初の引数として'xpath'ストラテジーを指定することにより、単一のコマンドまたはアサーションでXPathを直接使用することもできます。

tests/sampleTest.js
module.exports = {
  demoTest(browser) {
    // using element selector objects
    browser.click({
      selector: '//tr[@data-recordid]/span[text()='Search Text']',
      locateStrategy: 'xpath'
    });
    
// specifying xpath strategy as first argument browser.click('xpath', '//tr[@data-recordid]/span[text()='Search Text']'); } };

3. 常にデフォルトでXPathを使用する

主にXPath式を使用していて、テストで常にストラテジーを設定することを避けたい場合は、設定でプロパティuse_xpath: trueを設定することにより、デフォルトでXPathを使用することもできます。

nightwatch.json
{
  "use_xpath": true
}