How to handle dynamic changing ID's In XPath?

Question

How to Handle Dynamic Changing IDs In XPath? for example :

//div[@id='post-body-3647323225296998740']/div[1]/form[1]/input[1]

In this xpath id "3647323225296998740" is changing every time when reloading the page.

Is there any way to handle this type of situation in Selenium?

Answer 1

At this situation, We have lots of options-

Option 1: Look for any other attribute which Is not changing every time In that div node like name, class etc. So If this div node has class attribute then we can write xpath as bellow.

//div[@class='post-body entry-content']/div[1]/form[1]/input[1] 

Option 2: We can use absolute xpath (full xpath) where you do not need to give any attribute names In xpath.

/html/body/div[3]/div[2]/div[2]/div[2]/div[2]/div[2]/div[2]/div/div[4]/div[1]/div/div/div/div[1]/div/div/div/div[1]/div[2]/div[1]/form[1]/input[1] 

Option 3: We can use starts-with function. In this xpath's ID attribute, "post-body-" part remains same every time.

 //div[starts-with(@id,'post-body-')]/div[1]/form[1]/input[1] 

Option 4: We can use contains function. Same way you can use contains function as bellow.

 div[contains(@id,'post-body-')]/div[1]/form[1]/input[1]

Answer 2

Use contains() or starts-with() function in XPath:

Solution:

With contains():

//div[contains(@id,'post-body')]/div[1]/form[1]/input[1]

With starts-with():

//div[starts-with(@id,'post-body')]/div[1]/form[1]/input[1]

Answer 3

Use other elements and attributes for partial and combination matches

Generally in these cases of database backed and changing ID's in web element selectors your options are to look for one or more of:

• a higher level selector such as the form name, e.g. //form/input[@type='submit']
• a combo of non-unique selectors that together are unique e.g. //form[@class='new_user']/input[@type='submit']
• a data attribute such as form[@data-form='new-user']//input
• a partial match using starts-with or contains against post-body- e.g.
  //div[starts-with(@id,'post-body-')]/div[1]/form[1]/input[1]

Answer 4

If the id is changing dynamically for a particular xpath then we can use the below xpath functions:

1. contains :xpath Syntax: //html tag[contains(text()/@attribute, 'Expected Value')]

2. Following-Siblings:

   Xpath Syntax : //html tag/following-siblings::html tag ex: //img[@src = 'image2.jpg']/following-siblings::input[@type = 'button']

3. Preceding-Siblings: syntax will be same as following-Siblings

4. The descendant function which is used to identify the grand child node by skipping all

sub, node from the current HTML tag.

Answer 5

The id attribute of the <div> tag is dynamic which will change each time the webpage is accessed. In these cases you need to construct dynamic locator strategies as follows:

• xpath

  //div[starts-with(@id, 'post-body-')]/div/form/input
  

Note: The second <div> is the first/only child of it's parent, the <form> is the first/only child of it's parent, the <input> is the first/only child of it's parent, so you don't require the indexes.

• css-selectors

  div[id^='post-body-'] > div > form > input
  

PS: However a more optimized way would have been to construct the locator strategies based on the attributes of the <input> tag only.

Answer 6

You can use regex in this case, Instead of using XPath you can use some wild cards in CSS Selector to locate the same. Please refer this link.

input[id^='post-body-'][id$='id pattern']

Refer this link for knowing how to use CSS selectors using wildcards.