make-mutation-observer

Greasy Fork镜像 is available in English.

Mutation Observer

A simple wrapper around MutationObserver API to watch DOM changes.

As of 2024-02-24. See the latest version.

This script should not be not be installed directly. It is a library for other scripts to include with the meta directive // @require https://update.greasyforks.org/scripts/488160/1332701/Mutation%20Observer.js

Ask a question, post a review, or report the script.

Wrap lines

// ==UserScript==
// @name         Mutation Observer
// @description  A simple wrapper around MutationObserver API to watch DOM changes.
// @version      1.0.2
// @namespace    owowed.moe
// @author       owowed <[email protected]>
// @license      LGPL-3.0
// ==/UserScript==

/**
 * @typedef {MutationObserverInit & {
 *  target: HTMLElement,
 *  abortSignal?: AbortSignal,
 *  once?: boolean
 * }} MakeMutationObserverOptions
 */

/**
 * @typedef {(info: { records: MutationRecord[], observer: MutationObserver }) => void} MakeMutationObserverCallback
 */

/**
 * Create a new `MutationObserver` with options and callback.
 * @param {MakeMutationObserverOptions} options 
 * @param {MakeMutationObserverCallback} callback 
 * @returns {MutationObserver}
 */
function makeMutationObserver({ target, abortSignal, once, ...options }, callback) {
    const observer = new MutationObserver(records => {
        abortSignal?.throwIfAborted();
        if (once) observer.disconnect();
        callback({ records, observer });
    });

    observer.observe(target, options);

    abortSignal?.addEventListener("abort", () => {
        observer.disconnect();
    });

    return observer;
}