How do you get the background color of an element with Appium webdriver?

Support
1

Using regular selenium webdriver I can use something like this to get an element’s background color:

searchBtn = driver.find_element_by_tag_name(“BUTTON”)
print searchBtn.value_of_css_property(“background-color”).

How is this done with the Appium webdriver? Can you test something like this i.e. whether the text is bold or what color it is?

2

This cannot be done by appium as underlying UIAutomator framework does not allow us to do so.
In app’s native context this cannot be done

In app’s webview’s context this will be same as below because webview is nothing but a chromeless browser session inside and app
print searchBtn.value_of_css_property(“background-color”).

Summary
for element inside NATIVE CONTEXT ==>> NO
for element inside WEBVIEW CONTEXT ==>> YES

3

Thanks for the quick response. I wonder if this sort of thing will be eventually implemented. This incapability limits automated testing.

4

Hi everyone!!

There is any changes about this topic?!?!

I’m developing a test code in c# (v3.0.02 of Appium) and I need to get the value of “background-color” property of an element that I have in my NATIVE App.

Here is a part of the code:

ReadOnlyCollection obj = driver.FindElementsByName(“lblProtocolo”);

for(int i=0;i<obj.Count;i++)
{
var str = obj[i].GetCssValue(“background-color”);
}

but is throwing an exception:

Test method ASEXamarin.Shared.Tests.TelaInicial.TesteRows threw exception:
System.NotImplementedException: Not yet implemented. Please help us: http://appium.io/get-involved.html

There is any form to get this property in NATIVE Apps?

Thanks!!!

5

Any solution for above question?

6

For things like this that would help testing, but are not supported in the XCode and Android testing APIs yet, I create enhancement requests for my developers to add hidden information like this into the app elements for fields I can inspect.

1 Like
7

As a workaround you can use element.getScreenshotAs() and look at the color of pixels of the image.

8

Thanks for your suggestion.

9

Try this code, you will get element Color code in RGB, this will work for Native applications

MobileElement elem = (MobileElement) driver.findElement(By.id(“loginButton”));

	org.openqa.selenium.Point point = elem.getCenter();
	int centerx = point.getX();
	int centerY = point.getY();
	
	File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
	
	 BufferedImage image = ImageIO.read(scrFile);
	  // Getting pixel color by position x and y 
	  int clr=  image.getRGB(centerx,centerY); 
	  int  red   = (clr & 0x00ff0000) >> 16;
	  int  green = (clr & 0x0000ff00) >> 8;
	  int  blue  =  clr & 0x000000ff;
	  System.out.println("Red Color value = "+ red);
	  System.out.println("Green Color value = "+ green);
	  System.out.println("Blue Color value = "+ blue);
1 Like
10

this way is right, but

File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
BufferedImage image = ImageIO.read(scrFile);

in this case image can have big resolution and it’s points can be diff from element.
so you need to use not element point get color from image, but

        image.getMinX();
        image.getMinY();
        image.getWidth();
        image.getHeight();

to get right result for all times