Wie testen Sie einen JavaScript-Bild-Onerror-Rückruf in Jasmine?

Question

Ich habe ein URL-Ladeprogramm, das ich in einer URL übergeben kann und es wird ein dynamisch erstelltes JavaScript new Image() und seine src -Eigenschaft verwenden, um die URL zu laden. Falls ein Fehler auftritt, logge ich ihn auf der Konsole ein.

Der vereinfachte JavaScript-Code wäre:

var UrlLoader = function(url) { 
    this.url = url; 
    this.image = new Image(); 

    this.image.onerror = function() { 
    console.log("image error"); 
    }; 

    this.load = function() { 
    this.image.src = this.url; 
    }; 
} 

jetzt meine Frage ist, wie kann ich das testen console.log("image error") ausgeführt wird, wenn ich

var urlLoader = new UrlLoader(); 
urlLoader.load("any.png"); 

Ich betreibe ein JSFiddle with the test suite set up geschaffen, aber andernfalls specs und würde jede Hilfe bei der Ermittlung eines Wegs zum Testen der UrlLoader schätzen.

Answer 1

Dies ist Zeile Sie, wenn log Methode

expect(console.log).toHaveBeenCalledWith("image error"); 

genannt, um zu überprüfen wurde Es ist richtig, aber Problem, dass onerror Handler ist noch nicht bis zu diesem Zeitpunkt genannt, weil Fehler Ereignis ausgelöst werden/behandelt nicht sofort, sondern später asynchron

Sie sollten Ihren Testfall dieser

describe("A suite", function() { 

    beforeEach(function(done){ 
    spyOn(console, "log"); 

    var imageLoader = new ImageLoader("any.png"); 
    imageLoader.image.addEventListener("error", function() { 
     done(); 
    }); 
    imageLoader.load(); 
    }); 

    it("contains spec with an expectation", function() { 
    expect(console.log).toHaveBeenCalledWith("image error"); 
    }); 
}); 

Sie finden mehr ändern auf das Testen asynchroner Code mit Jasmi ne in this article