如何在 Chrome 扩展程序中测试用 Jasmine 打开新标签页？

Question

我正在构建 chrome 扩展程序，但在让测试按我希望的方式工作时遇到了一些问题。我只需转到以 tests.html 结尾的扩展 url 即可访问此页面。

假设我想测试以下非常简单的场景：新选项卡在 chrome 中打开并加载，我的扩展程序检测到此事件，新选项卡添加到我的应用程序中的选项卡数组中。我所有的 Jasmine 测试都在一个单独的扩展页面中。

我尝试了以下方法，但都失败了。

一，尝试用一些超时（加载页面所需）调用 Jasmine“预期”。

describe("Tab collection", function () {
    it("after opening new tab it should be in app.tabs", function () { 
        chrome.tabs.create({"url":"http://www.google.com"});
        setTimeout(function () {
            expect(app.tabs.length).toBe(1);
            console.log("app.tabs.length after timeout", app.tabs.length);
        },100);
    });

Console.log 没有记录任何内容，测试是绿色的，甚至很明显它没有运行。

二，尝试在 chrome.tabs.create 回调函数中运行 'expect'。

    it("after opening new tab it shoule be in app.tabs", function () {
        chrome.tabs.create({"url":"http://www.google.com"}, function () {
            expect(app.tabs.length).toBe(1); //
            console.log("app.tabs.length in callback to chrome.tabs.create",app.tabs.length); 
        })
    });
});

Console.log 记录为 0，但由于某些原因测试通过。为什么 app.tabs.length 为 0 会通过？

第三种情况涉及在打开新的 chrome 标签后运行我的所有测试。有点意思

chrome.tabs.open({some_url},function (tab) {
    execJasmine()
    chrome.tabs.remove(tab['id'])
})

这可行，但非常不方便，我的所有测试现在都使用这个打开的选项卡运行。它真的不允许我测试东西。

第四次我尝试用 Jasmine BeforeEach 来做到这一点

beforeEach(function () {
    chrome.tabs.create(some_url);
}); 

这最接近没问题，但现在测试失败，app.tabs.length 为 0，因为调用测试套件时页面尚未加载。

有没有人遇到过类似的问题？如何测试描述的场景？

Answer 1

您的测试是同步的。您必须在it 的回调中声明第二个参数以使您的测试异步：

describe("Tab collection", function () {
    it("after opening new tab it should be in app.tabs", function(done) {
        //                                                        ^^^^
        chrome.tabs.create({"url":"http://www.google.com"}, function() {
            expect(app.tabs.length).toBe(1);
            console.log("app.tabs.length after timeout", app.tabs.length);
            done(); // <------
        });
    });
    // ...
});