Java POM: 10-WebElement Selectors

WebElement Selectors Rosetta Stone

Source: https://www.red-gate.com/simple-talk/dotnet/.net-framework/xpath,-css,-dom-and-selenium-the-rosetta-stone/

PDF

http://unityconstruct.org/media/doc/selenium/XPATH_Locators_QuickRef3.pdf

Images

 


WallChart Validation Test Case

Use with this SamplePage.html

 

wallchart validation test case
verifyText //title Wallchart Validation Suite
verifyText css=title Wallchart Validation Suite
verifyText document.getElementsByTagName('title')[0] Wallchart Validation Suite
verifyText xpath=(//h3)[2] Section B
verifyText document.getElementsByTagName('h3')[1] Section B
verifyElementPresent //img  
verifyElementPresent css=img  
verifyElementPresent document.images[0]  
verifyText //a[@name] Section A
verifyText css=a[name] Section A
verifyText //a[@name='sectionB'] Section B
verifyText css=a[name='sectionB'] Section B
verifyText //font[contains(@color, 're')] Green
verifyText css=font[color*='re'] Green
verifyText //font[starts-with(@color, 'gre')] Green
verifyText css=font[color^='gre'] Green
verifyText //font[substring(@color, string-length(@color) - string-length('een')+1)='een'] Green
verifyText css=font[color$='een'] Green
verifyText //span[contains(concat(' ', @customAttr, ' '), ' two ')] span before first
verifyText css=span[customAttr~='two'] span before first
verifyText //li[@id='123'] shearwater
verifyText css=li#123 shearwater
verifyText //*[@id='123'] shearwater
verifyText css=#123 shearwater
verifyText document.getElementById('123') shearwater
verifyText id=123 shearwater
verifyText //a[@name='sectionA'] Section A
verifyText css=a[name='sectionA'] Section A
verifyText //*[@name='sectionB'] Section B
verifyText css=*[name='sectionB'] Section B
verifyText document.getElementsByName('sectionB')[0] Section B
verifyText name=sectionB Section B
verifyText //*[@id='stuff' or @name='stuff'] Green-and-Blue
verifyText stuff Green-and-Blue
verifyElementPresent //*[@name='continue'][2]  
verifyElementPresent css=[name='continue']:nth-child(5)  
verifyElementPresent name=continue index=1  
verifyElementPresent //*[@name='continue'][@value='Clear']  
verifyElementPresent css=[name='continue'][value='Clear']  
verifyElementPresent name=continue value=Clear  
verifyText //*[@lang='fr' or starts-with(@lang, concat('fr', '-'))] Section B
verifyText css=*[lang|=fr] Section B
verifyText //*[contains(concat(' ', @class, ' '), ' first ')] First paragraph on sales.
verifyText css=.first First paragraph on sales.
verifyText document.getElementsByClassName('first')[0] First paragraph on sales.
verifyText //p[contains(concat(' ', @class, ' '), ' first ')] First paragraph on sales.
verifyText css=p.first First paragraph on sales.
verifyText //*[.='Section B'] Section B
verifyText //li[contains(text(), 'b')] albatross
verifyText css=li:contains('b') albatross
verifyText //a my link
verifyText css=a my link
verifyText document.links[0] my link
verifyText //a[.='my link'] my link
verifyText link=my link my link
verifyText //a[contains(.,'my')] my link
verifyText css=a:contains('my') my link
verifyText //a[@href='stuff.htm'] Next page
verifyText css=a[href='stuff.htm'] Next page
verifyText //span/following-sibling::p First paragraph on sales.
verifyText css=span~p First paragraph on sales.
verifyText //span/following-sibling::*[1][name()='p'] Fifth and last paragraph on sales.
verifyText css=span+p Fifth and last paragraph on sales.
verifyText //span/following-sibling::*[2][name()='p'] First paragraph on sales.
verifyText css=span + * + p First paragraph on sales.
verifyText //span/following-sibling::* bold text
verifyText css=span + * bold text
verifyText document.getElementById('textSection').getElementsByTagName('span')[0].nextSibling.nextSibling bold text
verifyText //p/preceding-sibling::span span before first
verifyText //p/preceding-sibling::*[1][name()='span'] span between 4th and 5th
verifyText //p/preceding-sibling::*[2][name()='span'] span before first
verifyText //p/preceding-sibling::*[1] bold text
verifyText document.getElementById('textSection').getElementsByTagName('p')[0].previousSibling.previousSibling bold text
verifyText //*[@id='textSection']/*[1] span before first
verifyText css=#textSection *:first-child span before first
verifyText document.getElementById('stuff').firstChild Green
verifyText //*[@id='textSection']/p[1] First paragraph on sales.
verifyText css=#textSection p First paragraph on sales.
verifyText document.getElementsByTagName('font')[0] Green
verifyText //*[@id='textSection']/*[last()] Fifth and last paragraph on sales.
verifyText css=#textSection *:last-child Fifth and last paragraph on sales.
verifyText document.getElementById('stuff').lastChild Blue
verifyText //*[@id='textSection']/p[last()] Fifth and last paragraph on sales.
verifyText document.getElementById('stuff').getElementsByTagName('font')[document.getElementById('stuff').getElementsByTagName('font').length-1] Blue
verifyText //p[2] Second paragraph on sales.
verifyText //p/following-sibling::p Second paragraph on sales.
verifyText document.getElementsByTagName('font')[1] Blue
verifyText //*[3][name()='p'] First paragraph on sales.
verifyText css=p:nth-child(3) First paragraph on sales.
verifyText //p[last()-1] Fourth paragraph: sales.
verifyText document.getElementById('stuff').getElementsByTagName('font')[document.getElementById('stuff').getElementsByTagName('font').length-2] Green
verifyText //*[@id='textSection']//*[last()-1][name()='span'] span between 4th and 5th
verifyText //ul[li and not( *[not(self::li)])] petrel platypus albatross shearwater
verifyText //span[.='-and-']/.. Green-and-Blue
verifyText document.getElementById('stuff').getElementsByTagName('span')[0].parentNode Green-and-Blue
verifyText //*[@id='TestTable']/tbody/tr/td/span/b Complex
verifyText css=#TestTable > tbody > tr > td > span > b Complex
verifyText document.getElementById('TestTable').getElementsByTagName('tbody')[0].getElementsByTagName('tr')[2].getElementsByTagName('td')[0].getElementsByTagName('span')[0].getElementsByTagName('b')[0] Complex
verifyText //*[@id='TestTable']//b Complex
verifyText css=#TestTable b Complex
verifyText document.getElementById('TestTable').getElementsByTagName('b')[0] Complex
verifyElementPresent //img[count(*)=0]  
verifyElementPresent css=img:empty  
verifyText //h3[count(*)=1] Section A
verifyText //a[count(preceding-sibling::*)+count(following-sibling::*)=0] my link
verifyText css=a:only-child my link
verifyText //div[@id='textSection']/b[count(../b)=1] bold text
verifyText //p[position() mod 3 = 1 + 1] Second paragraph on sales.
verifyText css=p:nth-child(3n+1) Second paragraph on sales.
verifyText //*[@id='TestTable']//tr[3]//td[2] my link
verifyTable //*[@id='TestTable'].2.1 my link
verifyText css=#TestTable tr:nth-child(3) td:nth-child(2) my link
verifyTable css=table#TestTable.2.1 my link
verifyText document.getElementById('TestTable').getElementsByTagName('tr')[2].getElementsByTagName('td')[1] my link
verifyTable document.getElementById('TestTable').2.1 my link
verifyText //td[preceding-sibling::td='Complex row'] my link
verifyText //td[preceding-sibling::td[contains(.,'row')]] Simple value
verifyText css=td:contains('row') ~ td Simple value
verifyText //div[@id='nonId'] | //li[@id='123'] shearwater
verifyText css=div#nonId,li#123 shearwater
verifyText //div[@id='stuff' or @id='123'] Green-and-Blue
verifyText css=div#stuff,div#123 Green-and-Blue
verifyElementPresent //*[@disabled]  
verifyElementPresent css=*:disabled  
verifyElementPresent //input[not(@disabled)]  
verifyElementPresent css=input:enabled  
verifyElementPresent //*[@checked]  
verifyElementPresent css=input:checked  

 

getPageSource, innerHTML, outerHTML