Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Selenium WebDriver - getCssValue() method

I am doing a exercise to use cssGetValue method to retrieve the value from a particular web element's CSS property.

I have 2 questions:

  1. why the cssGetValue method returned value 13px, which web element does the method actually referenced. 1a. I want to get CSS property for section labeled as "By ID". how should I modify my code so I can get CSS property value for id="by-id" section?

  2. I used driver.close() method, but it won't close the browser after the script finished. Please explain to me why driver.close() method didn't work in this case.

    Here is my code fragment:

    package wd_findElementBy;
    
    import java.util.List;
    
    import org.junit.Test;
    
    import org.junit.Before;
    
    import org.junit.After;
    
    
    import org.openqa.selenium.By;
    
    import org.openqa.selenium.WebDriver;
    
    import org.openqa.selenium.WebElement;
    
    import org.openqa.selenium.firefox.FirefoxDriver;
    
    
    public class SearchWebElements 
    {
    
    WebDriver driver = new FirefoxDriver();
    private String baseUrl= "http://docs.seleniumhq.org/docs/03_webdriver.jsp#introducing-the-selenium-webdriver-api-by-example";
    
    @Test
    public void findElements(){
    driver.get(baseUrl);
    
    try{
        List<WebElement> elements = driver.findElements(By.id("by-id"));
        System.out.println("number of elements: " + elements.size());
    
        for(WebElement ele : elements){
            System.out.println(ele.getTagName());
    
            System.out.println("get the text for web element with id='by-id' ");
            System.out.println("------------------------------------------------------------");
            System.out.println(ele.getText());
            System.out.println("------------------------------------------------------------");
            System.out.println(ele.getAttribute("id"));
            System.out.println(ele.getCssValue("font-size"));
    
        }
    }
    
    finally{
        //driver.close();
        driver.quit();
    }
    
    
    }
    
    }
    
like image 645
user2061466 Avatar asked Jun 22 '13 21:06

user2061466


3 Answers

Yes, all correct.

Here's a screenshot of where to find font-size through Firebug.

enter image description here

Since the ids are supposed to be unique (at least for this page), you don't need findElements to find a list of elements with id by-id and loop through, instead, you use findElement to get the element directly.

try{
        WebElement byId = driver.findElement(By.id("by-id"));

        System.out.println(byId.getTagName());

        System.out.println("get the text for web element with id='by-id' ");
        System.out.println("------------------------------------------------------------");
        System.out.println(byId.getText());
        System.out.println("------------------------------------------------------------");
        System.out.println(byId.getAttribute("id"));
        System.out.println(byId.getCssValue("font-size"));
    }
}
like image 184
Yi Zeng Avatar answered Oct 23 '22 08:10

Yi Zeng


For getting CSS value:

driver.findElement(By.id("by-id")).getCssValue("font-size");//similarly you can use other CSS property such as background-color, font-family etc.

For quit/close the browser after finishing the execution of script:

driver.quit();
like image 39
Ripon Al Wasim Avatar answered Oct 23 '22 09:10

Ripon Al Wasim


public class GetCssValues {

public WebDriver driver;
private By bySearchButton = By.name("btnK");

@BeforeClass
public void setUp() {
    driver = new FirefoxDriver();
    driver.get("http://www.google.com");
}

@Test(priority=1)
public void getCssValue_ButtonColor()  {
    WebElement googleSearchBtn = driver.findElement(bySearchButton); 
    System.out.println("Color of a button before mouse hover: " + googleSearchBtn.getCssValue("color"));
    Actions action = new Actions(driver);
    action.moveToElement(googleSearchBtn).perform();
    System.out.println("Color of a button after mouse hover : " + googleSearchBtn.getCssValue("color"));
}

@Test(priority=2)
public void getCssValue_ButtonFontSize() {
    WebElement googleSearchBtn = driver.findElement(bySearchButton);
    System.out.println("Font Size of a button " + googleSearchBtn.getCssValue("font-size"));
}

@Test(priority=3)
public void getCssValue_ButtonFontWeight(){
    WebElement googleSearchBtn = driver.findElement(bySearchButton);
    System.out.println("Font Weight of a button "   +getFontWeight(googleSearchBtn) );
}

public String getFontWeight(WebElement element) {
    //Output will return as 400 for font-weight : normal, and 700 for font-weight : bold
    return element.getCssValue("font-weight");
}

@AfterClass
public void tearDown() {
    driver.quit();
}

}

output:

Color of a button before mouse hover: rgba(68, 68, 68, 1) Color of a button after mouse hover : rgba(34, 34, 34, 1) Font Size of a button 11px Font Weight of a button 700

like image 30
Khan Imran Avatar answered Oct 23 '22 09:10

Khan Imran