Как нажать на глубоко скрытую кнопку в классах div через транспортир. Без идентификатора

Question

Я пытаюсь нажать кнопку, которая скрыта в классах div в коде через транспортир.

Я веду проект транспортира для своей работы и достиг точки, когда я уже не знаю, что делать.У меня есть кнопка, которая скрыта в классах div и не позволяет мне нажимать.Я пытался использовать mouseMove, чтобы перейти к координатам кнопки, я пытался использовать className конкретной кнопки и т. Д. У кнопки нет идентификатора.Идентификатор не является проблемой, поскольку я пытался нажать другую кнопку, одинаково скрытую в элементах div, по ее идентификатору.Мне нужно знать, как пройти через слои div, чтобы нажать кнопку, потому что остальные тесты будут зависеть от нее.

APPLICATION CODE:
::before
<dashboard-label>
    <div class="att-topic-analysis-tabs">
       <div class="att-button-group">
          <button class="btn btn-default btn-lg att-close-topic ng-scope" 
           role="presentation" tabindex="-1" 
           ng-click="removeTopic(currentTopic.id)" translate> 
          Close Topic
          </button>
       </div>
    </div>

PROTRACTOR TEST:
it('Closes Topic Successfully', function(){
    //opens the first available topic
    openTopic.click();

    //checks that the URL contains 'topics' after 5 seconds
    browser.wait(proExpect.urlContains('topics'), 5000);
    var closeTopic = element(by.className('att-close-topic'));
    //browser.wait(proExpect.elementToBeClickable(closeTopicButton), 5000);
    console.log(closeTopic);
    closeTopic.click();



    browser.wait(proExpect.urlContains('home'), 5000);

});

Как видите, кнопка «Закрыть тему» ​​скрыта в классах div, и стандартный щелчок не работает.Любая информация будет принята с благодарностью

Answer 1

Если локатор closeTopic находит элемент, но не щелкает по нему, убедитесь, что в DOM есть только один соответствующий элемент, и что он видим. Мой любимый способ проверить DOM - это просто ctrl-F в инспекторе Chrome и вставить тот CSS, который используется в тесте (.att-close-topic). И чтобы проверить, что он видит, используйте

console.log(closeTopic.isDisplayed());

Это может быть большой уловкой в ​​транспортире, потому что он не дает сбоя (только предупреждает), когда на странице есть несколько совпадений, и по умолчанию это первое совпадение, а не первое видимое совпадение , что сводит меня с ума, потому что очень редко вы хотите что-либо сделать с невидимым элементом на странице.

---

Это будет частично мнение, а просто добавить слой к разговору ...

Иногда решение проблемного элемента на странице заключается в том, чтобы вернуться к разработчикам и сделать страницу более тестируемой. Я видел, как тестировщики тратят часы или дни на создание блестящих обходных путей, чтобы получить доступ к упрямому элементу, и в результате получился хрупкий, сложный сквозной тест (и разве они уже не достаточно хрупки?).

Иногда 5-минутный разговор с разработчиком может привести к быстрому изменению производственного кода (например, добавить уникальный идентификатор), что позволяет избежать всех этих усилий и дает гораздо лучший результат, более стабильный, более простой. Но для этого требуется открытый диалог между командой разработчиков и тестировщиком, а также культура, в которой тестирование рассматривается как основное действие, достаточное для внесения тех изменений в тестируемость в производственный код, который в остальном работает нормально.

Answer 2

попробуйте

var closebutton = element (by.css ("[ng-click =" removeTopic (currentTopic.id) "]"), EC = protractor.ExpectedConditions;

Ожидает, что элемент будет clickable.checks для отображения и включения состояния кнопки browser.wait (EC.elementToBeClickable (closebutton), 10000);

теперь использует: closebutton.click ();

Answer 3

Это то, что вы хотите прочитать, чтобы помочь вам отладить, почему ваш тест не работает. Кроме того, вы можете начать использовать await / async, так как поток управления исчезнет в будущем. http://www.protractortest.org/#/debugging