CODEWITHSUNDEEP
selenium-webdriver
LBoyNewbie
LBoyNewbie

Reputation: 45

How to create my own xpath on website- Selenium

I'm writing a small application to go on to twitter.com select the login button and then enter username and password.

I've been able to inspect the log in button and copy the XPath from chrome but I've been unsuccessful in create my own XPath from the information given. The XPath used when copied does work but it doesn't look tidy in my code therefore I'm keen to write my own.

WebDriver driver = new ChromeDriver();
driver.get("http://www.twitter.com");
driver.findElement(By.xpath("//*[@id=\"react-root\"]/div/div/div/main/div/div/div[1]/div[1]/div/div[3]/a[2]/div")).click();

Below is what is given when I inspect the log in button.

<div dir="auto" class="css-901oao r-1awozwy r-13gxpu9 r-6koalj r-18u37iz r-16y2uox r-1qd0xha r-a023e6 r-b88u0q r-1777fci r-ad9z0x r-dnmrzs r-bcqeeo r-q4m81j r-qvutc0">
    <span class="css-901oao css-16my406 css-bfa6kz r-poiln3 r-bcqeeo r-qvutc0">
        <span class="css-901oao css-16my406 r-poiln3 r-bcqeeo r-qvutc0">Log in</span>
    </span>
</div>

Upvotes: 0

Views: 263

Answers (2)

SiKing
SiKing

Reputation: 10329

I'm not sure what answer you are looking for so here are several possibilities:

  1. Just give me the codez!
    A: Try //a[@data-testid='loginButton']

  2. How do I read the source of a page so that I can craft proper XPath?
    A: That comes from experience. As a start, open your devtools and hover around with your mouse to see what element highlights what on the page. Read carefully through the attributes.

  3. Where do I learn proper XPath?
    A: Search on the Internet for some tutorials. Personally I started with this one, and then build up from there.

Upvotes: 0

art_architect
art_architect

Reputation: 929

You can identify the login button based on his parent unique attributes.

Then using the xpath axe /descendant, to selects all the descendants (children, grandchildren, etc.) of the current node, you can navigate down to the span that has the text Log in

 driver.findElement(By.xpath("//a[@data-testid='loginButton']/descendant::span[text()='Log in']")).click();

Or

 driver.findElement(By.xpath("//a[@href='/login']/descendant::span[text()='Log in']")).click();

If you want to study the xpath/css selector have a look here: https://devhints.io/xpath

Upvotes: 1

Related Questions