Update babel6->babel7, webpack4->webpack5

.eslintrc

@@ -4,6 +4,7 @@
     "plugin:xss/recommended"
   ],
   "plugins": [],
+  "root": true,
   "env": {
     "browser": true,
     "amd": true,

package.json

@@ -33,15 +33,25 @@
   },
   "license": "(LGPL-2.1 OR Artistic-2.0)",
   "dependencies": {
+    "@babel/core": "^7.26.9",
+    "@babel/preset-env": "^7.26.9",
+    "assert": "^2.1.0",
+    "babel-polyfill": "^6.26.0",
+    "browserify-zlib": "^0.2.0",
     "dompurify": "^3.2.4",
+    "eslint-plugin-xss": "^0.1.12",
     "express": "^4.15.4",
     "fs-extra": "^4.0.1",
     "node-fetch": "^2.2.0",
     "node-getopt": "^0.2.3",
     "normalize-wheel": "^1.0.1",
     "object-hash": "^1.3.1",
     "optimist": "^0.6.1",
-    "shelljs": "^0.7.8"
+    "path-browserify": "^1.0.1",
+    "process": "^0.11.10",
+    "shelljs": "^0.7.8",
+    "stream-browserify": "^3.0.0",
+    "vm-browserify": "^1.1.2"
   },
   "devDependencies": {
     "@gmod/bam": "^1.1.6",
@@ -54,13 +64,8 @@
     "@gmod/vcf": "^2.0.2",
     "ajv": "^6.2.1",
     "ava": "^0.25.0",
-    "babel-core": "^6.26.0",
     "babel-eslint": "^8.2.2",
-    "babel-loader": "^7.1.4",
-    "babel-plugin-transform-async-to-generator": "^6.24.1",
-    "babel-plugin-transform-es2015-classes": "^6.24.1",
-    "babel-polyfill": "^6.26.0",
-    "babel-preset-es2015-without-strict": "^0.0.4",
+    "babel-loader": "^9.2.1",
     "clean-webpack-plugin": "^0.1.18",
     "copy-webpack-plugin": "^4.6.0",
     "css-loader": "^2.0.0",
@@ -69,11 +74,11 @@
     "dojo": "^1.14.2",
     "dojo-dstore": "^1.1.1",
     "dojo-util": "^1.14.2",
-    "dojo-webpack-plugin": "^2.8.5",
+    "dojo-webpack-plugin": "^3.0.6",
     "dojox": "^1.14.2",
     "electron": "^3.0.12",
     "electron-packager": "^12.0.1",
-    "eslint": "^4.19.1",
+    "eslint": "8.0.0",
     "eslint-config-airbnb-base": "^12.1.0",
     "eslint-plugin-import": "^2.10.0",
     "eslint-plugin-xss": "^0.1.12",
@@ -93,8 +98,8 @@
     "uglifyjs-webpack-plugin": "^1.2.2",
     "url-loader": "^1.0.0",
     "util-deprecate": "^1.0.2",
-    "webpack": "^4.26.1",
-    "webpack-cli": "^3.1.2",
+    "webpack": "^5.98.0",
+    "webpack-cli": "^6.0.1",
     "whatwg-fetch": "^2.0.4",
     "yarn": "^1.16.0"
   }

src/JBrowse/Browser.js

@@ -1,7 +1,5 @@
 const url = cjsRequire('url')
 
-import dompurify from 'dompurify'
-
 import Welcome from './View/Resource/Welcome.html'
 import Welcome_old from './View/Resource/Welcome_old.html'
 
@@ -464,15 +462,14 @@ define([
       }
 
       if (error) {
-        console.log(error)
         var errors_div = dojo.byId('fatal_error_list')
         dojo.create(
           'div',
           {
             className: 'error',
 
             // eslint-disable-next-line xss/no-mixed-html
-            innerHTML: dompurify.sanitize(error),
+            innerHTML: Util.escapeHTML(error),
           },
           errors_div,
         )
@@ -530,7 +527,7 @@ define([
 
           error = dojoxHtmlEntities.encode(error)
         }
-        return dompurify.sanitize(error)
+        return Util.escapeHTML(error)
       }
 
       if (!this.renderedFatalErrors) {
@@ -792,7 +789,6 @@ define([
     },
 
     _loadCSS: function (css) {
-      console.log({ css })
       var deferred = new Deferred()
 
       if (typeof css == 'object') {
@@ -918,7 +914,7 @@ define([
         var about = this.browserMeta()
         var aboutDialog = new InfoDialog({
           title: `About ${about.title}`,
-          content: dompurify.sanitize(about.description),
+          content: Util.escapeHTML(about.description),
           className: 'about-dialog',
         })
 
@@ -1259,7 +1255,7 @@ define([
               {
                 className: 'dataset-name',
                 // eslint-disable-next-line xss/no-mixed-html
-                innerHTML: dompurify.sanitize(datasetName),
+                innerHTML: Util.escapeHTML(datasetName),
                 title: 'name of current dataset',
                 style: {
                   display: datasetName ? 'inline-block' : 'none',
@@ -3080,7 +3076,7 @@ define([
 
           new InfoDialog({
             title: 'Not found',
-            content: `Not found: <span class="locString">${dompurify.sanitize(
+            content: `Not found: <span class="locString">${Util.escapeHTML(
               loc,
             )}</span>`,
             className: 'notfound-dialog',
@@ -4039,7 +4035,6 @@ define([
                 end: ref.end,
                 length: ref.length,
               })
-              //console.log( locstring, locstring.length );
               return locstring.length
             }.call(this) ||
             20

src/JBrowse/GenomeView.js

@@ -1,5 +1,4 @@
 import normalizeWheel from 'normalize-wheel'
-import dompurify from 'dompurify'
 
 define([
   'dojo/_base/declare',
@@ -246,7 +245,7 @@ define([
               hint == 'avatar'
                 ? dojo.create('div', {
                     // eslint-disable-next-line xss/no-mixed-html
-                    innerHTML: dompurify.sanitize(
+                    innerHTML: Util.escapeHTML(
                       trackConfig.key || trackConfig.label,
                     ),
                     className: 'track-label dragging',
@@ -1689,7 +1688,7 @@ define([
       var absfunc = args.xToBp || dojo.hitch(this, 'absXtoBp')
       //set text to BP location (adding 1 to convert from interbase)
       // eslint-disable-next-line xss/no-mixed-html
-      label.innerHTML = dompurify.sanitize(
+      label.innerHTML = Util.escapeHTML(
         Util.addCommas(Math.floor(absfunc(numX)) + 1),
       )
 

src/JBrowse/Util.js

@@ -1,6 +1,7 @@
 const url = cjsRequire('url')
-
-import dompurify from 'dompurify'
+// has to be a cjsReequire and not an import or it adds a 'use strict' which
+// makes this.inherited not work
+const dompurify = cjsRequire('dompurify')
 
 /**
  * Miscellaneous utility functions.
@@ -9,7 +10,6 @@ define([
   'dojo/_base/array',
   'dojo/_base/lang',
   'dojo/Deferred',
-
   'dojox/lang/functional/object',
   'dojox/lang/functional/fold',
 ], function (array, lang, Deferred) {

src/JBrowse/View/DetailsMixin.js

@@ -1,4 +1,3 @@
-import dompurify from 'dompurify'
 /**
  * Mixin that provides generic functions for displaying nested data.
  */
@@ -109,7 +108,7 @@ define([
         {
           className: 'field_container',
           // eslint-disable-next-line xss/no-mixed-html
-          innerHTML: dompurify.sanitize(
+          innerHTML: Util.escapeHTML(
             `<h2 class="field ${class_}"${titleAttr}>${formatted_title}</h2>`,
           ),
         },
@@ -124,7 +123,7 @@ define([
       var count = this.renderDetailValue(valueContainer, title, val, f, class_)
       if (typeof count == 'number' && count > 4) {
         // eslint-disable-next-line xss/no-mixed-html
-        query('h2', fieldContainer)[0].innerHTML = dompurify.sanitize(
+        query('h2', fieldContainer)[0].innerHTML = Util.escapeHTML(
           `${formatted_title} (${count})`,
         )
       }

src/JBrowse/View/Dialog/OpenDirectory.js

@@ -1,5 +1,3 @@
-import dompurify from 'dompurify'
-
 define([
   'dojo/_base/declare',
   'dojo/_base/array',
@@ -116,7 +114,7 @@ define([
 
         on(self.input, 'change', function (here) {
           // eslint-disable-next-line xss/no-mixed-html
-          dojo.byId('data_dir_list').innerHTML = dompurify.sanitize(
+          dojo.byId('data_dir_list').innerHTML = Util.escapeHTML(
             self.input.value,
           )
           thisB.datadir = self.input.value
@@ -127,7 +125,7 @@ define([
           // we are insensitive to changes in whitespace
           if (self.input.value != thisB.datadir && !thisB.localopened) {
             // eslint-disable-next-line xss/no-mixed-html
-            dojo.byId('data_dir_list').innerHTML = dompurify.sanitize(
+            dojo.byId('data_dir_list').innerHTML = Util.escapeHTML(
               self.input.value,
             )
             thisB.datadir = self.input.value
@@ -195,7 +193,7 @@ define([
             thisB.datadir = paths[0]
             thisB.localopened = true
             // eslint-disable-next-line xss/no-mixed-html
-            dojo.byId('data_dir_list').innerHTML = dompurify.sanitize(paths[0])
+            dojo.byId('data_dir_list').innerHTML = Util.escapeHTML(paths[0])
           }
         })
 

src/JBrowse/View/Dialog/Preferences.js

@@ -1,5 +1,3 @@
-import dompurify from 'dompurify'
-
 define([
   'dojo/_base/declare',
   'dojo/_base/array',
@@ -100,7 +98,7 @@ define([
             })
             thisB.plugins.push(paths[0])
             // eslint-disable-next-line xss/no-mixed-html
-            dojo.byId('plugins_list').innerHTML += dompurify.sanitize(
+            dojo.byId('plugins_list').innerHTML += Util.escapeHTML(
               `${paths}<br/>`,
             )
           }

src/JBrowse/View/Dialog/QuickHelp.js

@@ -1,9 +1,8 @@
-import dompurify from 'dompurify'
-
-define(['dojo/_base/declare', 'JBrowse/View/InfoDialog'], function (
-  declare,
-  InfoDialog,
-) {
+define([
+  'dojo/_base/declare',
+  'JBrowse/View/InfoDialog',
+  'JBrowse/Util',
+], function (declare, InfoDialog, Util) {
   return declare(InfoDialog, {
     title: 'JBrowse Help',
 
@@ -13,7 +12,7 @@ define(['dojo/_base/declare', 'JBrowse/View/InfoDialog'], function (
 
       if (!args.content && !args.href) {
         // make a div containing our help text
-        this.content = dompurify.sanitize(this.defaultContent)
+        this.content = Util.escapeHTML(this.defaultContent)
       }
     },
 

src/JBrowse/View/Dialog/Search.js

@@ -1,5 +1,3 @@
-import dompurify from 'dompurify'
-
 define([
   'dojo/_base/declare',
   'dojo/dom-construct',
@@ -56,7 +54,7 @@ define([
           {
             className: 'prompt',
             // eslint-disable-next-line xss/no-mixed-html
-            innerHTML: dompurify.sanitize(this.prompt),
+            innerHTML: Util.escapeHTML(this.prompt),
           },
           container,
         )

src/JBrowse/View/Dialog/SetTrackHeight.js

@@ -1,12 +1,11 @@
-import dompurify from 'dompurify'
-
 define([
   'dojo/_base/declare',
   'dojo/dom-construct',
   'dijit/form/NumberSpinner',
   'JBrowse/View/Dialog/WithActionBar',
   'dijit/form/Button',
-], function (declare, dom, NumberSpinner, ActionBarDialog, Button) {
+  'JBrowse/Util',
+], function (declare, dom, NumberSpinner, ActionBarDialog, Button, Util) {
   return declare(ActionBarDialog, {
     /**
      * Dijit Dialog subclass that pops up prompt for the user to
@@ -67,7 +66,7 @@ define([
         this.heightSpinner.domNode,
         dom.create('span', {
           // eslint-disable-next-line xss/no-mixed-html
-          innerHTML: dompurify.sanitize(this.msg || ' pixels'),
+          innerHTML: Util.escapeHTML(this.msg || ' pixels'),
         }),
       ])
 

src/JBrowse/View/FASTA.js

@@ -1,5 +1,3 @@
-import dompurify from 'dompurify'
-
 define([
   'dojo/_base/declare',
   'dojo/dom-construct',
@@ -73,7 +71,7 @@ define([
       )
       var c = 0
       // eslint-disable-next-line xss/no-mixed-html
-      textArea.innerHTML = dompurify.sanitize(
+      textArea.innerHTML = Util.escapeHTML(
         text.replace(/\n/g, function () {
           return c++ ? '' : '\n'
         }),

src/JBrowse/View/FileDialog.js

@@ -1,5 +1,3 @@
-import dompurify from 'dompurify'
-
 define([
   'dojo/_base/declare',
   'dojo/_base/array',
@@ -188,7 +186,7 @@ define([
           className: 'intro',
 
           // eslint-disable-next-line xss/no-mixed-html
-          innerHTML: dompurify.sanitize(
+          innerHTML: Util.escapeHTML(
             args.introMsg ||
               'Add any combination of data files and URLs, and JBrowse will automatically suggest tracks to display their contents.',
           ),

src/JBrowse/View/FileDialog/ResourceList.js

@@ -1,11 +1,10 @@
-import dompurify from 'dompurify'
-
 define([
   'dojo/_base/declare',
   'dojo/_base/array',
   'dojo/dom-construct',
   'dijit/form/Select',
-], function (declare, array, dom, Select) {
+  'JBrowse/Util',
+], function (declare, array, dom, Select, Util) {
   return declare(null, {
     constructor: function (args) {
       this.dialog = args.dialog
@@ -168,7 +167,7 @@ define([
               {
                 width: '1%',
                 // eslint-disable-next-line xss/no-mixed-html
-                innerHTML: dompurify.sanitize(
+                innerHTML: Util.escapeHTML(
                   `<div class="${
                     res.file ? 'dijitIconFile' : 'jbrowseIconLink'
                   }"/>`,
@@ -180,7 +179,7 @@ define([
               'td',
               {
                 // eslint-disable-next-line xss/no-mixed-html
-                innerHTML: dompurify.sanitize(name),
+                innerHTML: Util.escapeHTML(name),
               },
               tr,
             )