Selenium Webdriver - Locating element inside form

Question

I am trying to write a webdriver C# code that checks for elements in a site. However, the site is a single page website with an embedded form. The form contents changes when you click Next. So I am having a hard time figuring out how to find elements in the next form. I have had this work several times with a non single page. I know the issue is that my xpath is not finding the element I am looking for because it is inside a form

This is my xpath:

private By labelPageHeader = By.XPath("//form[1]/div[4]/label[text()='Welcome to the second form']");
public bool IsNewForm()
{
    return Elements.CheckElementIsVisible(_driver, labelPageHeader );
}

When I do that I get error:

Could not load page within the designated timeout period

That usually works when I am not working in a single page site.

Here is a snippet of the HTML. I am trying to hit the label inside id="alligator" inside the form:

<form name="form1" method="post" action="./form.aspx?AspxAutoDetectCookieSupport=1" onsubmit="javascript:return WebForm_OnSubmit();" id="form1">
    <div id="Step3" class="step">
        <div id="alligator" class="input">

            <label for="alligator">Welcome to the second form
                <abbr title="This field is required">*</abbr></label>                                  

        </div>
        <input type="hidden" class="link" value="Step4" />
    </div>
    <!-- step3 ends -->

Answer 1

Rather than trying with an xpath like form[1]/div[4], try to be more specific like

//form[@id='form1']//div[@id='alligator']/label

Searching with the exact text in the element can be your personal preference.

And the xpath can be used as:

private By labelPageHeader = By.XPath("//form[@id='form1']//div[@id='alligator']/label");

public bool IsNewForm()
{
    return Elements.CheckElementIsVisible(_driver, labelPageHeader );
}

Answer 2

The problem it seems is that you are using XPath. You should use id.

From the snippet of HTML code you provided I see that the form does not have its own id. I suggest you give the form a id.

Then do your thing manually (that is do what you want to automate manually) until you go to the next page. Then you inspect the element you are trying to reach using the browser (e.g. on firefox right click on element and choose inspect element). Some HTML code will be displayed. This is the code that your browser "sees". From this code note the id given for that element it could be in the form of 'formId:elementID'. Use this ID to point to the element.

This should work.