Выбор элемента в выпадающем списке [selenide]

webdriver
selenide
Теги: #<Tag:0x00007f7b6498b098> #<Tag:0x00007f7b6498ad28>

(All Safe) #1

У меня есть такая разметка, сгенерированная ангуляром

<p-dropdown id="discountTypeDropdown" name="discountType">
    <div class="ui-dropdown">
        <div class="ui-helper-hidden-accessible"><input class="ng-tns-c8-13" readonly="" role="listbox" type="text"
                                                        aria-label="Процент"></div>
        <div class="ui-dropdown-trigger"><span class="ui-dropdown-trigger-icon"></span></div>
        <div
            class="ng-trigger" ng-reflect-ng-class="ui-dropdown-panel  ui-widget u"
            style="z-index: 1006; top: 23px; left: 0px; transform: translateY(0px); opacity: 1;">
            <div class="ui-dropdown-items-wrapper" style="max-height: 200px;">
                <ul class="ui-dropdown-items">
                    <li class="ui-dropdown-item" style="">
                        <span class="ng-tns-c8-13 ng-star-inserted">Процент</span></li>
                    <li class="ui-dropdown-item" style=""><span
                        class="ng-tns-c8-13 ng-star-inserted">Сумма</span>
                </ul>
            </div>
        </div>
    </div>
</p-dropdown>

Это выпадающий список, при клике по которому появляются элементы ui-dropdown-items. Выглядит так:

Я попытался сделать тест, который в зависимости от выбора в этом списке, проверит правильность записи в соседнем поле:

@Test
public void checkDiscountValueTitle() {
    open("/");
    $("#discountTypeDropdown").click();
    $$("#discountTypeDropdown span").findBy(text("Процент")).click();
    $("#discountValueLabel").shouldHave(text("Размер скидки *, %"));

    $("#discountTypeDropdown").click();
    $$("#discountTypeDropdown span").findBy(text("Сумма")).click();
    $("#discountValueLabel").shouldHave(text("Размер скидки *, руб."));
}

Но проблема в том, что тест не стабилен. В некоторые моменты, я так понял, список не успевает закрыться и приходит уже второй клик и все замирает в таком положении:
image

Соответственно из-за этого надпись в поле справа не меняется и тест падает. Подскажите, можно ли что-то с этим сделать. Может как-то иначе организовать тест?

Версии ОС и софта следующие:

Selenide 5.1.0, Win10, Ubuntu 16, Firefox 60, Chrome71


(Vladislav Abramov) #2

ну можно проверять сначала, что дропдаун закрылся, а после этого уже проверять текст рядом с ним


(Valentin G ) #3

Использую для таких случае самапиcные методы типа - WaitForElementNotPresent, запускаю после клика на закрытие дропдауна.


(Sergey Brit) #4

Согласен с подождать.
В Selenide у элемента есть метод shouldBe. Вот попробуйте его.
Или waitUntil если нужен кастомный тайм-аут.


(Vatslau) #5

Есть hover
ЕСть проверки по css/атрибутам что элемент выделен
делайте его перед кликом

  public static final String[] ENABLED_BTN =
          {"outline-color", "rgb(51, 51, 51)", "Color if button is enabled"};

использование

  public ActivateModal cancel() {
    modalBody.should(visible);
    sleep(1000);
    cancelBtn.should(visible, enabled).hover()
            .shouldHave(cssValue(ENABLED_BTN[0], ENABLED_BTN[1]));
    sleep(500);
    cancelBtn.click();
    cancelBtn.shouldNot(visible);
    return this;
  }