Merge pull request #418 from plotly/etienne-devtools

Etienne devtools improvements

Author: etpinard

devtools/test_dashboard/devtools.js

@@ -1,6 +1,12 @@
+'use strict';
+
+/* global Plotly:false */
+
 var Fuse = require('fuse.js');
 var mocks = require('../../build/test_dashboard_mocks.json');
 
+// put d3 in window scope
+var d3 = window.d3 = Plotly.d3;
 
 // Our gracious testing object
 var Tabs = {
@@ -35,8 +41,8 @@ var Tabs = {
     plotMock: function(mockName, id) {
         var mockURL = '/test/image/mocks/' + mockName + '.json';
 
-        window.Plotly.d3.json(mockURL, function(err, fig) {
-            window.Plotly.plot(Tabs.fresh(id), fig.data, fig.layout);
+        d3.json(mockURL, function(err, fig) {
+            Plotly.plot(Tabs.fresh(id), fig.data, fig.layout);
 
             console.warn('Plotting:', mockURL);
         });
@@ -47,12 +53,13 @@ var Tabs = {
         var gd = Tabs.getGraph(id);
 
         if(!gd._fullLayout || !gd._fullData) {
+            console.error('no graph with id ' + id + ' found.');
             return;
         }
 
         var image = new Image();
 
-        window.Plotly.Snapshot.toImage(gd, { format: 'png' }).on('success', function(img) {
+        Plotly.Snapshot.toImage(gd, { format: 'png' }).on('success', function(img) {
             image.src = img;
 
             var imageDiv = document.getElementById('snapshot');
@@ -72,7 +79,7 @@ var Tabs = {
         }
 
         for(var i = 0; i < plots.length; i++) {
-            window.Plotly.purge(plots[i]);
+            Plotly.purge(plots[i]);
         }
     },
 

devtools/test_dashboard/server.js

@@ -134,22 +134,23 @@ function writeFilePromise(path, contents) {
 function bundlePlotly() {
     b.bundle(function(err) {
         if(err) {
-            console.error('Error while bundling!', err);
+            console.error('Error while bundling!', JSON.stringify(String(err)));
+        } else {
+            console.log('Bundle updated at ' + new Date().toLocaleTimeString());
         }
 
         if(firstBundle) {
             open('http://localhost:' + PORT + '/devtools/test_dashboard');
             firstBundle = false;
         }
-        console.log('Bundle updated at ' + new Date().toLocaleTimeString());
     }).pipe(fs.createWriteStream(constants.pathToPlotlyBuild));
 }
 
 function bundleDevtools() {
     return new Promise(function(resolve, reject) {
         devtools.bundle(function(err) {
             if(err) {
-                console.error('Error while bundling!', err);
+                console.error('Error while bundling!', JSON.stringify(String(err)));
                 return reject(err);
             } else {
                 return resolve();

devtools/test_dashboard/style.css

@@ -61,4 +61,5 @@ header span{
 }
 .dashboard-plot{
   margin-bottom: 30px;
+  width: 1100px;
 }

package.json

@@ -35,9 +35,9 @@
     "test-syntax": "node test/syntax_test.js",
     "test-bundle": "node tasks/test_bundle.js",
     "test": "npm run citest-jasmine && npm run test-image && npm run test-syntax && npm run test-bundle",
-    "start": "npm run start-test_dashboard",
     "start-test_dashboard": "node devtools/test_dashboard/server.js",
     "start-image_viewer": "node devtools/image_viewer/server.js",
+    "start": "npm run start-test_dashboard",
     "baseline": "./tasks/baseline.sh",
     "preversion": "npm-link-check && npm dedupe",
     "version": "npm run build && git add -A dist src build",