Skip to main content

Selenium - CSS Locators

Here are some tips to use CSS locators in your selenium automation projects.
Just go through this XML structure. I going to speak about some locators to get inside elements. 

  1. <div id='testdiv'>
  2. <span><a href='http://sds1'>my Link2</a></span>
  3. <a href='http://sds'>my Link1</a>
  4. <div class='myDiv1'><a href='sds'>my link3</a></div>
  5. <form>
  6. <input class="username"></input>
  7. <input class="alias"></input>
  8. <input type="hidden" name="vid" value="442bbdf4-9226-41cd-801e-0d065a16cc52"><input type="hidden" name="lf_cid" value="LF_c10cf6d6"></form>
  9. </div>

Direct Child:
css=div > a               //This will give you 'My Link1' element


Child or SubChild:
css=div a                   //This will give you 'My Link2' element


ID:
css=div#testdiv         //This will give you 'testdiv' element


Class:
css=div.myDiv1        //This will give you 'myDiv1' element


Next Sibling:
css=form input.username + input   //This will give you 'alias' input under form


Using Attribute values:
  1. css=form input[name='username']  //This will give you input field under form with name='username'
  2. css=input[name='continue'][type='button']  //This will do AND operation

SubStrings:
  1. css=a[id^='id_prefix_']  //Like starts-with
  2. css=a[id$='_id_sufix']   //Like ends-with
  3. css=a[id*='id_pattern']  //Like contains

Using InnerText:
css=a:contains('Log Out')  //Link contains InnerText


Others:
Sometimes you have to find elements using count and type etc. Here you can use nth-child or nth or nth-of-type. Consider this structure...
  1. <ul id="recordlist">
  2. <p>Heading</p>
  3. <li>Cat</li>
  4. <li>Dog</li>
  5. <li>Car</li>
  6. <li>Goat</li>
  7. </ul>

  1. css=ul#recordlist li:nth-child(4)   //This will give you 'Car'. Finds childs with type 'li'
  2. css=ul#recordlist *:nth-child(4)  //This will give you 'Car'. Finds any-type child
  3. css=ul#recordlist li:nth(3)    //This will give you 'Goat'
  4. css=ul#recordlist *:nth(4)    //This will give you 'Goat'
    css=ul#recordlist li:first-child    //This will give you 'Cat'
    css=ul#recordlist li:last-child

Other Common ways to use:
XPath Type : Functions
Always we have chances to meet locator problems while elements with same attributes, ids, names, etc. These kind of scenarios can be solved by using below techniques. Normally we can use 4 ways to identify the elements.
1. String
2. Boolean
3. Number
4. Node-Set
Here they are,
  1. Node-Set: last(), position(), count(), id(), local-name(), namespace-uri(), name()
  2. String: string(), concat(), starts-with(), contains(), substring-before(), substring-after(), substring(), string-length(), normalize-space(), translate()
  3. Boolean: boolean(), not(), true(), false(), lang()
  4. Number: number(), sum(), floor(), ceiling(), round()

Here are some examples.

  1. selenium.click("xpath=(//input[@type='checkbox'])[last()]");
  2. selenium.click("xpath=(//input[@type='submit'])[last()-1]");
  3. selenium.click("xpath=(//input[@type='checkbox'])[position()=2]");

Hope this will you some ideas about CSS locators to use in your projetcs....

Comments

Popular posts from this blog

Change IE Browser ZOOM settings

Lot of UI automation testers could have faced this problem as we could change the zoom settings while operating manually for our convenience and forgot to reset to 100%.
But our QTP and some other related tools would operate the browser perfectly if browser zoom is 100%. So wee need to change the zoom before start to run the scripts. Its better to have a code snippet in our framework to change this zoom setting right?
Here we go...

1. We can simply change the Registry values before Invoking IE
Function ChangeRegistry Dim objShell Set objShell = CreateObject("WScript.Shell")  objShell.RegWrite "HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Zoom\ZoomFactor", "100000", "REG_DWORD" Set objShell = Nothing EndFunction This option is very useful. But in real time, lot of customers could have restricted write access to windows registry. So we can try other options.

2. Use IE COM object and Change Settings
Function ChangeIEZoom Dim intZoomLevel, objIE  intZoo…

QTP - Object Identification - Prerequesties

While starting a new project or proof of concept or after new QTP installation, we would face the issue in identifying objects as QTP built objects like WinList, WebEdit, etc.; instead everything will be identified as WinObject.

Here are some steps to ensure you did the environment setup RIGHT before start automating.
Did you enabled required Add-ins only while launchingDid you selected "Record >> Record and Run Settings" - This should be based on what type of application you are working with
Windows app - Windows >> Record and run test on any windows applications. Web app - Web >> Record and run test on any open browser.
Did you tried to launch UFT/QTP and then AUT.If its web, ensure browser zoom level set to 100%Try disabling the protected mode in IE for web.Launch UFT and AUT using RUN AS ADMINISTRATORAlso see the Object Identification Methods if you are interested.

Run JavaScript from QTP

Yeah, You can run your pure JavaScript from QTP using RunScript method. Lot of times, we are in need of firing events or simulating actions on web page which is not supported by QTP. At that time, you can use your direct DOM methods and directly execute your script on the web page from QTP like,
Dim MyPage, SearchBox Set MyPage = Browser("title:=Google").Page("title:=Google") Set SearchBox = MyPage.RunScript("document.getElementsByName('q')(0);") SearchBox.Value="testing"
'if objects available in frames, Set SearchBox = MyPage.RunScript("document.frames(4).document.getElementsByName('q')(0);")
'OR
Set objFrame = Browser("title:=Google").Page("title:=Google").Frame("title:=something")
objFrame.RunScript("document.getElementsByName('q')(0);") Also, you can execute by obtaining actual browser window object if you have IE app like, Dim IEApp Set IEApp = CreateObject("Internet…