Selenium WebDriver

CSS Selectors & Web Element Operations

Master CSS selectors and learn comprehensive web element operations including text boxes, radio buttons, checkboxes, buttons, links, and images.

CSS Selector Approaches

CSS Selector in Selenium is used to locate elements in web pages. We can locate elements using different approaches:

1. By ID

#Id

2. By Class Name

.className

3. By Tag Name

tagName

4. Tag Name with ID

tagName#Id

5. Tag Name with Class

tagName.className

6. Tag Name with Attribute

tagName[attribute='value']

7. Ancestor and Descendant

ParentTagName ChildTagName

Advanced CSS Selectors

8. Starts With (^=)

If starting keyword is static, and remaining value is dynamic:

tagName[attribute^='value']

9. Ends With ($=)

If ending keyword is static, and remaining value is dynamic:

tagName[attribute$='value']

10. Contains (*=)

If any location value is static:

tagName[attribute*='value']

11. Multiple Class Names

Space with dot symbol for multiple classes:

.className.className.className

12. Single Class from Multiple

Use any one class name when multiple are present:

.className

Web Element Operations

1. Text Box Operations

Method

isDisplayed()
isEnabled()
sendKeys()
getAttribute()
clear()

Return Type

boolean
boolean
void
String
void
// Text Box Example
WebElement wb = driver.findElement(By.name("firstname"));
boolean displayed = wb.isDisplayed();
boolean enabled = wb.isEnabled();
wb.sendKeys("Suraj");
String value = wb.getAttribute("value");
wb.clear();

2. Radio Button Operations

Method

isDisplayed()
isEnabled()
isSelected()
click()
isSelected()

Return Type

boolean
boolean
boolean
void
boolean
// Radio Button Example
WebElement wb = driver.findElement(By.id("ctl00_ContentPlaceHolder1_rdoSociety"));
boolean displayed = wb.isDisplayed();
boolean enabled = wb.isEnabled();
boolean selected = wb.isSelected();
wb.click();
boolean selectedAfter = wb.isSelected();

3. Checkbox Operations

Checkbox operations are similar to radio buttons, but we can select multiple checkboxes simultaneously.

// Checkbox Example
WebElement checkbox1 = driver.findElement(By.id("checkbox1"));
WebElement checkbox2 = driver.findElement(By.id("checkbox2"));
checkbox1.click(); // Select first checkbox
checkbox2.click(); // Select second checkbox

4. Button Operations

Button Types

save / delete / submit / cancel / register / login / reset / sign up / open etc.

Method

isDisplayed()
isEnabled()
click()
getText() / getAttribute()
getCssValue()

Return Type

boolean
boolean
void
String
String

📝 Important Note

  • • If button tagName is "button" → use getText() method
  • • If button tagName is "input" → use getAttribute() method

5. Links Operations

Method

isDisplayed()
isEnabled()
click()
getText()
getAttribute()

Purpose

Check visibility
Check if clickable
Navigate to link
Capture link text
Capture link address
// Link Example
WebElement link = driver.findElement(By.linkText("Click Here"));
String linkText = link.getText();
String linkAddress = link.getAttribute("href");
link.click();

6. Images Operations

Static Images

• isDisplayed()
• isEnabled()

Image Links

• isDisplayed()
• isEnabled()
• click()
• getAttribute("src")

Practical Examples

Complete Text Box Example

package Tutorial5;

import org.openqa.selenium.By;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;

public class Demo1 {

    public static void main(String[] args) {

        ChromeDriver driver = new ChromeDriver();
        driver.get("https://www.facebook.com/reg");

        WebElement wb = driver.findElement(By.name("firstname"));

        boolean a = wb.isDisplayed();
        System.out.println(a);

        boolean b = wb.isEnabled();
        System.out.println(b);

        wb.sendKeys("Suraj");

        String c = wb.getAttribute("value");
        System.out.println(c);

        wb.clear();
    }
}

Assignment

Practice Exercise: https://demoqa.com/automation-practice-form

Tasks to Complete:

  • • Perform operations on First Name text box (display, enable, enter value, capture value)
  • • Perform operations on Last Name text box (display, enable, enter value, capture value)
  • • Perform operations on Email ID text box (display, enable, enter value, capture value)
  • • Perform operations on Male/Female radio button (display, enable, select, check selection)
  • • Perform operations on Mobile Number text box (display, enable, enter value, capture value)
  • • Perform operations on Sports checkbox (display, enable, select, check selection)
  • • Perform operations on Address text box (display, enable, enter value, capture value)
  • • Perform operations on Submit button (display, enable, capture text, click)

Day 14 Knowledge Check

Question 1 of 5

Which CSS selector approach is used to select elements that start with a specific value?

SDET Mastery

Master Test Automation

Home
CurriculumPracticeQ&ACheatsheet
🍵Buy me a Chai

Automation Testing Course

Comprehensive course covering Manual Testing, Java Programming, and Selenium WebDriver

🍵Buy me a Chai
Privacy Policy•GitHub
© 2024 Automation Testing Course. All rights reserved.