セレクトリスト要素の操作

セレクトリストは、他の要素と比較して特別な動作をします。

Selectオブジェクトは、<select>要素を操作するための一連のコマンドを提供します。

Javaまたは.NETを使用している場合は、コード内でサポートパッケージを適切に要求していることを確認してください。以下の例のいずれかで、GitHubからの完全なコードを参照してください。

このクラスは、HTML要素のselectおよびoptionでのみ機能することに注意してください。 divまたはliを使用したJavaScriptオーバーレイでドロップダウンを設計することは可能ですが、このクラスはそれらに対しては機能しません。

種類

Selectメソッドは、操作対象の<select>要素のタイプによって動作が異なる場合があります。

単一選択

これは、1つのオプションのみを選択できる標準のドロップダウンオブジェクトです。

<select name="selectomatic">
    <option selected="selected" id="non_multi_option" value="one">One</option>
    <option value="two">Two</option>
    <option value="four">Four</option>
    <option value="still learning how to count, apparently">Still learning how to count, apparently</option>
</select>

複数選択

このセレクトリストでは、一度に複数のオプションを選択および選択解除できます。 これは、multiple属性を持つ<select>要素にのみ適用されます。

<select name="multi" id="multi" multiple="multiple">
    <option selected="selected" value="eggs">Eggs</option>
    <option value="ham">Ham</option>
    <option selected="selected" value="sausages">Sausages</option>
    <option value="onion gravy">Onion gravy</option>
</select>

クラスの作成

最初に<select>要素を見つけ、それを使用してSelectオブジェクトを初期化します。 Selenium 4.5以降では、<select>要素が無効になっている場合、Selectオブジェクトを作成できないことに注意してください。

        WebElement selectElement = driver.findElement(By.name("selectomatic"));
        Select select = new Select(selectElement);
    select_element = driver.find_element(By.NAME, 'selectomatic')
    select = Select(select_element)
            var selectElement = driver.FindElement(By.Name("selectomatic"));
            var select = new SelectElement(selectElement);
    select_element = driver.find_element(name: 'selectomatic')
    select = Selenium::WebDriver::Support::Select.new(select_element)

  it('Select an option', async function () {
    val selectElement = driver.findElement(By.name("selectomatic"))
    val select = Select(selectElement)

オプションをリスト表示

取得できるリストは2つあります

すべてのオプション

<select>要素内のすべてのオプションのリストを取得します

        List<WebElement> optionList = select.getOptions();
    option_list = select.options
            IList<IWebElement> optionList = select.Options;
    option_list = select.options
    val optionList = select.getOptions()

選択されたオプション

<select>要素内で選択されたオプションのリストを取得します。 標準のセレクトリストの場合、これは1つの要素のみを含むリストになりますが、複数選択リストの場合は、ゼロまたは多数の要素を含めることができます。

        List<WebElement> selectedOptionList = select.getAllSelectedOptions();
    selected_option_list = select.all_selected_options
            IList<IWebElement> selectedOptionList = select.AllSelectedOptions;
    selected_option_list = select.selected_options
    val selectedOptionList = select.getAllSelectedOptions()

オプションを選択

Selectクラスは、オプションを選択するための3つの方法を提供します。 複数選択タイプのセレクトリストの場合、選択する要素ごとにこれらのメソッドを繰り返すことができることに注意してください。

テキスト

表示テキストに基づいてオプションを選択します

        select.selectByVisibleText("Four");
    select.select_by_visible_text('Four')
            select.SelectByText("Four");
    select.select_by(:text, 'Four')
    const countElement = await driver.findElement(By.css("option[value='still learning how to count, apparently']"))
    select.selectByVisibleText("Four")

value属性に基づいてオプションを選択します

        select.selectByValue("two");
    select.select_by_value('two')
            select.SelectByValue("two");
    select.select_by(:value, 'two')
    assert.equal(true, await fourElement.isSelected())
    select.selectByValue("two")

インデックス

リスト内の位置に基づいてオプションを選択します

        select.selectByIndex(3);
    select.select_by_index(3)
            select.SelectByIndex(3);
    select.select_by(:index, 3)
    assert.equal(true, await twoElement.isSelected())
    select.selectByIndex(3)

無効なオプション

Selenium v4.5

disabled属性を持つオプションは選択できない場合があります。

    <select name="single_disabled">
      <option id="sinlge_disabled_1" value="enabled">Enabled</option>
      <option id="sinlge_disabled_2" value="disabled" disabled="disabled">Disabled</option>
    </select>
        Assertions.assertThrows(UnsupportedOperationException.class, () -> {
            select.selectByValue("disabled");
        });
    with pytest.raises(NotImplementedError):
        select.select_by_value('disabled')
            Assert.ThrowsException<InvalidOperationException>(() => select.SelectByValue("disabled"));
    expect {
      select.select_by(:value, 'disabled')
    }.to raise_exception(Selenium::WebDriver::Error::UnsupportedOperationError)
    const select = await new Select(selectElement)

    await assert.rejects(async () => {
      await select.selectByValue("disabled")
    Assertions.assertThrows(UnsupportedOperationException::class.java) {
      select.selectByValue("disabled")
    }

オプションの選択解除

複数選択タイプのセレクトリストのみがオプションの選択を解除できます。 選択する要素ごとにこれらのメソッドを繰り返すことができます。

        select.deselectByValue("eggs");
    select.deselect_by_value('eggs')
            select.DeselectByValue("eggs");
    select.deselect_by(:value, 'eggs')
    assert.equal(true, await gravyElement.isSelected())
    select.deselectByValue("eggs")