How to test if a WebElement Attribute exists using Selenium Webdriver

13,875

Solution 1

Instead of checking the attribute, you should list the elements with the missing attribute with a selector:

List<WebElement> elems = driver.findElements(By.cssSelector("img:not([alt])"));

if (elems.size() > 0) {
  // found images with alt attribute missing
}

Solution 2

if the attribute is not present, it should return null, if it's present and not set then it will return empty string. I think that's the case in your example, if so. Then you should use equal method to compare string rather than == operator.

Below example is about google search box, xxx attribute is not present for search box and so it will return null

    driver = new ChromeDriver();
    driver.get("http://google.com");
    WebElement ele = driver.findElement(By.name("q"));
    String attr = ele.getAttribute("xxx");
    if (attr == null){
        System.out.print("Attribute does not exist");
    }

    else if (attr.equals("")){
        System.out.print("Attribute is empty string");
    }

You can try it out yourself by writing the following html and saving it as test. html:

<html>
    <head>
    </head>
    <body>
        <p id="one">one</p>
        <p id="two" data-se="">two</p>
        <p id="three" data-se="something">three</p>
    </body>
</html>

Then write a web driver script that looks like this:

driver.get("file:///<PATH_TO_HTML_ABOVE>/test.html");

WebElement one = driver.findElement(By.id("one"));
WebElement two = driver.findElement(By.id("two"));
WebElement three = driver.findElement(By.id("three"));

System.out.println("Does one have the data-se attribute?:  '" + one.getAttribute("data-se") + "'");
System.out.println("Does two have the data-se attribute?:  '" + two.getAttribute("data-se") + "'");
System.out.println("Does three have the data-se attribute?:  '" + three.getAttribute("data-se") + "'");

Which will give you the following output:

Does one have the data-se attribute?:  'null' 
Does two have the data-se attribute?:  '' 
Does three have the data-se attribute?:  'something'

Solution 3

I think you need to handle the null value first. if(null == we.getAttribute("alt")){ }

Share:
13,875
dsidler
Author by

dsidler

Updated on June 25, 2022

Comments

  • dsidler
    dsidler almost 2 years

    I am testing for whether elements on the page such as //img or //i have an alt attribute.

    I can't find a way to detect when the attribute does not exist at all.

    Here's the WebElement. Just an img with no alt attribute.

    <img class="gsc-branding-img" src="https://www.google.com/cse/static/images/1x/googlelogo_grey_46x15dp.png" srcset="https://www.google.com/cse/static/images/2x/googlelogo_grey_46x15dp.png 2x"/>
    

    Here's my code trying to determine the alt's existence. I know it's not all necessary, I was just trying everything.

    WebElement we == driver.findElement(By.xpath("(//img)[1]"));
    String altAttribute = we.getAttribute("alt");
    
    if(altAttribute == null || altAttribute =="" || altAttribute == " ")
         {
         //attribute not found
         }
    

    It seems like it is returning an empty string... For example, the following code returns "beforeAfter"

    System.out.println("before"+altAttribute+"After");
    

    However, my if statement does not catch the return, so I don't know what to do.

  • dsidler
    dsidler almost 7 years
    Thanks. That would work in my example. But I am actually iterating through a list of images List<WebElement> allImages = driver.findElements(By.xpath("//img")); and I need to check if they all have an alt attribute, so I can't isolate each one with a different xpath. I should have been more specific in my example.
  • Ardesco
    Ardesco almost 7 years
    Double checked and this is 100% correct for Chrome and Firefox
  • DavidHyogo
    DavidHyogo over 5 years
    This feels like a better answer to me than the accepted answer. It addresses the question directly by showing how to test for an attribute, instead of adding the complication of a CSS selector. I try to avoid CSS selectors wherever I possibly can and this answer is much easier to understand and use in future situation.