CSP: Remove global this in webpack

Also refactor how we handle global namespace objects.

Fixes CODEOCEAN-DV

app/javascript/application.js

@@ -14,8 +14,8 @@ import * as bootstrap from 'bootstrap/dist/js/bootstrap.bundle';
 import 'chosen-js/chosen.jquery';
 import 'jstree';
 import 'underscore';
-import 'd3';
+import * as d3 from 'd3';
-import '@sentry/browser';
+import * as Sentry from '@sentry/browser';
 import 'sorttable';
 window.bootstrap = bootstrap; // Publish bootstrap in global namespace
 window._ = _; // Publish underscore's `_` in global namespace

app/javascript/vis.js

@@ -1,7 +1,7 @@
 /* eslint no-console:0 */
 
 // JS
-import 'vis'
+import * as vis from 'vis';
 window.vis = vis;
 
 // CSS

config/webpack/webpack.config.js

@@ -19,6 +19,9 @@ const relative_url_root = process.env.RAILS_RELATIVE_URL_ROOT || '';
 const public_output_path = webpackConfig.output.publicPath;
 
 const envConfig = module.exports = {
+    node: {
+      global: false,
+    },
     module: {
         rules: [
             erb
@@ -41,20 +44,6 @@ const envConfig = module.exports = {
         hints: false
     },
     plugins: [
-        new webpack.ProvidePlugin({
-            $: 'jquery',
-            JQuery: 'jquery',
-            jQuery: 'jquery',
-            jquery: 'jquery',
-            'window.Tether': "tether",
-            Popper: ['popper.js', 'default'],
-            _: 'underscore',
-            vis: 'vis',
-            d3: 'd3',
-            Sentry: '@sentry/browser',
-            Sortable: 'sortablejs',
-            sorttable: 'sorttable',
-        }),
         new CompressionPlugin(),
         new MiniCssExtractPlugin(),
         new SubresourceIntegrityPlugin(),