Can Selenium get the CSS style for an element?

3,879 views
Skip to first unread message

Bogdan

unread,
Feb 18, 2011, 7:49:55 AM2/18/11
to Selenium Users
I've tried GetAttribute, but it does not return css styles loaded from
a .css file.
I've tried doing it with javascript (see
http://robertnyman.com/2006/04/24/get-the-rendered-style-of-an-element/):

<code>
string script = "var x = document.getElementById('wrapper');
document.defaultView.getComputedStyle(x,null).getPropertyValue('width');";

selenium.GetEval(script);
</code>
but I get this error:
<code>
Test 'SeleniumTests.FeatureChecks.FeaturesTest' failed:
Selenium.SeleniumException : ERROR: Threw an exception: Operation is
not supported
at Selenium.HttpCommandProcessor.DoCommand(String command, String[]
args)
at Selenium.HttpCommandProcessor.GetString(String commandName,
String[] args)
at Selenium.DefaultSelenium.GetEval(String script)
FeatureChecks.cs(164,0): at
SeleniumTests.FeatureChecks.CheckFeature1334()
FeatureChecks.cs(85,0): at SeleniumTests.FeatureChecks.FeaturesTest()
</code>

Bogdan

unread,
Feb 21, 2011, 5:06:42 AM2/21/11
to Selenium Users
Turns out I should have used:

string script = "var x =
window.document.getElementById('__ELEMENT_ID_HERE__');
window.document.defaultView.getComputedStyle(x,null).getPropertyValue('__COMPUTED_CSS_ATTR_HERE__');";

string result = selenium.GetEval(script);

Hope this helps someone so I am including this string:

selenium get computed css style getcomputedstyle

Andrew

unread,
Feb 22, 2011, 10:55:02 AM2/22/11
to Selenium Users
that's great, I've been wondering about this myself.

Sirisha Reddy

unread,
Feb 23, 2011, 7:25:33 AM2/23/11
to Selenium Users
Thank you that's helpful!

riz

unread,
Feb 26, 2011, 1:46:46 PM2/26/11
to Selenium Users
Bogdan, I sent you a direct message by mistake last time so sorry for
the duplicate but I'd like to post the question publicly.

** Goal **
the goal is to read the css color attribute for an image thumbnail
with the image id=thumbnail:1

** Source **
String script =
" {" +
" var x = window.document.getElementById('thumbnail:1');" +
"
window.document.defaultView.getComputedStyle(x,null).getPropertyValue('border');"
+
"}";

String result = selenium.getEval(script);

** Result **
The result is blank although the firebug shows the border=1px solid
black.

** Alternate **
The following are other javascript queries I've tried with the same
empty responce.
1. selenium.getEval("window.document.getElementById('thumbnail:
1').style.border");
2.
selenium.getEval("window.document.defaultView.getComputedStyle(document.getElementById('thumbnail:
1'), null).backgroundColor");
3. String thumbStyle =
selenium.getEval("window.document.getElementById('thumbnail:
1').style");

Note:
selenium.getEval("window.document.defaultView.getComputedStyle(document.getElementById('thumbnail:
1') returns "[object HTMLImageElement]"

Thank you in advance for your time.

On Feb 21, 11:06 am, Bogdan <bolchisbolc...@gmail.com> wrote:
> Turns out I should have used:
>
>             string script = "var x =
> window.document.getElementById('__ELEMENT_ID_HERE__');
> window.document.defaultView.getComputedStyle(x,null).getPropertyValue('__CO MPUTED_CSS_ATTR_HERE__');";
Reply all
Reply to author
Forward
0 new messages