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

Question

I'm building chrome extension and I'm having some trouble getting tests to work the way I'd like them to. I access this page by simply going to extension url ending tests.html.

Let's say I want to test the following very simple scenario: new tab is opened in chrome and it is loaded, this event is detected by my extension, new tab is added to array of tabs within my apps. I have all my Jasmine tests in a separate extension page.

I tried the following things, and they all fail.

One, trying to call Jasmine "expect" with some Timeout (needed for loading the page).

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 does not log anything, tests is green, even tough clearly it wasn't run.

Two, trying to run 'expect' in chrome.tabs.create callback function.

    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 logs 0, but for some reasons test passes. Why it passes if app.tabs.length is 0?

Third scenario involves running all my tests after opening new chrome tab. Something along the lines

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

this works, but is extremely inconvenient, all my tests now run with this open tab. It doesn't really allow me to test things.

Fourth I tried to do this with Jasmine BeforeEach

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

This is closest to being ok, but now the tests fails, app.tabs.length is 0, because the page is not yet loaded when the test suite is called.

Has anyone encountered simlar problems? How can I test described scenario?

Answer 1

Your test is synchronous. You have to declare a second parameter in the callback of it to make your test asynchronous:

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(); // <------
        });
    });
    // ...
});