如何获得触发的MutationObserver的堆栈跟踪？

Question

首先，这不是“如何创建变异观察者？”发帖，我看过API。

我想知道是否有人知道如何显示突变发生时的“来源”。它很可能是某种解决方法 - 我在API文档中看不到任何提及。

我正在尝试找出元素在display中将其style设置为none的位置。

我的代码如下所示：

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 });

我有服务器突变事件，他们看起来像这样：

{
    addedNodes: NodeList[]

    attributeName: "style"

    attributeNamespace: null

    newValue: "display: none;"

    nextSibling: null

    oldValue: ""

    previousSibling: null

    removedNodes: NodeList[]

    target: li#d526d311-e6e0-4ef1-a3a1-f8686bbb468f.group

    type: "attributes"

}

我想知道JS来源的来源！有什么想法吗？

请注意我已尝试过ctrl + f，但无济于事。

Debugger / Exception输出（尝试过针对Chrome的WebkitMutationObserver，结果相同）：

Answer 1

我知道这个帖子很老了，但是现在有一个来自Chrome的工具来跟踪异步调用，我想提一下。

Chrome调用堆栈异步选项，我认为它可以实现异步调用的跟踪。此选项可在开发人员工具中找到 - ＆gt;调用堆栈选项卡。通过打开Async选项并在MutationObserver回调函数上放置断点，我们就能看到完整的调用堆栈。

希望它有所帮助。

Answer 2

MutationObserver API是异步的，就像Ajax一样。考虑Chrome中的an example：

var xhr = new XMLHttpRequest();
xhr.open("GET", "/");
xhr.onload = function() { debugger; };
xhr.send();

正如您可能知道的那样，onload在当前函数执行完之后的某个时间才会运行。因此，当debugger中的onload调用运行时，函数调用堆栈必须清除，onload处理程序在新堆栈上运行。

您想知道属性变异发生的位置，但是您无法从堆栈跟踪中获取该信息 - 这就像尝试了解xhr.send()被调用的位置一样onload处理程序。