From 77cc5d59392532ce43ca306614d19ac0b6d3180c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=89tienne=20T=C3=A9treault-Pinard?= <etienne@plot.ly>
Date: Mon, 27 Jun 2016 14:55:55 -0400
Subject: [PATCH] heatmap: set canvas dataURL in merge selection [fixes #692]

---
 src/traces/heatmap/plot.js         |  4 ++--
 test/jasmine/tests/heatmap_test.js | 37 ++++++++++++++++++++++++++++++
 2 files changed, 39 insertions(+), 2 deletions(-)

diff --git a/src/traces/heatmap/plot.js b/src/traces/heatmap/plot.js
index d2710bded24..bc13f66d163 100644
--- a/src/traces/heatmap/plot.js
+++ b/src/traces/heatmap/plot.js
@@ -382,7 +382,6 @@ function plotOne(gd, plotinfo, cd) {
 
     image3.enter().append('svg:image').attr({
         xmlns: xmlnsNamespaces.svg,
-        'xlink:href': canvas.toDataURL('image/png'),
         preserveAspectRatio: 'none'
     });
 
@@ -390,7 +389,8 @@ function plotOne(gd, plotinfo, cd) {
         height: imageHeight,
         width: imageWidth,
         x: left,
-        y: top
+        y: top,
+        'xlink:href': canvas.toDataURL('image/png')
     });
 
     image3.exit().remove();
diff --git a/test/jasmine/tests/heatmap_test.js b/test/jasmine/tests/heatmap_test.js
index 32c6aea150a..0555d590ae4 100644
--- a/test/jasmine/tests/heatmap_test.js
+++ b/test/jasmine/tests/heatmap_test.js
@@ -334,6 +334,43 @@ describe('heatmap plot', function() {
             done();
         });
     });
+
+    it('should be able to restyle', function(done) {
+        var mock = require('@mocks/13.json'),
+            mockCopy = Lib.extendDeep({}, mock),
+            gd = createGraphDiv();
+
+        function getImageURL() {
+            return d3.select('.hm > image').attr('href');
+        }
+
+        var imageURLs = [];
+
+        Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
+            imageURLs.push(getImageURL());
+
+            return Plotly.restyle(gd, 'colorscale', 'Greens');
+        }).then(function() {
+            imageURLs.push(getImageURL());
+
+            expect(imageURLs[0]).not.toEqual(imageURLs[1]);
+
+            return Plotly.restyle(gd, 'colorscale', 'Reds');
+        }).then(function() {
+            imageURLs.push(getImageURL());
+
+            expect(imageURLs[1]).not.toEqual(imageURLs[2]);
+
+            return Plotly.restyle(gd, 'colorscale', 'Greens');
+        }).then(function() {
+            imageURLs.push(getImageURL());
+
+            expect(imageURLs[1]).toEqual(imageURLs[3]);
+
+            done();
+        });
+
+    });
 });
 
 describe('heatmap hover', function() {