How do I use a combination of attributes to select a button in Selenium?

Question

I'm trying to get selenium to select a simple button that says next. I've tried XPath, CSS, and linktext and it still will not select it for me saying it cannot locate the element. Here is the code.

Edit: The button is inside an i-frame.

<button class="btn-next" href="#" data-next="true">Next</button>

Not sure why it cannot locate the element, this is the xpath that came out from it but still It cannot locate it.

findElement(By.Xpath(".//*[@id='step1']/button"))

It seems I was missing some of the HTML. Here is the entire part.

div class="form-container">
<form data-capture="true" data-ajax="false" method="post">
<div id="view1" class="view active_view" data-view-order="10" style="display: none;">
<div id="step1">
<ul class="btns">
<div class="clear"/>
<h1>I'm a</h1>
<h2>
<button class="btn-next" href="#" data-next="true">Next</button>

• Michael Durrant: Did you grab that xpath before or after the action that led you to that button, i.e. any dynamic page stuff, ajax, animations, single page form, etc. ?
• Christian: Nope went straight from opening browser to this page.

Answer 1

The HTML you show has no ID (it's not the href that has a # btw, that's different).

so

findElement(By.Xpath(".//*[@id='step1']/button"))` 

will not work based on what you posted.

You could use:

Css is always my first go to for readability:
findElement(By.Css(".btn-next[data-next='true']"))

or by Class:
findElement(By.Class("btn-next"))

or by XPath
findElement(By.XPath("//*[@data-next]"))

or your issue may be that multiple exist and you need multiple qualifiers:

by Xpath example:
findElement(By.XPath("//*[@data-next][@class='btn-next']"))

etc.

Based on your new update with the HTML you could use:

By.Css("form div#step1 button.btn-next")

if it exists twice you might need:

By.Css("form div#step1 ul.buttons button.btn-next")

or

By.Css("form div#step1 ul.buttons button.btn-next:first-of-type")

You might need to put the first-of-type on the form, the div, the ul, etc.

as you can see the pattern with css is to have the elements and any qualifiers in a short compact format. it depends on the rest of the page and if it has the stuff repeated

• Christian: Unfortunately none of the above worked. I do believe it exists more than twice as the steps make it go to 6, ex fill one part out hit next. fill the box part out hit next. No matter what code I put to find the next button though it comes back as cannot find element.
• Michael Durrant: try the first_of_type qualifier that I've added above on the last entry.
• Michael Durrant: and you tried with the added ul.buttons right ?
• Christian: I did, it still gives me an error of not able to find the element.
• Christian: I just realized that the button is inside of an iframe, Not sure if that helps.

Answer 2

Try this xpath -

"//button[@class='btn-next'][.='Next']"

Is the button visible when the selector is fired? If not first verify with ExpectedConditions if it is visible or clickable.

Answer 3

I actually found out why the above was not working.

The issue is that it was inside aniframe.

<iframe id="index_reg_iframe" src="/main.php? a=user.register_iframe_fp&amp;no_header=1&amp;btn_bg_next=447DC3&amp;btn_ bg_next_hover=396ba8&amp;id=noadvert&amp;prg=1&amp;tour=1&amp;pg=1" marginwidth="0" marginheight="0" hspace="0" vspace="0" scrolling="no" allowtransparency="true" height="450" frameborder="0" width="410"></iframe>

The following command worked for me.

driver.switchTo().frame("index_reg_iframe").findElement(By.xpath(".//*[@id='step1']/button")).click();

Thank you guys for brainstorming with me.

Answer 4

Is there a reason why you do not choose findElement(By.Class("btn-next")) Without being able to see the whole DOM it is hard to say why exactly your Path does not work.