CSS attribute and pseudo-class selectors in Selenium Java - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is a CSS attribute selector?

A CSS attribute selector matches elements based on the presence or value of an attribute. For example, [type='text'] selects all elements with type attribute equal to 'text'.

intermediate

How do you select elements with a class that starts with 'btn-' using CSS attribute selectors?

Use the selector <code>[class^='btn-']</code>. The <code>^=</code> means 'starts with'. This selects elements whose class attribute value starts with 'btn-'.

beginner

What is a CSS pseudo-class selector?

A CSS pseudo-class selector matches elements in a specific state or position, like <code>:hover</code> for when the mouse is over an element, or <code>:first-child</code> for the first child element.

intermediate

Give an example of using a CSS pseudo-class selector in Selenium Java.

Example: driver.findElement(By.cssSelector("input[type='checkbox']:checked")) selects a checkbox input that is currently checked.

beginner

Why are CSS attribute and pseudo-class selectors useful in Selenium tests?

They allow precise targeting of elements based on attributes or states without relying on IDs or classes alone. This helps make tests more robust and maintainable.

Which CSS selector matches all input elements with a name attribute containing 'user'?

A input[name='user']

B input[name^='user']

C input[name$='user']

D input[name*='user']

The '*=' operator means 'contains'. So input[name*='user'] matches inputs whose name attribute contains 'user' anywhere.

What does the CSS selector button:disabled select?

A Buttons that are enabled

B Buttons that are disabled

C All buttons

D Buttons with class 'disabled'

The ':disabled' pseudo-class matches elements that are disabled, such as buttons that cannot be clicked.

Which selector finds the first <li> element inside a <ul>?

A ul li:first-child

B ul li:last-child

C ul:first-child li

D li:first-child ul

The ':first-child' pseudo-class selects the first child element of its parent. 'ul li:first-child' selects the first

inside each

.

In Selenium Java, how do you select an input with attribute placeholder exactly 'Search'?

A By.cssSelector("input[placeholder='Search']")

B By.cssSelector("input[placeholder*='Search']")

C By.cssSelector("input[placeholder^='Search']")

D By.cssSelector("input[placeholder$='Search']")

The '=' operator matches exact attribute value. So input[placeholder='Search'] matches inputs with placeholder exactly 'Search'.

What does the CSS selector a[href$='.pdf'] select?

A Links with href starting with '.pdf'

B Links with href containing '.pdf'

C Links with href ending with '.pdf'

D All links

The '$=' operator means 'ends with'. So a[href$='.pdf'] selects links whose href attribute ends with '.pdf'.

Explain how CSS attribute selectors work and give examples of different operators.

Think about matching exact, starts with, ends with, and contains.

Describe CSS pseudo-class selectors and how they help in selecting elements in Selenium tests.

Focus on element states and positions.