ts-css-selector
TypeScript icon, indicating that this package has built-in type declarations

1.0.1 • Public • Published

ts-css-selector · npm license

A CSS Selector generator.

Installation

To install ts-css-selector, execute:

npm install ts-css-selector

or

yarn add ts-css-selector

Usage

This utility function takes two DOM elements (target and root, in this order) and returns a valid CSS selector.

/*
<div>
  <div id="container">
    <a>Link</a>
    <button>My button</button>
  </div>
  <ul id="list">
    <li>Item 1</li>
    <li>Item 2</li>
  </div>
</div>
*/

import cssSelectorGenerator from 'ts-css-selector';

const target = document.querySelector('button');
const root = document.querySelector('div');

cssSelectorGenerator(target, root); // 'div > #container > button'

It can also be invoked in async mode. For that, you need to provide a thrid parameter as the example below:

/*
<div>
  <div id="container">
    <a>Link</a>
    <button>My button</button>
  </div>
  <ul id="list">
    <li>Item 1</li>
    <li>Item 2</li>
  </div>
</div>
*/

import cssSelectorGenerator from 'ts-css-selector';

const target = document.querySelector('button');
const root = document.querySelector('div');

await cssSelectorGenerator(target, root, true); // 'div > #container > button'

License

MIT

Package Sidebar

Install

npm i ts-css-selector

Weekly Downloads

2

Version

1.0.1

License

MIT

Unpacked Size

10 kB

Total Files

15

Last publish

Collaborators

  • evandrolg