Question

我正在使用sinon.js / qunit编写功能测试。我编写测试的页面工作正常，但是我在测试时用假冒伪装服务器响应时获取jstree对象来加载其初始数据时遇到了问题。

为了确保我正在测试的页面和我正在编写的测试使用相同的响应数据，我创建了一个名为change_dialog_fixture的javascript对象fixture，我将其加载以代替从服务器返回的数据。您可以在以下getJSON的调用中看到此内容：

    $.getJSON(axes_url, function(data) {
        //ANALYSIS_PAPER.change_data = data;
        ANALYSIS_PAPER.change_data = change_dialog_fixture;
        hide_throbber(); // sinon confirms this is called
        create_change_dialog();
        console.log(ANALYSIS_PAPER.change_data); // prints
    });

通过逐步执行代码，我可以看到，对于两个页面（工作页面和测试页面），被操作到jstree对象（通过create_change_dialog函数）的DOM元素直到 getJSON之后返回。

在getJSON返回后，工作页面“聚焦”创建的树并加载ANALYSIS_PAPER.change_data中给出的JSON数据以创建jstree结构。在qunit测试页面上，这不会发生。 DOM元素仍然是一个jstree对象，但该元素是完全空的。

正如所包含的代码中的注释所示，hide_throbber被调用（我正在使用sinon spies对此进行测试）并打印console.log语句。没有引发异常，也没有指出错误。失败是完全沉默的。

我认为这可能与时间安排有关，因此我将我的qunit测试设为asyncTest并将start();添加到传递给getJSON的回调函数中，但这并未改变任何内容。我也采用了不同的方法并使用server.autoRespond = true编辑了fakeServer，但这也没有解决问题。

任何关于进一步测试的建议或关于可能导致此问题的想法都是非常受欢迎的。感谢。

Answer 1

问题在于，由于jstree是动画的，因此树实际上是异步加载的。因为动画在其核心使用window.setTimeout并且sinon可以使用其fake timers伪造此函数，因此添加一些click.tick语句可以解决问题。例如：

$loadTreeButton.trigger("click");
this.clock.tick(1000);
equal(partOfTheTree.length, 1, "Component 1 loaded");

jstree's core documentation page上列出的loaded.jstree函数通过暗示jstree异步加载，让我朝着正确的方向前进。

与sinon.js一起使用时，jstree未正确初始化

1 个答案: