Merge pull request #3375 from plotly/make-template-div-id

Add support for div id as 1st arg to Plotly.makeTemplate

Author: etpinard

src/plot_api/template_api.js

@@ -24,13 +24,14 @@ var dfltConfig = require('./plot_config');
  * Note: separated from the rest of templates because otherwise we get circular
  * references due to PlotSchema.
  *
- * @param {object|DOM element} figure: The figure to base the template on
+ * @param {object|DOM element|string} figure: The figure to base the template on
  *     should contain a trace array `figure.data`
  *     and a layout object `figure.layout`
  * @returns {object} template: the extracted template - can then be used as
  *     `layout.template` in another figure.
  */
 exports.makeTemplate = function(figure) {
+    figure = Lib.isPlainObject(figure) ? figure : Lib.getGraphDiv(figure);
     figure = Lib.extendDeep({_context: dfltConfig}, {data: figure.data, layout: figure.layout});
     Plots.supplyDefaults(figure);
     var data = figure.data || [];

test/jasmine/tests/template_test.js

@@ -170,6 +170,40 @@ describe('makeTemplate', function() {
       .then(destroyGraphDiv)
       .then(done);
     });
+
+    it('works with div id', function(done) {
+        var mock = Lib.extendDeep({}, scatterFillMock);
+
+        var gd = document.createElement('div');
+        gd.id = 'myDiv';
+        document.body.appendChild(gd);
+
+        Plotly.newPlot('myDiv', mock)
+        .then(function() {
+            var template = Plotly.makeTemplate('myDiv');
+            delete(template.layout.xaxis);
+            delete(template.layout.yaxis);
+            expect(template).toEqual({
+                data: {scatter: [
+                  {fill: 'tonext', line: {shape: 'spline'}},
+                  {fill: 'tonext'},
+                  {fill: 'toself'}
+                ] },
+                layout: {
+                    title: {
+                        text: 'Fill toself and tonext'
+                    },
+                    width: 400,
+                    height: 400
+                }
+            });
+        })
+        .catch(failTest)
+        .then(function() {
+            document.body.removeChild(gd);
+        })
+        .then(done);
+    });
 });
 
 // statics of template application are all covered by the template mock