Selenium IDE: How to check text color using CSS

Question

I have a link:

<a class="title">My link</a>

It is styled with this CSS code:

a.title {
  color: #CC3333;
}

How can I verify that the text "My link" is red? I can locate the element with css=a.title, but how can I assert that color == "#CC3333" in Selenium IDE?

Answer 1

style.color will return color if actual DOM element has style attribute. In your case, when color is definied in <style> tag it won't work. This we need you use getComputedStyle(). Still, color returns color in RGB format but you may convert your color manually and verify RGB result.

Like this:

assertEval(
  "window.document.defaultView.getComputedStyle(window.document.getElementsByClassName('title')[0]).getPropertyValue('color')",
  "rgb(204, 51, 51)"
)

N.B. It's also recommended to use selenium.browserbot.getCurrentWindow() instead of window. I left window to make snippet shorter.