Geek Answers Handbook

Can I select an item by its position in nightwatch.js?

I want to automate some of my test processes, and I'm relatively new to Nightwatch.js and javascript. Is there a way that I can click an element based on its class and position in the subsequent array that will be returned if there are several elements with the same class.

For example, take the following 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>

If I use the Chrome development tools and run the following command in the console: -

 $('.clickable-button')

It returns an array of the three elements listed above.

I would like to click the first <div> element and find out if there is a way to do this using the CSS selector? I can’t select the text that appears in the <p> tag because it is dynamic data.

I tried the following commands in Nightwatch: -

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

None of these options work. Any help or advice would be appreciated.

+5
source share
2 answers

Perhaps you can use :nth-of-type

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

BTW :nth-of-type is part of CSS3, so it is not supported by older browsers.

+3
source

Besides using a CSS selector, XPath is another option you can do

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

to find the first button. Link

+1
source

More articles:


All Articles