-1

I need to find the xpath of the help button for my automation tests.
Here is the HTML element:

<button data-component-id="nokia-react-components-iconbutton" tabindex="0" class="ActionComponent__ActionComponentDiv-sc-st3635-0 iPWdbh IconButton__StyledButton-sc-1dtic80-0 biWRLS NSPAppBanner__HelpButton-sc-761pc0-3 dvtRqt" mode="dark" type="button" xpath="1"></button>
<svg class="HelpOutline__NSPSvgIcon-sc-7y3t1-0 geSzXs HelpWidget__StyledHelp-sc-1fdz44x-0 cCTbqa" viewBox="0 0 24 24" xpath="1">
</svg>

I tried with this XPath, but it didn't work:

//*[@data-component-id="nokia-react-components-iconbutton"]//svg[contains(@class,"HelpOutline")]
JaSON
  • 4,843
  • 2
  • 8
  • 15
Fatma Debbech
  • 1
  • 2

3 Answers3

0

If you want to select the <button> element before the <svg>, try the following XPath:

//*[@data-component-id="nokia-react-components-iconbutton" and following-sibling::svg[1][contains(@class,"HelpOutline")]]
zx485
  • 28,498
  • 28
  • 50
  • 59
0

The <button> element itself should be clickable and both the locator strategies should work:

  • css_selector:

    button[class*='HelpButton'][data-component-id='nokia-react-components-iconbutton']

  • xpath:

    //button[@data-component-id='nokia-react-components-iconbutton' and contains(@class, 'HelpButton')]

However, as the element is a React element so to click on the element you need to induce WebDriverWait for the element to be clickable and you can use either of the following locator strategies:

  • Using Java and xpath:

    new WebDriverWait(driver, Duration.ofSeconds(10)).until(ExpectedConditions.elementToBeClickable(By.xpath("//button[@data-component-id='nokia-react-components-iconbutton' and contains(@class, 'HelpButton')]"))).click();

  • Using Python and css_selector:

    WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "button[class*='HelpButton'][data-component-id='nokia-react-components-iconbutton']"))).click()

  • Note: For Python clients you have to add the following imports :

    from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC
undetected Selenium
  • 183,867
  • 41
  • 278
  • 352
-2

Try this XPath to locate button:

'//*[name()="svg" and contains(@class,"HelpOutline")]/preceding-sibling::button'

Note that svg tag is not a part of standard HTML-namespace, so //svg won't work. You need to use //*[name()="svg"] instead

JaSON
  • 4,843
  • 2
  • 8
  • 15