𝐗𝐏𝐚𝐭𝐡 & 𝐂𝐒𝐒 𝐒𝐞𝐥𝐞𝐜𝐭𝐨𝐫 𝐓𝐞𝐜𝐡𝐧𝐢𝐪𝐮𝐞𝐬 𝐟𝐨𝐫 𝐀𝐮𝐭𝐨𝐦𝐚𝐭𝐢𝐨𝐧 𝐓𝐞𝐬𝐭𝐢𝐧𝐠

 

𝐗𝐏𝐚𝐭𝐡 & 𝐂𝐒𝐒 𝐒𝐞𝐥𝐞𝐜𝐭𝐨𝐫 𝐓𝐞𝐜𝐡𝐧𝐢𝐪𝐮𝐞𝐬 𝐟𝐨𝐫 𝐀𝐮𝐭𝐨𝐦𝐚𝐭𝐢𝐨𝐧 𝐓𝐞𝐬𝐭𝐢𝐧𝐠

❇️ XPath Functions & Axes

- `text()`– Matches elements based on exact text.
`//div[text()='login_id']`

- `normalize-space()`– Trims extra spaces before matching text.
`//div[normalize-space()='login test']`

- `contains()`– Finds elements containing a substring.
`//input[contains(@id, 'username')]`

- `starts-with()`– Selects elements whose attribute starts with a string.
`//button[starts-with(@class, 'btn')]`

- `position()`– Retrieves elements based on their position in a set.
`(//ul[@class='menu']/li)[position()=2]`

- `last()`– Selects the last element in a node set.
`(//table//tr)[last()]`

- `count()`– Counts the number of matching elements.
`count(//input[@type='checkbox'])`

- `ancestor::`– Finds all ancestors of an element.
`//a[text()='Logout']/ancestor::div`

- `following-sibling::`– Selects all following siblings.
`//label[text()='Email']/following-sibling::input`

- `parent::`– Selects the immediate parent element.
`//span[text()='Username']/parent::div`

- `descendant::`– Finds all descendants of an element.
`//div[@class='container']/descendant::input`

- `translate()`– Normalizes text by replacing or removing characters.
`//input[contains(translate(@id, 'ABCDEFGHIJKLMNOPQRSTUVWXYZ', 'abcdefghijklmnopqrstuvwxyz'),'username')]`

❇️ CSS Selector Techniques

- Tag & Attribute Selector– Matches an element with a specific attribute.
`input[id='username']`

- Class Selector– Matches elements with a specific class.
`.btn-primary`

- ID Selector– Selects an element with a unique ID.
`hashtag#login-button`

- Attribute Contains (`*=`)– Finds elements where an attribute contains a substring.
`input[id*='user']`

- Attribute Starts With (`^=`)– Matches elements where an attribute starts with a string.
`button[class^='btn']`

- Attribute Ends With (`$=`)– Matches elements where an attribute ends with a string.
`img[src$='.png']`

- Direct Child Selector (`>`)– Selects a direct child of an element.
`div > input`

- General Sibling Selector (`~`)– Selects all siblings after a specific element.
`label ~ input`

- Adjacent Sibling Selector (`+`)– Selects the immediate next sibling.
`label + input`

- Nth-Child Selector (`nth-child(n)`)– Selects the nth child of an element.
`ul.menu li:nth-child(2)`

- First & Last Child Selector– Selects the first or last child of a parent element.
`ul.menu li:first-child`
`ul.menu li:last-child`

- Not Selector (`:not()`)– Excludes elements that match a certain condition.
`input:not([type='submit'])`