Raik: MutationObserver disconnect() schlägt fehl.

Hallo, ich war lange nicht mehr hier.

Innerhalb eines Tampermonkey-Scripts werden während des Ladens der Seite Elemente entfernt. "observer.disconnect()" wirft einen Fehler: „ERROR: Execution of script 'SecVid2' failed! Cannot read property 'disconnect' of undefined“

Ich verstehe nicht, wieso "const observer" "undefined" ist, und wie ich den Observer korrekt deaktiviere.

(function() {
    'use strict';
    const observer = new MutationObserver(function(mutations) {}).observe(document.documentElement, {childList: true, subtree: true});
    window.addEventListener('DOMContentLoaded', (event) => {observer.disconnect()})
})();

Hat jemand ne Idee?

akzeptierte Antworten

  1. Hat jemand ne Idee?

    Der Rückgabewert von MutationObserver.prototype.observe ist undefined.

    1. Ich werde daraus nicht schlau.

      'const observer' und 'observer.disconnect()' sind doch beide im gleichen Scope? In diversen Beispielen im Netz ist das auch so angegeben.

      Was übersehe ich?

      1. Hallo,

        Ich werde daraus nicht schlau.

        'const observer' und 'observer.disconnect()' sind doch beide im gleichen Scope? In diversen Beispielen im Netz ist das auch so angegeben.

        Was übersehe ich?

        Dein observer ist kein observer, sondern ein observer.observe.

        Gruß
        Kalk

        1. Danke!

          Lösung 1 wäre also:

          (function() {
              'use strict';
              const observer = new MutationObserver(function(mutations) {});
              observer.observe(document.documentElement, {childList: true, subtree: true});
              window.addEventListener('DOMContentLoaded', (event) => {observer.disconnect()})
          })();
          

          und Lösung 2:

          (function() {
              'use strict';
              const observer = new MutationObserver(function(mutations) {
              if (document.readyState == "complete"){this.disconnect();}
              });
              observer.observe(document.documentElement, {childList: true, subtree: true});
          })();
          
          1. Hallo Raik,

            ich habe zu lange das APL Zitat gesucht, daher kam meine Antwort zu spät.

            Die beiden Varianten initialisieren die observer-Variable jetzt richtig.

            Der Zeitpunkt des Disconnect ist aber unterschiedlich. Der readyState wechselt beim "DOMContentLoaded" Event auf "interactive". Erst beim "load" Event wechselt er auf "complete".

            Unterschied ist, ob außer dem DOM auch die externen Ressourcen (Stylesheets, Bilder) geladen sind.

            Rolf

            --
            sumpsi - posui - obstruxi
      2. Hallo Raik,

        viele Programmierer träumen davon, einzeilige Programme beliebiger Komplexität schreiben zu können. Das gelingt aber nur mit APL[1].

        (function() {
            'use strict';
            const observer = new MutationObserver(function(mutations) {})
                             .observe(document.documentElement,
                                      {childList: true, subtree: true});
            window.addEventListener('DOMContentLoaded', 
                                    (event) => {observer.disconnect()})
        })();
        

        und

        (function() {
            'use strict';
            const observer = new MutationObserver(function(mutations) {});
            observer.observe(document.documentElement,
                             {childList: true, subtree: true});
            window.addEventListener('DOMContentLoaded',
                                    (event) => {observer.disconnect()})
        })();
        

        sind nicht ganz das Gleiche.

        Rolf

        --
        sumpsi - posui - obstruxi

        1. APL, A Programming Language - exotische Zeichenschrift der kyrillischen Mönche, mit der angeblich einzeilige Programme beliebiger Komplexität geschrieben werden können ↩︎