admin管理员组

文章数量:1359891

I am looking to automate some of my testing processes and I am relatively new to Nightwatch.js and javascript. Is there a way that I can click an element based on it's class and position in the subsequent array that will be returned if there are multiple 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 chrome development tools and run the following mand 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 want to know if there is a way I can do this using a CSS selector? I cannot select via the text that appears within the <p> tag as this is dynamic data.

I have tried the following mands in Nightwatch: -

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

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

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

I am looking to automate some of my testing processes and I am relatively new to Nightwatch.js and javascript. Is there a way that I can click an element based on it's class and position in the subsequent array that will be returned if there are multiple 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 chrome development tools and run the following mand 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 want to know if there is a way I can do this using a CSS selector? I cannot select via the text that appears within the <p> tag as this is dynamic data.

I have tried the following mands in Nightwatch: -

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

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

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

Share Improve this question edited May 19, 2015 at 15:24 j08691 208k32 gold badges269 silver badges280 bronze badges asked May 19, 2015 at 15:24 Lampy14Lampy14 531 silver badge4 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 5

You could probably 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.

Besides using 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 locate the first button. Reference

本文标签: javascriptCan I select an element by its array position in nightwatchjsStack Overflow