Kineticjs Image Cache not working in ver 5.1

Question

I recently tried to upgrade to kineticjs 5.1.0 from 5.0.1 after the upgrade the cache function doesn't seem to work for images.

I have made a fiddle that reproduces the code using the animals on beach game tutorial.

here is the fiddle with 5.1.0 animals on beach tutorial with 5.1.0

animal.cache();
animal.drawHitFromCache();
animal.filters([
          Kinetic.Filters.Blur,
          Kinetic.Filters.Brighten
        ]);

here is the fiddle with 5.0.1 animals on beach tutorial with 5.0.1

animal.cache();
animal.drawHitFromCache();
animal.filters([
          Kinetic.Filters.Blur,
          Kinetic.Filters.Brighten
        ]);

What do I need to change to get this tutorial to work with 5.1.0

Answer 1

This fiddles will not work, because of cross-domain limitations. Look at this demo: http://jsbin.com/wicav/2/edit. Works fine with v5.1.0

image.cache();
image.drawHitFromCache();
image.filters([
          Kinetic.Filters.Blur,
          Kinetic.Filters.Brighten
]);
image.blurRadius(10);

update: (for v5.1.0) You have to apply filters AFTER you added shape to layer, until such problem will be fixed.