diff --git a/src/shapes/image.class.js b/src/shapes/image.class.js index db59e8f02ca..e7b8a58c854 100644 --- a/src/shapes/image.class.js +++ b/src/shapes/image.class.js @@ -163,6 +163,10 @@ * @chainable */ setElement: function(element, options) { + var backend = fabric.filterBackend; + if (backend && backend.evictCachesForKey) { + backend.evictCachesForKey(this.cacheKey); + } this._element = element; this._originalElement = element; this._initConfig(options); diff --git a/test/unit/image.js b/test/unit/image.js index bcbf56915ca..eae23ec67e6 100644 --- a/test/unit/image.js +++ b/test/unit/image.js @@ -244,10 +244,29 @@ assert.ok(typeof image.setElement === 'function'); var elImage = _createImageElement(); + assert.notEqual(image.getElement(), elImage); assert.equal(image.setElement(elImage), image, 'chainable'); assert.equal(image.getElement(), elImage); assert.equal(image._originalElement, elImage); + done(); + }); + }); + QUnit.test('setElement resets the webgl cache', function(assert) { + var done = assert.async(); + var fabricBackend = fabric.filterBackend; + createImageObject(function(image) { + fabric.filterBackend = { + textureCache: {}, + evictCachesForKey: function(key) { + delete this.textureCache[key]; + } + }; + var elImage = _createImageElement(); + fabric.filterBackend.textureCache[image.cacheKey] = 'something'; + assert.equal(image.setElement(elImage), image, 'chainable'); + assert.equal(fabric.filterBackend.textureCache[image.cacheKey], undefined); + fabric.filterBackend = fabricBackend; done(); }); });