For the login page of the VPL.ca site (https://vpl.bibliocommons.com/user/login?destination=%2Fuser_dashboard),
the username, pin and login elements can be found not only by name but also by xpath.
This is the HTML code of each element:
USERNAME
<input class="field_username text"
data-js="username_login"
id="user_name_2o8quogf7rlg8keurmdf7ra09p"
name="name"
testid="field_username"
type="text">PIN
<input autocomplete="on"
class="text"
id="user_pin_2o8quogf7rlg8keurmdf7ra09p"
name="user_pin"
testid="field_userpin"
type="password"
value="">LOGIN
<input alt="Log In"
class="btn btn-primary"
data-js="button_login"
name="commit"
testid="button_login"
title="Log In"
type="submit"
value="Log In">All elements have a testid attribute with static values so possible xpath expressions are
USERNAME
//input[@testid = 'field_username']PIN
//input[@testid = 'field_userpin']LOGIN
//input[@testid = 'button_login']Additional expressions can be created for each element:
USERNAME
//input[@class = 'field_username text']
//input[@data-js = 'username_login']
//input[contains(@id, 'user_name')]PIN
//input[contains(@id, 'user_pin')]LOGIN
//input[@data-js = 'button_login']
//input[@value = 'Log In']Any expression can be used if it identifies the element uniquely.
But locating by name is better than using an xpath selector.
lets say that you need to find an element.
you dont know yet how to find it, by id or by name or by xpath.
you look first to the html code of the element in chrome inspector.
if the element has an id attribute with a static value, then you can locate the element by id.
if the element has an name attribute with a static value, then you can locate the element by name.
otherwise, you may have to create an xpath expression (or css) that finds the element.
But how can I know that I need to write that expression (I mean $x("//input[@testid = 'field_username']") in console tab, if I don't know that xpath yet?
if you write in the console $x("//input[@testid = 'field_username']") and you get a result after pressing enter, that means that the xpath matches 1 element.
so you can use the xpath expression in the java code as a locator for finding that element:
By usernameLocator = By.xpath("//input[@testid = 'field_username']"); WebElement username = driver.findElement(usernameLocator);or
WebDriverWait wait = new WebDriverWait(driver, 10); By usernameLocator = By.xpath("//input[@testid = 'field_username']"); WebElement username = wait.until(ExpectedConditions .elementToBeClickable(usernameLocator));Testing an xpath expression in the console tab of Chrome Inspector has 1 purpose only.
To check that the xpath expression works by finding 1 element.
Alex, can you please explain how to find xpath? I wrote in 'console' $x("//input[@testid = 'field_username']")
but I actually don't understand what to do with the result. I also tried on another examples where we use it and I still don't get it.
you are welcome.
Thanks Alex.
On the login page, to get the username field through xpath, type the following in the Console tab of the Chrome Inspector:
$x("//input[@testid = 'field_username']")Alex, can you provide the full text what I should type at the Console for page https://vpl.bibliocommons.com/user/login?destination=%2Fsearch%3Fq%3Djava%26t%3Dsmart%26search_category%3Dkeyword
to get the xpath and analyze the result. Thanks.