Posted at

Nightwatchでselect項目がsetValueできない時の対処法

More than 3 years have passed since last update.

下記のようなselectがあり、テストケースで例えば1を選択するようなテストケースを作成する場合、

<select id='select-list'>

<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select>

通常は下記のように書く。

browser

.url(form_page_path)
.waitForElementVisible('body', 1000)
.setValue('#select-list', '1')

しかし、Seleniumとの連携の問題か、クリックされるだけで値が変わらない場合がある。このようなときには、optionを直接クリックさせるような処理にすればよい。

具体的には下記のようなコードになる。

browser

.url(form_page_path)
.waitForElementVisible('body', 1000)
.click("#select-list option[value='1']")

これで問題なく選択される。しかし、これでは可読性がおちるので、下記のようなカスタムコマンドを登録しておくと便利。

exports.command = function(selector, value){

"use strict";
var full_path = selector + " option[value='" + value + "']";
this.click(full_path);
return this;
};

これをsetSelect.jsという名前で保存し、下記のように呼べば可読性を担保したまま、正しい挙動をさせることができる。

browser

.url(form_page_path)
.waitForElementVisible('body', 1000)
.setSelect("#select-list", "1")

Have a nice nightwatch life!