Monday, January 18th, 2010
Helium CSS: JavaScript Library to test your CSS usage
Category: CSS, JavaScript
, Library
, Testing
You inject helium into your site (e.g. put it in an included footer) and then when you hit the first page you will have a popup asking for the pages you want to test. Helium will find the style sheets that you use and will store that information and the page information inside of localStorage. Then it will XHR around (so your styles need to be on the same host), test each page, and finally give you results.
I put up a trivial example to give it a ride and ended up with:
I ran into a minor issue with regards to relative stylesheets so I did the Github thing and forked, fixed, and pull requested. I love Github :)
Related Content:
- Using Notes documents for CSS design
Using a Page requires a design modification if the webmaster needs to modify the CSS... - Save seconds in page load time by upgrading your JavaScript libraries
JavaScript libraries such as jQuery provide functions that make it easy for web developers to achieve certain things, e.g.: change the style of... - JavaScript, the Ajax Web service client language
In this tip, William Brogden discusses JavaScript and its popularity as a scripting... - The Importance of CSS to XML
4.4 rating from 19 votes
It’s strange but it appears that such tools aren’t so many!
Look slike a bit of a copy/rip-off from the “CSS Usage” firebug plugin.
https://addons.mozilla.org/en-US/firefox/addon/10704
Similar to “Dust-Me Selectors”, too: http://www.sitepoint.com/dustmeselectors/ . But still useful because you can use it on more platforms than Firefox, which makes testing for browser-specific CSS less tedious. Once the developer gets it working in IE (as he says he plans to), it’ll become much more useful.