[hotfix] datatables import issues

superset/assets/javascripts/welcome.js

@@ -3,8 +3,12 @@ const $ = window.$ = require('jquery');
 const jQuery = window.jQuery = $;
 require('../stylesheets/welcome.css');
 require('bootstrap');
-require('datatables.net-bs');
+
-require('../node_modules/datatables-bootstrap3-plugin/media/css/datatables-bootstrap3.css');
+require('datatables-bootstrap3-plugin/media/css/datatables-bootstrap3.css');
+import 'datatables.net';
+import dt from 'datatables.net-bs';
+dt(window, $);
+
 const d3 = require('d3');
 function modelViewTable(selector, modelView, orderCol, order) {
   // Builds a dataTable from a flask appbuilder api endpoint

superset/assets/package.json

@@ -10,7 +10,7 @@
   "scripts": {
     "test": "mocha --require ignore-styles --compilers js:babel-core/register --require spec/helpers/browser.js --recursive spec/**/*_spec.*",
     "cover": "babel-node ./node_modules/.bin/istanbul cover _mocha -- --require spec/helpers/browser.js --recursive spec/**/*_spec.*",
-    "dev": "NODE_ENV=dev webpack --watch --colors --progress --debug --output-pathinfo --inline-source-map",
+    "dev": "NODE_ENV=dev webpack --watch --colors --progress --debug --output-pathinfo --source-map",
     "prod": "NODE_ENV=production node --max_old_space_size=8192 ./node_modules/webpack/bin/webpack.js -p --colors --progress",
     "build": "NODE_ENV=production webpack --colors --progress",
     "lint": "eslint --ignore-path=.eslintignore --ext .js,.jsx ."
@@ -51,8 +51,7 @@
     "d3-tip": "^0.7.1",
     "datamaps": "^0.5.8",
     "datatables-bootstrap3-plugin": "^0.5.0",
-    "datatables.net-bs": "1.10.11",
+    "datatables.net-bs": "^1.10.12",
-    "datatables.net": "1.10.11",
     "font-awesome": "^4.6.3",
     "gridster": "^0.5.6",
     "immutability-helper": "^2.0.0",

superset/assets/visualizations/pivot_table.js

@@ -1,9 +1,12 @@
 import { fixDataTableBodyHeight } from '../javascripts/modules/utils';
 const $ = require('jquery');
 
-require('datatables.net-bs');
 require('./pivot_table.css');
+
 require('datatables-bootstrap3-plugin/media/css/datatables-bootstrap3.css');
+import 'datatables.net';
+import dt from 'datatables.net-bs';
+dt(window, $);
 
 module.exports = function (slice) {
   const container = slice.container;

superset/assets/visualizations/table.css

@@ -20,3 +20,6 @@
     padding: 1px 5px !important;
     font-size: small !important;
 }
+table.table thead th.sorting:after, table.table thead th.sorting_asc:after, table.table thead th.sorting_desc:after {
+    top: 0px;
+}

superset/assets/visualizations/table.js

@@ -1,15 +1,18 @@
-const $ = require('jquery');
 import d3 from 'd3';
 import { fixDataTableBodyHeight } from '../javascripts/modules/utils';
 import { timeFormatFactory, formatDate } from '../javascripts/modules/dates';
 
 require('./table.css');
-require('datatables.net-bs');
+
 require('datatables-bootstrap3-plugin/media/css/datatables-bootstrap3.css');
+import 'datatables.net';
+import dt from 'datatables.net-bs';
+dt(window, $);
 
 function tableVis(slice) {
   const fC = d3.format('0,000');
   let timestampFormatter;
+  const container = $(slice.selector);
 
   function refresh() {
     function onError(xhr) {
@@ -122,8 +125,8 @@ function tableVis(slice) {
           }
           return d.val;
         });
-      const height = slice.container.height();
+      const height = slice.height();
-      const datatable = slice.container.find('.dataTable').DataTable({
+      const datatable = container.find('.dataTable').DataTable({
         paging: false,
         aaSorting: [],
         searching: fd.include_search,
@@ -133,14 +136,14 @@ function tableVis(slice) {
         scrollX: true,
       });
       fixDataTableBodyHeight(
-          slice.container.find('.dataTables_wrapper'), height);
+          container.find('.dataTables_wrapper'), height);
       // Sorting table by main column
       if (fd.metrics.length > 0) {
         const mainMetric = fd.metrics[0];
         datatable.column(data.columns.indexOf(mainMetric)).order('desc').draw();
       }
       slice.done(json);
-      slice.container.parents('.widget').find('.tooltip').remove();
+      container.parents('.widget').find('.tooltip').remove();
     }
     $.getJSON(slice.jsonEndpoint(), onSuccess).fail(onError);
   }

superset/assets/webpack.config.js

@@ -42,6 +42,10 @@ const config = {
   module: {
     noParse: /mapbox-gl\/dist/,
     loaders: [
+      {
+        test: /datatables\.net.*/,
+        loader: 'imports?define=>false',
+      },
       {
         test: /\.jsx?$/,
         exclude: APP_DIR + '/node_modules',