diff --git a/.eslintrc.json b/.eslintrc.json
index 6c422fcf29..23a0897fe4 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -33,6 +33,7 @@
         "popovers": false,
         "server_events": false,
         "server_events_dispatch": false,
+        "scroll_bar": false,
         "message_scroll": false,
         "keydown_util": false,
         "info_overlay": false,
diff --git a/static/js/scroll_bar.js b/static/js/scroll_bar.js
index 47d9d85f3a..de017b4bfb 100644
--- a/static/js/scroll_bar.js
+++ b/static/js/scroll_bar.js
@@ -1,7 +1,7 @@
-$(function () {
-    ui.set_up_scrollbar($("#stream-filters-container"));
-});
 
+var scroll_bar = (function () {
+
+var exports = {};
 
 // From https://stackoverflow.com/questions/13382516/getting-scroll-bar-width-using-javascript
 function getScrollbarWidth() {
@@ -29,9 +29,8 @@ function getScrollbarWidth() {
     return widthNoScroll - widthWithScroll;
 }
 
-
+exports.initialize = function () {
 // Workaround for browsers with fixed scrollbars
-$(function () {
     var sbWidth = getScrollbarWidth();
 
     if (sbWidth > 0) {
@@ -59,4 +58,11 @@ $(function () {
                          "</style>");
     }
 
-});
+    ui.set_up_scrollbar($("#stream-filters-container"));
+};
+
+return exports;
+}());
+if (typeof module !== 'undefined') {
+    module.exports = scroll_bar;
+}
diff --git a/static/js/ui_init.js b/static/js/ui_init.js
index 73a5c30d02..2d377c4642 100644
--- a/static/js/ui_init.js
+++ b/static/js/ui_init.js
@@ -275,6 +275,7 @@ function initialize_kitchen_sink_stuff() {
 
 $(function () {
     // initialize other stuff
+    scroll_bar.initialize();
     muting_ui.initialize();
     message_viewport.initialize();
     initialize_kitchen_sink_stuff();