3.0.0 • Published 4 years ago

@caillou/dom-component-path v3.0.0

Weekly downloads
4
License
MIT
Repository
github
Last release
4 years ago

dom-component-path

Get the component path of a DOM element.

Install

Requires matches-selector.

npm install @caillou/dom-component-path

Example

Running the following code:

import {domComponentPath} from 'dom-component-path'
const h1 = document.querySelector('h1')
const path = domComponentPath.get(h1)

With the following HTML:

<html lang="en">
  <body data-abstract-component="detail page">
    <div id="main">
      <div class="module">
        <h1>Hello World</h1>
      </div>
    </div>
  </body>
</html>

Yields the following result:

[
  {
    "name": "Tag: html",
    "position": 1
  },
  {
    "name": "Component: detail page",
    "position": 1
  },
  {
    "name": "ID: main",
    "position": 1
  },
  {
    "name": "Class: module",
    "position": 1
  },
  {
    "name": "Tag: h1",
    "position": 1
  }
]

Running Tests

Tests can be easilly run locally as follows:

npm install
npm test