Skip to content

Instantly share code, notes, and snippets.

@stewartknapman
Last active March 28, 2024 14:28
Show Gist options
  • Star 8 You must be signed in to star a gist
  • Fork 3 You must be signed in to fork a gist
  • Save stewartknapman/71bff9a4e8b78fb1560614533d10a9eb to your computer and use it in GitHub Desktop.
Save stewartknapman/71bff9a4e8b78fb1560614533d10a9eb to your computer and use it in GitHub Desktop.
Find what code changed the DOM

Have you ever tried to track down which piece of javascript modified the DOM? Use a mutationObserver to monitor the DOM for changes. Then run console.trace() inside the callback. This will log a stack trace all the way back to the code that did the DOM modification. Basically copy and paste this code.

(function () {
var targetNode = document.querySelector('.my-selector'); // Set your selector for the parent container.
var config = { attributes: true, childList: true, subtree: true };
// Callback function to execute when mutations are observed
var callback = function(mutationsList, observer) {
console.log('mutationsList', mutationsList);
console.trace(); // This is the magic
};
var observer = new MutationObserver(callback);
observer.observe(targetNode, config);
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment