# ember-mutation-observer-modifier

> Use MutationObserver through an Ember Modifier

Latest version **1.0.1** (published 2020-08-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install ember-mutation-observer-modifier
pnpm add ember-mutation-observer-modifier
yarn add ember-mutation-observer-modifier
bun add ember-mutation-observer-modifier
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2020-08-03 |
| First published | 2020-04-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | 10.* \|\| >= 12 |
| Dependencies | 3 |
| Unpacked size | 9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | alexlafroscia |
| Keywords | ember-addon |

## Links

- npm: https://www.npmjs.com/package/ember-mutation-observer-modifier
- npm.io page: https://npm.io/package/ember-mutation-observer-modifier

## Dependencies (3)

- [ember-modifier](https://npm.io/package/ember-modifier.md) ^2.0.1
- [ember-cli-babel](https://npm.io/package/ember-cli-babel.md) ^7.18.0
- [ember-cli-htmlbars](https://npm.io/package/ember-cli-htmlbars.md) ^5.0.0

## Recent versions

- 1.0.1 (latest) — 2020-08-03
- 1.0.0 — 2020-04-14

## README

# ember-mutation-observer-modifier

Use [`MutationObserver`][mutation-observer] through an Ember Modifier

## Compatibility

- Ember.js v3.12 or above
- Ember CLI v2.13 or above
- Node.js v10 or above

## Installation

```
ember install ember-mutation-observer-modifier
```

## Usage

This addon provides an Ember [modifier][ember-modifier] for attaching a [`MutationObserver`][mutation-observer] to an element in your Ember template and calling an action when the observer fires. All configuration options supported by `MutationObserver#observe` are supported through the modifier.

In the following example, `this.onChange` will be called any time that `this.someAttrValue` is changed on the `div`, by observing the changes to the `some-attr` attribute.

```handlebars
<div some-attr={{this.someAttrValue}} {{observe-mutation this.onChange attributes=true}} />
```

Note that options for the `MutationObserver` can also be provided as the second positional parameter to the modifier.

```handlebars
<div some-attr={{this.someAttrValue}} {{observe-mutation this.onChange (hash attributes=true)}} />
```

Please consult the documentation for [`MutationObserverInit`][mutation-observer-init] for a full list of supported parameters.

## Contributing

See the [Contributing](CONTRIBUTING.md) guide for details.

## License

This project is licensed under the [MIT License](LICENSE.md).

[mutation-observer]: https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
[mutation-observer-init]: https://developer.mozilla.org/en-US/docs/Web/API/MutationObserverInit
[ember-modifier]: https://guides.emberjs.com/release/components/template-lifecycle-dom-and-modifiers/#toc_out-of-component-modifications

---
_Source: https://npm.io/package/ember-mutation-observer-modifier · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
