css-observe | Vaadin

Fire a custom event whenever an element matching a specified selector is added.

Published on webcomponents.org

css-observe

Fire a custom event whenever an element matching a specified selector is added.

Syntax

Example

<script type="module" src="../css-observe.js"></script>
<css-observe id="myObserver" observe selector="div[test]"></css-observe>
<div test>
    I am here
</div>

css-observe will fire event: latest-match-changed, and the newly added element can be obtained from event.detail.value.

It will only observe the selector within the same Shadow DOM realm where the element is placed. If the element is placed outside any ShadowDOM, it will observe the selector only outside any ShadowDOM. How cool is that?

Implementation

Based off of an idea found here

Viewing Your Element

$ polymer serve

Running Tests

$ npm tests

Install

Link to this version
ImportedReleased 16 December 2018MIT License
Framework Support
Browser Independent
Install with
npm install css-observe"@0.0.9"
Run the above npm command in your project folder. If you have any issues installing, please contact the author.
Release notes - Version 0.0.9

Dependencies

  • xtal-latx#0.0.84