调试dojo小部件事件- setTimeout vs callstack

debugging dojo widget events - setTimeout vs the callstack

本文关键字:setTimeout vs callstack 事件 dojo 小部 调试      更新时间:2023-09-26

通常,我将向dojo小部件添加事件处理程序。例如,更改事件的处理程序。然后,代码中的某些内容将触发更改事件——但我不知道是什么。通常,您只需在您喜欢的调试器中设置一个断点,然后查看调用堆栈,就可以快速跟踪导致事件触发的原因。但是,经常我的活动调用栈结束在dojo的lang.hitch,我猜是因为dojo传递函数到window.setTimeout,所以大多数有用的信息在调用栈中消失,当函数在js事件队列上执行。

下面是一个小的可执行示例。

<b id="cb"></b>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.3/dojo/dojo.js"></script>
<script>
require(["dijit/form/CheckBox", "dojo/domReady!"], function(CheckBox){
    var checkBox = new CheckBox({
        onChange: function(b){
            console.log(b);
        }
    }, "cb");
    // manually trigger change event.
    // i want to be able to see this line in the debuggers call stack.
    checkBox.set("checked", true);
});
</script>

有没有一种简单的方法来克服这个恼人的调试障碍?比如,设置告诉dojo不通过setTimeout执行事件处理程序?

在这种情况下,似乎_WidgetBase.js defer()是调用setTimeout的人,但我知道我在dojo中经常遇到这个问题,并希望有一个比编辑他们的源代码更好的方法。

Chrome金丝雀(构建35及更高)现在有调试异步javascript的能力,这是你想做的。参见文章调试异步JavaScript与Chrome DevTools