settings_profile_fields: Use SortableJS as a module.

Signed-off-by: Anders Kaseorg <anders@zulip.com>

.eslintrc.json

@@ -105,7 +105,6 @@
                 "MessageListData": false,
                 "MessageListView": false,
                 "Plotly": false,
-                "Sortable": false,
                 "UserSearch": false,
                 "WinChan": false,
                 "activity": false,

frontend_tests/node_tests/settings_profile_fields.js

@@ -1,7 +1,8 @@
+const rewiremock = require("rewiremock/node");
+
 set_global("page_params", {});
 set_global("$", global.make_zjquery());
 set_global("loading", {});
-set_global("Sortable", {create: () => {}});
 
 const SHORT_TEXT_ID = 1;
 const CHOICE_ID = 3;
@@ -29,7 +30,9 @@ page_params.custom_profile_field_types = {
     },
 };
 
-zrequire("settings_profile_fields");
+rewiremock.proxy(() => zrequire("settings_profile_fields"), {
+    sortablejs: {create: () => {}},
+});
 
 function test_populate(opts) {
     const fields_data = opts.fields_data;

static/js/bundles/app.js

@@ -11,7 +11,6 @@ import "winchan/winchan.js";
 import "handlebars/dist/cjs/handlebars.runtime.js";
 import "flatpickr/dist/flatpickr.js";
 import "flatpickr/dist/plugins/confirmDate/confirmDate.js";
-import "sortablejs/Sortable.js";
 
 // Import App JS
 import "../i18n.js";

static/js/bundles/common.js

@@ -9,7 +9,6 @@ import "../../third/bootstrap/js/bootstrap.js";
 import "../common.js";
 import "moment/min/moment.min.js";
 import "moment-timezone/builds/moment-timezone-with-data.min.js";
-import "sortablejs/Sortable.js";
 import "../../third/bootstrap/css/bootstrap.css";
 import "../../third/bootstrap/css/bootstrap-btn.css";
 import "../../third/bootstrap/css/bootstrap-responsive.css";

static/js/settings_profile_fields.js

@@ -1,3 +1,5 @@
+const Sortable = require("sortablejs");
+
 const render_admin_profile_field_list = require("../templates/admin_profile_field_list.hbs");
 const render_settings_profile_field_choice = require("../templates/settings/profile_field_choice.hbs");
 

tools/webpack.config.ts

@@ -247,7 +247,6 @@ export default (env?: string): webpack.Configuration[] => {
         {path: "../static/js/debug.js"},
         {path: "jquery/dist/jquery.js", name: ["$", "jQuery"]},
         {path: "handlebars/dist/cjs/handlebars.runtime.js", name: "Handlebars"},
-        {path: "sortablejs/Sortable.js"},
         {path: "winchan/winchan.js", name: "WinChan"},
     ];
     config.module.rules.unshift(...getExposeLoaders(exposeOptions));