auto-id
Automatically creates a collection of element references keyed from the ID attribute of all page elements
Comes in handy when writing Electron apps, OS X Cocoa apps with webviews, websites... basically anything that uses HTML / JS / CSS as the view. The module queries all DOM elements with an id attribute and stores reference to that element in a collection keyed off the camel-cased id value.
For example, assuming the markup below:
... ...
auto-id
allows us to access all elements with an id
attribute without writing queries (or querying the DOM):
var dom = ; // IMPORTANT: If using a shared instance (the default behavior illustrated above),// we probably need to "refresh" our instance since it was likely instantiated before// our DOM was drawn...dom; // Now we have reference to the elements with ID attributes:domcontainerstylecolor = '#333'; // Note a kebab-cased ID becomes camelCaseddommainTitletextContent = 'New text here'; // We add an element to the DOM documentbody; // We need to refresh our instance before we will have a// reference to it - this is where shared instances provide // additional value in terms of use and performancedom; // Use the reference liberally without performance concernsdomsomeElementsIdvisibility = 'visible';
Installation
Install via npm:
$ npm i auto-id --save
Usage
By default, this module exports a shared instance.
The constructor can be accessed via the export's AutoId
property (see below).
To access the shared instance (probably what you want):
var dom = ; domsomeIdstyletransform = 'scale(2)';
Access the constructor:
var AutoId = AutoId;var dom = ; domsomeIdstyletransform = 'scale(2)';
Tests
Tests are written in tape
.
$ npm test
Coverage
Test coverage is provided via Istanbul
.
$ npm run coverage