Chrome - 打破属性修改

Question

我希望在脚本更改class属性时中断.

我尝试了"Break on:属性修改",
但它没有破坏.

Answer 1

解决方法

以下代码仅在您的浏览器支持MutationObserver时才有效.打开开发人员工具F12,在控制台中使用并执行以下代码:

var Spy = /** @class */ (function () {
    function Spy() {
    }
    Spy.observe = function (targetNode) {
        Spy.observer.observe(targetNode, Spy.config);
    };
    Spy.disconnect = function () {
        Spy.observer.disconnect();
    };
    Spy["break"] = function () {
        debugger;
    };
    Spy.config = { attributes: true, childList: true };
    Spy.observer = new MutationObserver(Spy["break"]);
    return Spy;
}());

之后,您必须观察要跟踪更改的节点,例如:

Spy.observe(document.getElementById("notify-container"));

现在,调试器将破坏对此元素所做的属性更改.开发人员工具必须保持打开才能使其正常工作.

当调试器中断时,您现在可以在Sourcestab 下看到哪个函数进行了更改:

要停止跟踪使用:

Spy.disconnect();