How do you get a stack trace for a triggered MutationObserver?

Question

First off, this is not a "How to create a mutation observer?" post and I have seen the APIs. I was wondering if anyone knows a way to display the "source" of when a mutation occurred. It would most likely be some sort of workaround - I can't see any mention of this in API docs. I am trying to find out where an element is getting its `display` in `style` set to `none`. My code looks like this: ``` var observer = new MutationObserver(function(mutations) { mutations.forEach(function (mutation) { if (mutation.attributeName === "style") { var extendedMutation = _.extend({}, mutation, { newValue: $(mutation.target).attr("style") }); console.log(extendedMutation); } }); }); observer.observe(row.element[0], { attributes: true, attributeOldValue: true }); ``` I have several mutation events and they look along the lines of this: ``` { addedNodes: NodeList[] attributeName: "style" attributeNamespace: null newValue: "display: none;" nextSibling: null oldValue: "" previousSibling: null removedNode…

Accepted Answer

I know this thread is pretty old, but as nowadays there's a tool from Chrome to trace asynchronous call, I would like to mention it.

Chrome call stack Async option which I think would fulfill back trace of an asynchronous call. This option can be found in Developer tools -> Call stack tab. And by switching on the Async option and put break point on MutationObserver callback function, we would be able to see the full call stack.

Hope it helps.

How do you get a stack trace for a triggered MutationObserver?

Solution

Problem