make make_schema and validate tests easier to read for a front end dev

Author: archmoj

tasks/test_mock.js

@@ -1,16 +1,17 @@
 var minimist = require('minimist');
-var jsdom = require('jsdom');
 var path = require('path');
 var fs = require('fs');
+var JSDOM = require('jsdom').JSDOM;
+
+var window = new JSDOM('', {runScripts: 'dangerously'}).window;
 
-var plotlyServerDom = new jsdom.JSDOM('', { runScripts: 'dangerously'});
 // Mock a few things that jsdom doesn't support out-of-the-box
-plotlyServerDom.window.URL.createObjectURL = function() {};
+window.URL.createObjectURL = function() {};
 
-// Run Plotly inside jsdom
-var plotlyJsPath = require.resolve('../build/plotly.js');
-var plotlyJsSource = fs.readFileSync(plotlyJsPath, 'utf-8');
-plotlyServerDom.window.eval(plotlyJsSource);
+var scriptEl = window.document.createElement('script');
+scriptEl.textContent = fs.readFileSync('build/plotly.js', { encoding: 'utf-8' });
+window.document.body.appendChild(scriptEl);
+var Plotly = window.Plotly;
 
 var pathToRoot = path.join(__dirname, '..');
 var pathToMocks = path.join(pathToRoot, 'test', 'image', 'mocks');
@@ -39,7 +40,7 @@ for(var i = 0; i < list.length; i++) {
 
     var filename = path.join(pathToMocks, name + '.json');
     var fig = JSON.parse(fs.readFileSync(filename));
-    var out = plotlyServerDom.window.Plotly.validate(fig.data, fig.layout);
+    var out = Plotly.validate(fig.data, fig.layout);
 
     fail = false;
     assert(name, out);

tasks/test_plain_obj.js

@@ -1,19 +1,20 @@
-var jsdom = require('jsdom');
 var fs = require('fs');
+var JSDOM = require('jsdom').JSDOM;
+
+var window = new JSDOM('', {runScripts: 'dangerously'}).window;
 
-var plotlyServerDom = new jsdom.JSDOM('', { runScripts: 'dangerously'});
 // Mock a few things that jsdom doesn't support out-of-the-box
-plotlyServerDom.window.URL.createObjectURL = function() {};
+window.URL.createObjectURL = function() {};
 
-// Run Plotly inside jsdom
-var plotlyJsPath = require.resolve('../build/plotly.js');
-var plotlyJsSource = fs.readFileSync(plotlyJsPath, 'utf-8');
-plotlyServerDom.window.eval(plotlyJsSource);
+var scriptEl = window.document.createElement('script');
+scriptEl.textContent = fs.readFileSync('dist/plotly.js', { encoding: 'utf-8' });
+window.document.body.appendChild(scriptEl);
+var Plotly = window.Plotly;
 
 var assertValidate = function(fig, exp) {
     console.log(fig);
 
-    var errorList = plotlyServerDom.window.Plotly.validate(fig.data, fig.layout);
+    var errorList = Plotly.validate(fig.data, fig.layout);
 
     if(exp) {
         if(errorList !== undefined) throw 'should be valid:';

tasks/util/make_schema.js

@@ -2,21 +2,19 @@ var fs = require('fs');
 var path = require('path');
 var JSDOM = require('jsdom').JSDOM;
 
-module.exports = function makeSchema(plotlyPath, schemaPath) {
-    return function() {
-        var plotlyjsCode = fs.readFileSync(plotlyPath, 'utf-8');
-
-        var w = new JSDOM('', {runScripts: 'dangerously'}).window;
+var window = new JSDOM('', {runScripts: 'dangerously'}).window;
 
-        // jsdom by itself doesn't support getContext, and adding the npm canvas
-        // package is annoying and platform-dependent.
-        // see https://github.com/tmpvar/jsdom/issues/1782
-        w.HTMLCanvasElement.prototype.getContext = function() { return null; };
-        w.URL.createObjectURL = function() { return null; };
+// Mock a few things that jsdom doesn't support out-of-the-box
+window.URL.createObjectURL = function() {};
 
-        w.eval(plotlyjsCode);
+module.exports = function makeSchema(plotlyPath, schemaPath) {
+    return function() {
+        var scriptEl = window.document.createElement('script');
+        scriptEl.textContent = fs.readFileSync(plotlyPath, { encoding: 'utf-8' });
+        window.document.body.appendChild(scriptEl);
+        var Plotly = window.Plotly;
 
-        var plotSchema = w.Plotly.PlotSchema.get();
+        var plotSchema = Plotly.PlotSchema.get();
         var plotSchemaStr = JSON.stringify(plotSchema, null, 1);
         fs.writeFileSync(schemaPath, plotSchemaStr);