How to write Dynamic XPath | Stable XPath for dynamic Web Elements | SelectorsHub | XPath

hello friend this is sanjay kumar creator of selector sub and profile dynamic xpath this is a very important term in automation and actually we all are struggling to solve this problem a problem like locators problem and expert problems through dynamic expert so basically it is an uh kind of you can consider an x path which will be like stable and kind of like will not change immediately for those kind of element whose attribute or uh was a i mean position or something got changed when we refresh the page so let's see what all different kinds of scenarios could be there one could be when you inspect any element and when you look at the dom and you feel that it could be dynamic for an example here like this class looks dynamic a4b ic so this is like here it it is like alphanumeric value so we feel that if we will refresh the page this will change right like if you open selector sub here uh let me just refresh the page here if you open uh selector sub so it will show you that it is a kind of like dynamic uh element like this one if we inspect this element and you see here this looks like a dynamic a4b ic and here it used to highlight as well like class looks dynamic uncheck the class checkbox or delete the class attribute for attribute box so this could be one case but let me copy this value and refresh the page and paste this export value this didn't didn't get changed so here the attribute was looking dynamic but it didn't change so we can like in this kind of situation if this is your application then you must be knowing which attribute is not going to change so you can write the x path based on that attribute and you can ignore this one there could be some elements for which attribute used to change in those scenarios we literally have to take care of those things let me show you that this kind of dynamic element where attribute value will change on when you will refresh the page so uh like this here you see that name is equal to name a to b e this is also alphanumeric value but how we will how we can say that this is a like dynamic or static because we have seen there here one scenarios it depends application to application how that application has been developed so this class was not dynamic it is a static though it is looking like numeric uh dynamic value similarly here name also looks like uh dynamic but do we know that whether it is dynamic or not let's do the practical thing copy this x path value here with the name and refresh the page and see if this name attribute change or not so when we will refresh the page now let's paste the xpath which we have copied last time and hit enter it is showing zero matching node this is the new x path for this element like if you inspect let's say we'll inspect this element here or you inspect new element let me show this one copy this x bar hit enter so you see that this 0 7 6 c this x path is working right now okay let's copy this x bar delete this one from here and refresh the page paste that value which we ever copied now you see that it's not working so this is the kind of like dynamic expo uh dynamic attribute this and these elements having dynamic attribute so here we can we should not use x bar we should we will have to write x path based on some other element respective element or use some other attribute so selector sub suggest that this looks like dynamic so name looks dynamic name attributes uncheck the name so here you uncheck this one and now it is generating with some other attributes which is like pretty much stable so if you will copy this x path from here let's copy this and if we paste it here you see that one matching node now if we refresh the page and again hit the enter you see that this export is still working so this case like we we are able to generate the dynamic x path through selectors hub there could be one more thing this can be done in another way like here you want to for this element we want to write an x path based on this label name so this is even much better approach of course slack dresser will give you x path dynamic xpath which you can use it in your script but in case like if you want to uh write an x path with respect to some other with respect to some element quickly you can do very quickly let's see how can we do that so here we want to write an x path for this element with respect to full name this label so first let's write for this one full name and then we'll find the common parent for both and then we'll write the x path of this element so what will be the x bar for full name here just start typing td full name so this is for full name and we can take the parent here so take this parent tr this is a parent and now from this one we want this input so inside this it it is so double power less let's say we want this one so double forward slash input you can hit enter and we got the x path for this element so we have written the x bar uh so this is pretty much dynamic x path now which will basically this is a more robust and stable x path which will not change for this element let's copy this x path let's save this x path you can save it as well here and remove from here refresh the page even if you close this one and come back and open it again we can fetch that x path which we have written from here you click and press enter you see that this x part is working so you have seen that we can write and generate the stable and you can say the dynamic x path through selector sub easily and you will have to understand like because apart from you no one else knows better whether the attribute whether those attribute values are dynamic or not because in the word there is no algorithm which can say that abc123 is dynamic or static because it could be static for you and it would be dynamic for me right so depends up to application to application like i showed you here that this looks pretty much dynamic every attribute here looks like dynamic but when you refresh the page you find that those are not dynamic those are static so we can like those who are dynam those who are automating this website google.com they can directly use like class attribute and easily it will work no matter how many time you refresh the page this class will always be a static there but here those were dying uh trying to write the automation for this page then uh here they cannot use the name attribute because name is pretty much dynamic here for these fields so you will have to uh write the x path like with respect to some element or you can directly just uncheck the name attribute here and select yourself will do rest for you like if you inspect this element you see that selectors have generated with without name attribute if you check that then it will generate with name but it will suggest you that name looks dynamic you uncheck the name or if you feel that it is static you can continue so it will help you with in both the scenarios so uh so this is like really helpful and it uh hope this will help you a lot while you are writing the automation script because uh this is like these scenarios are very important and this is where the uh like your intelligence and your uh i mean your capability is required to understand whether attributes are dynamic or static and accordingly you will have to decide which attribute you should choose like for an example here this is one example on amazon so here you see that class looks dynamic here again so for this element whether you should uh because such kind of elements are like very much dynamic here the price value this used to change a lot because uh if i will refresh the page might this this price might have changed so here in this case you see that selectors are generally used to it you should generate the best possible xpath by default but in case it if it goes and generate with here the text value then you can uncheck the text and it will generate without text to it so you see here it is already generating with id i mean if id is there of course i will i or i will always suggest that you go with the id one and directly choose the id attribute id locators but in case like if id is also dynamics there are some applications like react application they generally have the dynamic id so in that case like you can uncheck the id checkbox it will generate with something else so uh you will have to take care of like when you are writing x path for such kind of elements you will have to really take care that with what attribute your x path is generating or with what attribute you have written the x path and you will have to consider that uh you should not use text in this kind of scenarios where price is changing like every frequent i mean every minute if i refresh the page this might have changed or if without refreshing as well that this price could change right if it is dynamic so yeah so you will have to decide and take care of those things likewise uh there could be some kind of uh applications where you can consider those elements as well as dynamic like where when you mouse over on those elements and then you're not able to inspect those elements so in that case those elements also consider as like dynamic elements let me show you this one here that means you can say that those are dynamic elements when you like in goeivo.com when you type on this box something you see that some drop-downs comes here and if you try to inspect these elements they disappear so basically these are dynamic elements which used to appear in the ui when you do some actions so how to write the selectors for such elements because these elements can't be inspected so these are like dynamic drop down values or you can say dynamic select drop down and uh sub menu menu options which used to appear and they immediately disappear as well so in this case like in this kind of situation selector sub has amazing feature debugger feature you just turn on this feature and then within five seconds make that appear again so then it you would be able to like selectors of what selectors of builders it will hold that particular element in the ui and now you would be able to inspect this element here and you would be able to generate the selector so you see that selectors is generated for these elements for these dynamic elements drop down options here you can also check this and then uh you can as well as you can write so better you can directly take this one so here you can inspect and uh like x path as well all the possible selectors are also generated so this way you would be able to handle such kind of dynamic elements there are some kind of like drop-down elements if you not able to inspect them those drop down elements here like on myntra.com if you're not able to inspect such kind of elements uh certain drop downs are there in many website which used to disappear immediately so those kind for those kind of elements you can you have the option in selectors of directly you can copy the selectors from the context menu like just by right click on this and here you can customize the context menu like which all options you want in the context menu so that also you can do so here if you right click you will get all those options here like you can copy the context menu value directly from here as well as on like flip card as well you used to have a lot of like dynamic drop downs which uh which we not be able to inspect they immediately disappear so that also you can uh check out like like these kind of drop downs which if you right click and inspect this element here you see that it will not appear in uh dom but when you hover and then you inspect that element then it it will appear so in this kind of situation where you can uh like you copy the value and then paste the value here and select this up so like here let me paste it in select yourself so you see it is showing zero matching node but if you hover like let me show you here it is showing zero matching node but you if you hover on this and now press enter because this fat cert we have copied for this one so now we have made it visible so it is now it is available in the dom now if you press enter in selectors up it will show one matching node but if you again hover out remove your hover from men and press enter then it will not show so these are some kind of dynamic elements you can say again not just like dynamic element which has the uh attribute dynamic but yeah some people consider them as these as well like which uh disappear from the dom or not able to we are not able to inspect them so those also like consider invisible element from the drop down so i have showed you the multiple ways to how to handle those kind of scenarios how to handle those kind of elements and how you can write the x path stable x path for them these are the really important scenarios where you will have to use your uh like iq to decide which attribute is static and in like if you will have to write the x path with respect to some other element then you do that hope this will help you and this is the like really really important uh thing in web automation where we used to waste almost 50 to 60 time if you have written a stable constant dynamic xpath for your script in your automation script that means you have done a very great job and you have because this is where the lot of maintenance used to go because if it is not robust and stable expert your script may break tomorrow and you might have to fix that again and then again it will require a lot of effort so uh hope this will help you to write these stable selectors for your automation script and it will save a lot of time for you and your team so with that thank you so much and if you like the video please uh like share and subscribe to the channel for more upcoming updates and to learn all about xpath and uh all the upcoming innovations on on select yourself and i would really request you like if you uh loving this lectures up please feel free to uh write article blogs on it please share with community and colleagues and uh if you are someone who has the youtube channel feel free to make the tutorial on it uh share the word with others and help them people to learn because it helps in many scenarios like if you do something wrong it will help you this error message shadow dom svg it's help a lot in many ways help a lot in learning and if you find it useful in your job and making some money out of it saving time please be a patron support selector hub you can buy me a coffee as well and if you have have any question join on join selectors of telegram group here and feel free to ask any questions anything and if you have any suggestion do reach out to me and if you love slackers up please give a five star rating on browser store this will really help to spread the word about selector sub and it will really motivate me to work hard for you guys so that thank you thank you so much

Channel: SelectorsHub - The XPathTool

Views: 1,826

Keywords: selectorshub, xpath, xpathtool, xpathfinder, xpathhelper, relativexpath, chropath, selenium, locators, css selectors, selectors, cypress, automationtool, webdriverio, playwright, testing, softwaretesting, dynamicxpath, dynamiclocator, xpathinterview, stablexpath

Id: N9add67AKCQ

Length: 16min 59sec (1019 seconds)

Published: Wed May 26 2021