[🐛 Bug]: getCssValue is not following the document

[alaahong]

What happened?

Just wonder if the correct behaivor of getCssValue.

1. What's the actual expected return value for getCssValue(shorthand)
2. Any missed description in Java doc

Below is the actual return in code Try to execute on Chrome/Edge/IE

1. As document mentioned, the shorthand CSS properties should be not returned. But got full value on Chrome/Edge, and empty value "" on IE
2. The color is different in background and background-color As can be seen, the color is different in background and background-color rgb(78, 110, 242) none repeat scroll 0px 0px / auto padding-box border-box rgba(78, 110, 242, 1)

3. IE return empty "" As the doc mentioned CSS Value reference This method returns null if the property is a shorthand property.

reference:

https://www.selenium.dev/selenium/docs/api/java/org/openqa/selenium/WebElement.html#getCssValue(java.lang.String) Get the value of a given CSS property. Color values could be returned as rgba or rgb strings. This depends on whether the browser omits the implicit opacity value or not. For example if the "background-color" property is set as "green" in the HTML source, the returned value could be "rgba(0, 255, 0, 1)" if implicit opacity value is preserved or "rgb(0, 255, 0)" if it is omitted. Note that shorthand CSS properties (e.g. background, font, border, border-top, margin, margin-top, padding, padding-top, list-style, outline, pause, cue) are not returned, in accordance with the [DOM CSS2 specification](http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSStyleDeclaration) - you should directly access the longhand properties (e.g. background-color) to access the desired values. See [W3C WebDriver specification](https://w3c.github.io/webdriver/#get-element-css-value) for more details.

How can we reproduce the issue?

Scenario 1: Chrome
ChromeDriver driver = new ChromeDriver();
driver.get("https://www.baidu.com/");
String background = driver.findElement(By.id("su")).getCssValue("background");
//rgb(78, 110, 242) none repeat scroll 0px 0px / auto padding-box border-box
System.out.println(background); 
String color = driver.findElement(By.id("su")).getCssValue("background-color");
//rgba(78, 110, 242, 1)
System.out.println(color);
driver.quit();

Scenario 2: Edge
EdgeDriver driver = new EdgeDriver();
driver.get("https://www.baidu.com/");
String background = driver.findElement(By.id("su")).getCssValue("background");
//rgb(78, 110, 242) none repeat scroll 0px 0px / auto padding-box border-box
System.out.println(background); 
String color = driver.findElement(By.id("su")).getCssValue("background-color");
//rgba(78, 110, 242, 1)
System.out.println(color);
driver.quit();


Scenario 3: IE 
InternetExplorerDriver driver = new InternetExplorerDriver();
driver.get("https://www.baidu.com/");
String background = driver.findElement(By.id("su")).getCssValue("background");
// ""
System.out.println(background); 
String color = driver.findElement(By.id("su")).getCssValue("background-color");
//rgba(78, 110, 242, 1)
System.out.println(color);
driver.quit();

Relevant log output

N/A

Operating System

Win10

Selenium version

Java 4.1.2

What are the browser(s) and version(s) where you see this issue?

Edge 97.0.1072.76 / Chrome 98.0.4758.81/ IE 11.789.19041.0

What are the browser driver(s) and version(s) where you see this issue?

MSEdgeDriver 97.0.1072.76 / ChromeDriver 98.0.4758.48/ InternetExplorerDriver 4.0.0.0

Are you using Selenium Grid?

N/A

[github-actions[bot]]

@alaahong, thank you for creating this issue. We will troubleshoot it as soon as we can.

---

Info for maintainers

Triage this issue by using labels.

If information is missing, add a helpful comment and then I-issue-template label.

If the issue is a question, add the I-question label.

If the issue is valid but there is no time to troubleshoot it, consider adding the help wanted label.

If the issue requires changes or fixes from an external project (e.g., ChromeDriver, GeckoDriver, W3C), add the applicable G-* label, and it will provide the correct link and auto-close the issue.

After troubleshooting the issue, please add the R-awaiting answer label.

Thank you!

[titusfortner]

That description might be out of date. The w3c specification is what guides this now, and it doesn't make any distinction for shorthand or even give guidelines on how things should be formatted, just:

computed value of parameter property name from element’s style declarations

https://w3c.github.io/webdriver/#get-element-css-value

This makes it sound like the formatting is an implementation detail. Also, the different browsers have always returned different values for css_value: https://github.com/SeleniumHQ/selenium/blob/26e46fb538223ec63423908fb7cf66077abac0c8/rb/spec/integration/selenium/webdriver/element_spec.rb#L486

It makes sense that Edge and Chrome will be the same since it is the same underlying driver. Firefox and Safari are probably both different as well.

So, the one thing that we know is wrong is that IE Driver shouldn't be returning an empty string for this.

[github-actions[bot]]

This issue is looking for contributors.

Please comment below or reach out to us through our IRC/Slack/Matrix channels if you are interested.

[github-actions[bot]]

This issue is stale because it has been open 280 days with no activity. Remove stale label or comment or this will be closed in 14 days.

[github-actions[bot]]

This issue was closed because it has been stalled for 14 days with no activity.

[github-actions[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.