TypeScript + Selenium のXpathでの要素指定ができない

Question

前提・実現したいこと

TypeScript + Selenium で自動化テストを作ろうとしています。
ただ、ある画面でのみ要素指定できずにエラーとなってしまいます。

• Xpathは以下のように指定しています

1.Chrome 上で、XPath を取りたい要素を右クリック、「検証」を選ぶ
2.デベロッパーツール上で該当要素を右クリック、「Copy→Copy XPath」を選ぶ

発生している問題・エラーメッセージ

NoSuchElementError: no such element: Unable to locate element: {"method":"xpath","selector":"<対象のxpath>"}

該当のソースコード

const webdriver = require('selenium-webdriver');
const { Builder, By, until } = webdriver;
const capabilities = webdriver.Capabilities.chrome();

const TEST_URL = "https://hogehoge/";
const ID = "id";
const PW = "pass";

// ブラウザ立ち上げ
const driver = new Builder().withCapabilities(capabilities).build();

// テスト画面を開く
driver.get(TEST_URL);

// IDを入力
console.log("IDを入力します");
driver.findElement(By.xpath('<対象のxpathを指定>')).sendKeys(ID);
console.log("IDを入力しました");

// パスワードを入力
driver.findElement(By.xpath('<対象のxpathを指定>')).sendKeys(PW);

試したこと

1. Googleで検索する、という操作で上記と同じようにXpathで要素を指定して実行したところうまくできました。
2. Python + Selenium で同じXpathを指定して同じような処理をしたところエラーにはならなかったのでXpathが違う、ということはなさそうです

/*
Googleで検索してみる
→これは成功した
*/

const webdriver = require('selenium-webdriver');
const { Builder, By, until } = webdriver;
const capabilities = webdriver.Capabilities.chrome();

const GOOGLE_URL = "https://www.google.com/";
const SEARCH_WORD = "TSでselenium";

const driver = new Builder().withCapabilities(capabilities).build();

driver.get(GOOGLE_URL);

driver.findElement(By.xpath('/html/body/div[1]/div[3]/form/div[1]/div[1]/div[1]/div/div[2]/input')).sendKeys(SEARCH_WORD);
driver.findElement(By.xpath('/html/body/div[1]/div[3]/form/div[1]/div[1]/div[3]/center/input[1]')).click();

補足情報（FW/ツールのバージョンなど）

• Windows10
• typescript@4.2.4
• selenium 3.141.0
• VScode

Answer 1

no such element

ということなので、そのノードが無いのでしょう。

'/html/body/div[1]/div[3]/form/div[1]/div[1]/div[1]/div/div[2]/input'

のような危ういXPath指定を使うと、ちょっとでも異なったHTMLになると扱えません。

driver.findElementする直前で、print(driver.page_source)してHTMLを確認しましょう。

Comments

[__kuroneko]

今はいったんTypeScriptで動かしてみたい、というのを重視してたのでXPath指定にしています。
実際の運用の際はIDを埋め込んでID指定にするつもりです。

困っているのが、Pythonで書いたときとTSで書いたときとで同じXpathを指定しているにも関わらずなぜTSで書いたときだけNoSuchElementになるのかがわかりません…

[otn]

> ちょっとでも異なったHTMLになると扱えません。
と書いたとおりです。
期待通りのHTMLでないことを確認しましょう。