Async Image loading in Jasmine 2.x

[Alexander]

Hi,

I want to load an image in a test to compare it against a canvas image data. Therefore I have to make sure images are fully loaded until I proceed with my expectations. In Jasmin 1.x this was pretty straightforward as i could just waitFor img.complete.
How do I accomplish the same thing with the done callbacks of Jasmine 2.x?

Here is an example code snippet, that fails randomly due to image not loaded in time.

it("should display single phase", function () { 
    var expected = new Image(); 
    expected.src= "base/test/img/canvas.png";

    // wait for the image to load....

    var canvas = $('.canvas').get(0);
    var actual = canvas.getContext('2d').getImageData(0,0,canvas.width, canvas.height);

    expect(actual).toImageDiffEqual(expected, 2);
});

Cheers
Alexander

[Greg Cobb]

You should be able to do something like this:

it("should display single phase", function (done) { 
    var expected = new Image(); 
    expected.src= "base/test/img/canvas.png";

    expected.onload(function(){

      var canvas = $('.canvas').get(0);

      var actual = canvas.getContext('2d').getImageData(0,0,canvas.width, canvas.height);
      expect(actual).toImageDiffEqual(expected, 2);

      done();

    });
});

--
You received this message because you are subscribed to the Google Groups "Jasmine" group.
To unsubscribe from this group and stop receiving emails from it, send an email to jasmine-js+...@googlegroups.com.
To post to this group, send email to jasmi...@googlegroups.com.
Visit this group at http://groups.google.com/group/jasmine-js.
For more options, visit https://groups.google.com/d/optout.