question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

getComputedStyle with implicit and shorthand properties

See original GitHub issue

Hi folks! I’m having trouble with “getComputedStyle”. It does not properly return all computed styles. It only returns the styles explicitly set. If I attempt to list all the computed styles, I only get the few I set earlier:

var style = window.getComputedStyle(Control);
for (var i = 0; i < style.length; i++)
  console.log([style.item(i) + '=' + style.getPropertyValue(style.item(i))]);

More specifically, I should be able to set the padding like this:

Control.style.padding = '10px 9px 8px 7px';

And then determine just one side of the padding:

return window.getComputedStyle(Control).paddingTop;

This code should return ‘10px’, but instead returns ‘’.

This has been discussed earlier (https://github.com/tmpvar/jsdom/issues/353), and was supposed to be fixed (https://github.com/tmpvar/jsdom/commit/9b1cee39e9c32da349a406ed3843180b6d7b466a), but it appears to still be an issue.

Issue Analytics

  • State:closed
  • Created 10 years ago
  • Comments:14 (8 by maintainers)

github_iconTop GitHub Comments

2reactions
domeniccommented, Nov 30, 2013

This is fixed as of the latest jsdom 0.8.9, due to @chad3814’s amazing work on cssstyle!

0reactions
domeniccommented, Jun 12, 2014

Anytime!

Read more comments on GitHub >

github_iconTop Results From Across the Web

window.getComputedStyle not working for shorthand ...
The shorthand property problem​​ getComputedStyle will not return the value of shorthand properties, except in Chrome as you've discovered. To ...
Read more >
Window.getComputedStyle() - Web APIs | MDN
getComputedStyle () method returns an object containing the values of ... instead of the border-width and border shorthand property names.
Read more >
Used value - Css - CodeProject Reference
getComputedStyle. Dimensions (e.g., width , line-height ) are all in pixels, shorthand properties (e.g., background) are consistent with their component ...
Read more >
blink/renderer/core/css/css_computed_style_declaration.cc
but WITHOUT ANY WARRANTY; without even the implied warranty of ... property && property->IsLayoutDependent(styled_node->GetComputedStyle(),.
Read more >
CSS Cascading and Inheritance Level 5 - W3C
A shorthand property sets all of its longhand sub-properties , exactly as if expanded in place. When values are omitted from a shorthand...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found