stylesheet-traverser

A set of helper functions to work with CSS in JavaScript.

Installation

npm install stylesheet-helpers

Usage

• ES6:

  import { getStylesheetRule } from 'stylesheet-traverser';
  const rule = getStylesheetRule('.super-element');
  console.log(rule);

• Common.js:

  var traverser = require('stylesheet-traverser');
  var rule = traverser.getStylesheetRule('.super-element');
  console.log(rule);

• Browser (include dist/stylesheet-traverser.js or dist/stylesheet-traverser.min.js):

  var traverser = window.stylesheetTraverser;
  var rule = traverser.getStylesheetRule('.super-element');
  console.log(rule);

Functions

getStylesheetRule

Looks for document's first stylesheet rule by exact CSS selector or RegExp pattern:

import { getStylesheetRule } from 'stylesheet-traverser';
const classRule = getStylesheetRule('.super-element');
const regExpRule = getStylesheetRule(/(div|span)\.super-element/);
console.log(classRule);
console.log(regExpRule);

getStylesheetRules

The same as getStylesheetRule but returns an array of all found rules.

ensureStylesheetsAreReady

Waits while all document's stylesheets are being loaded:

import { ensureStylesheetsAreReady } from 'stylesheet-traverser';
ensureStylesheetsAreReady().then(() => {
   // do some stuff
});

preloadImages

Preloads all images found in urls of document's stylesheets:

import { preloadImages } from 'stylesheet-traverser';
preloadImages().then(() => {
   // do some stuff
})

Building

In order to build the library run:

npm run build

Testing

Run tests:

npm test

Run tests with coverage:

npm run test:coverage

In order to run tests with Coveralls locally you have to provide COVERALLS_REPO_TOKEN:

COVERALLS_REPO_TOKEN=<token> npm run test:coveralls

Contributing

Before making a pull request, please, be sure that you start from develop branch.

License

MIT