Svelte Use

useMutationObserver

Watch for changes being made to the DOM tree. MutationObserver MDN

Usage 

<script>
  import { writable, useMutationObserver } from '@svelte-use/core'

  const el = writable()
  let messages = []

  useMutationObserver(
    el,
    (mutations) => {
      if (!mutations[0]) {
        messages.push(mutations[0].attributeName)
        messages = messages
      }
    },
    { attributes: true },
  )
</script>

<div bind:this={$el}></div>

Type Declarations 

export interface MutationObserverOptions
  extends MutationObserverInit,
    ConfigurableWindow {}
/**
 * Watch for changes being made to the DOM tree.
 *
 * @see https://svelte-use.vercel.app/core/useMutationObserver
 * @see https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver MutationObserver MDN
 * @param target
 * @param callback
 * @param options
 */
export declare function useMutationObserver(
  target: MaybeElementReadable,
  callback: MutationCallback,
  options?: MutationObserverOptions
): {
  isSupported: boolean | undefined
  stop: () => void
}
export declare type UseMutationObserverReturn = ReturnType<
  typeof useMutationObserver
>

Source

Source • Demo • Docs