Могу ли я выбрать элемент по его позиции в nightwatch.js?

Question

Я ищу, чтобы автоматизировать некоторые из моих процессов тестирования, и я относительно новичок в Nightwatch.js и javascript. Есть ли способ, которым я могу щелкнуть элемент на основе его класса и позиции в последующем массиве, который будет возвращен, если есть несколько элементов с тем же классом.

Например, возьмем следующий HTML: -

<div class="clickable-button"><p>Some Text</p></div> 
<div class="clickable-button"><p>Some Text 2</p></div> 
<div class="clickable-button"><p>Some Text 3</P></div> 

Если я использую инструменты разработки хромовые и выполните следующую команду в консоли: -

$('.clickable-button') 

Он возвращает массив из трех элементов вышеперечисленное.

Я хотел бы нажать первый элемент <div> и узнать, есть ли способ, которым я могу это сделать, используя селектор CSS? Я не могу выбрать текст, который появляется в теге <p>, поскольку это динамические данные.

Я попытался следующие команды в Nightwatch: -

browser.click('.clickable-button'[0]) 

browser.click('clickable-button[0]') 

Ни один из этих вариантов работы. Любая помощь или совет будут оценены.

Answer 1

Вы могли бы, вероятно, использовать :nth-of-type

browser.click('.clickable-button:nth-of-type(1)'); 

BTW :nth-of-type является частью CSS3, так что не поддерживается старыми браузерами.

Answer 2

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

browser .useXpath() //ignore this line if you already selected xpath as strategy .click('(//div[@class="clickable-button"])[1]')

найти первую кнопку. Reference