无法在selenium webdriver中找到元素（用户名和密码）

Question

I can't seem to figure this out. I have tried using xpath, cssselector and executeScript but no luck. I am trying to access username and password but my code can't find it.

I am new to webdriver and jquery

subset of things i've tried. All of these locate 'login' but not username or password

WebElement username = driver.findElement("username')
WebElement username = driver.findElement(By.xpath("//div[@class='forms']//descendant::input[@name='username']"));
js.executeScript("$('div.input').get(0)");

I have tried several regular expressions in xpath, cssselector.

<div class="forms">
    <form name="formLogin" method="post" action="">
        <div>Please sign in:</div>
        <div style="height:5px"> </div>
        <ul>
            <li class="nameField">
                <div>
                    <input class="hint_color" type="text" style="display: none;" value="" tabindex="1">
                    <input id="username" type="text" tabindex="1" title="USER.NAME" value="username"       name="username" autocomplete="off">
                </div>
                <div style="height:5px;"> </div>
                <div>
            </li>
            <li class="pwdField">
                <div>
                    <input class="hint_color" type="text" style="display: none;" value="" tabindex="2">
                    <input id="username" type="password" title="PASSWORD" tabindex="2" value="password" name="username" autocomplete="off">
                </div>
                <div style="height:5px"> </div>
                <div>
                    <div style="height:5px"> </div>
                    <a href="">Forgot Username/Password</a>
                </div>
            </li>
            <li class="submitField">
                <input id="login" type="submit" value="Log In" name="login">
            </li>
        </ul>
    </form>

Your help will be appreciated.

Answer 1

In your HTML code you have two tags id=username and two tags name=username. That's wrong and webdriver can't distinguish between those elements.

So if you can, please change those ids (id=username // id=password), but if you can't do that, with Selenium IDE record the script and try to find those elements with XPATH.

Sorry my english.

Answer 2

pls try by changing the xpath as

Option:1 //div[@class='forms']//descendant::input[@value='username']

Option 2: //input[@value='username']

Answer 3

To be Handy on Locators, their types and how to pick same locator in different ways, you should use initially Selenium Builder or Selenium IDE (firefox Addon)

record the event you want, change the locator using available ways under target dropdown. This will help you to find the exact locator. I hope by this way, you can figure out what you are missing.

Answer 4

What is this? For both fields ( username and password ), elements id and name is username only. If that is wrong you can try the following command:

WebElement username = driver.findElement(By.id("username"));

Whatever action you want to perform you can do something like this:

username.click();

or

username.sendKeys("abc@gmail.com");

Answer 5

There are no attributes of the username and password elements themselves which you use to distinguish them, because they have the same id and the same class. That's bad html coding; but even so, it is possible to work around this because the li elements have different classes nameField and pwdField . The most concise and efficient way is to use CSS selectors:

li.nameField input#username
li.pwdField input#username

Using these locators, the webdriver code is:

WebElement username = driver.findElement(By.cssSelector("li.nameField input#username"));
WebElement password = driver.findElement(By.cssSelector("li.pwdField input#username"));

Or if you prefer, you can use XPath equivalents:

.//li[@class='nameField']//input[@id='username']
.//li[@class='pwdField']//input[@id='username']

PS All locators verified using Firepath in firefox.

Answer 6

The way, you have written is wrong.

WebElement username = driver.findElement("username')

Instead of that try this:

WebElement username = driver.findElement(By.cssSelector(".nameField>div>input[id='username']"));
username.sendKeys("abcdefg");

You can write more than one CssSelector for "username" locator. Once you are done with your xpath or CssSelector , please cross check your locators with FirePath .