querySelect plugin?

[Steven Vachon]

To avoid using jsdom for HTML+CSS parsing, it'd be great if Rework had, in the core or in a plugin, the ability to retrieve a stylesheet via a selector.

If we parsed this with Rework:

body > a {color:red}
a {font-weight:bold}
a.test {font-style:italic}

and queried:

rework.query("body > a.test");  // or similar

it would return:

{ color:"red", font-style:"italic", font-weight:"bold" }  // pseudo

[Max Thirouin]

You can probably do that really quickly using css-parse with a simple loop.

[Steven Vachon]

Sure, a simple loop, but the regex and checking of obj.stylesheet.rules[i].selector could get complex. Also, figuring out inheritance could take a while.

[Max Thirouin]

I was just saying that Rework exists to manipulate CSS rules & declarations directly, not making query on it. So I think you should implement something on top of css-parse.
What is the use case ?

[Steven Vachon]

Ah, I had hopes that it'd fit in with the project goals so that I wouldn't have to write it, heh. I don't have much time as I have other projects on the go.

My particular use case is smil2css where I'm comparing SVG styles against attributes which, once merged, are major deciding factors on how animation will perform. Currently, I only support checking parsed CSS for global-level elements.

A general use case would be getting styles for elements using a combination of Cheerio and Rework instead of using jsdom. Eventually, Cheerio could even be extended with Rework to simulate more of jQuery in the DOM.

[Max Thirouin]

That's definitly not the purpose of Rework imo.

[Steven Vachon]

Yeah, and it wouldn't support some more advanced CSS requirements as well, so I'll have to use jsdom/domino for it.