Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support document.styleSheets? #50

Open
fortes opened this issue Apr 2, 2015 · 5 comments
Open

Support document.styleSheets? #50

fortes opened this issue Apr 2, 2015 · 5 comments

Comments

@fortes
Copy link
Contributor

fortes commented Apr 2, 2015

Not sure if it's out of scope for the project, but I ran into an issue with an automated headless test that is accessing document.styleSheets. This is needed since it's the only way to get at the stylesheet.rules, etc properties (which I'm guessing isn't supported either).

@cscott
Copy link
Collaborator

cscott commented Jun 9, 2015

I would actually like to support more of the CSS-related DOM eventually. Patches welcome! Otherwise I'll eventually get to it myself.

@cscott
Copy link
Collaborator

cscott commented Feb 8, 2016

I've been doing a lot of work on https://github.com/CSSLint/parser-lib recently, so we're close(r) to being able to implement this properly. (We do already implement CSSStyleDeclaration which is the value of the HTMLElement#style property, but we don't fully support shorthand properties yet.)

@niedzielski
Copy link
Contributor

Firstly, thanks for the great lib! Secondly, I wanted to add a comment for posterity :] Maybe this goes without saying for some, but I think this issue also applies generally to all styles specified in head. For example, given two files, foo.css and fixture.html:

/* foo.css */
.foo {
  color: red;
}
<!-- fixture.html -->
<html>
<head>
  <link href=foo.css rel=stylesheet>
  <style>
    .bar {
      background: green;
    }
  </style>
</head>

<body>
  <a id=a class='foo bar' style='font-size: 20px'>hello world!</a>
</body>
</html>

Color and background are undefined:

var domino = require('domino')
var fs = require('fs')

var html = fs.readFileSync('fixture.html')
var window = domino.createWindow(html)
var a = window.document.getElementById('a')
var style = window.getComputedStyle(a)

console.log(a.classList) // foo, bar
console.log(style.getPropertyValue('color')) // undefined
console.log(style.getPropertyValue('background')) // undefined
console.log(style.getPropertyValue('font-size')) // 20px

It's a little bit of bummer if your code relies on getComputedStyle().

@CaerusKaru
Copy link
Contributor

@cscott Is there an implementation plan for this feature (and other getComputedStyle-related issues)? I'd be happy to submit a patch if you have notes on how you'd like it implemented.

We're running into this issue trying to get SSR to work properly on @angular/flex-layout

@sandangel
Copy link

I run into this issue when trying to generate graph on serverside using d3 and domino. The inline style which is set by eg: .style('stroke', '#52ADFF') is not apply to the element. I have to switch back to jsdom for now.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants