js: Convert static/js/compose_pm_pill.js to ES6 module.

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

.eslintrc.json

@@ -142,7 +142,6 @@
                 "compose": false,
                 "compose_actions": false,
                 "compose_fade": false,
-                "compose_pm_pill": false,
                 "compose_state": false,
                 "compose_ui": false,
                 "composebox_typeahead": false,

frontend_tests/node_tests/compose_actions.js

@@ -17,7 +17,9 @@ set_global("document", {
     to_$: () => $("document-stub"),
 });
 
-const compose_pm_pill = set_global("compose_pm_pill", {});
+const compose_pm_pill = {__esModule: true};
+
+rewiremock("../../static/js/compose_pm_pill").with(compose_pm_pill);
 
 const hash_util = set_global("hash_util", {});
 

frontend_tests/node_tests/compose_pm_pill.js

@@ -166,27 +166,27 @@ run_test("pills", (override) => {
 });
 
 run_test("has_unconverted_data", () => {
-    compose_pm_pill.widget = {
+    compose_pm_pill.__Rewire__("widget", {
         is_pending: () => true,
-    };
+    });
 
     // If the pill itself has pending data, we have unconverted
     // data.
     assert.equal(compose_pm_pill.has_unconverted_data(), true);
 
-    compose_pm_pill.widget = {
+    compose_pm_pill.__Rewire__("widget", {
         is_pending: () => false,
         items: () => [{user_id: 99}],
-    };
+    });
 
     // Our pill is complete and all items contain user_id, so
     // we do NOT have unconverted data.
     assert.equal(compose_pm_pill.has_unconverted_data(), false);
 
-    compose_pm_pill.widget = {
+    compose_pm_pill.__Rewire__("widget", {
         is_pending: () => false,
         items: () => [{user_id: 99}, {email: "random@mit.edu"}],
-    };
+    });
 
     // One of our items only knows email (as in a bridge-with-zephyr
     // scenario where we might not have registered the user yet), so

frontend_tests/node_tests/composebox_typeahead.js

@@ -786,9 +786,9 @@ run_test("initialize", () => {
         };
 
         let appended_name;
-        compose_pm_pill.set_from_typeahead = (item) => {
+        compose_pm_pill.__Rewire__("set_from_typeahead", (item) => {
             appended_name = item.full_name;
-        };
+        });
 
         // options.updater()
         options.query = "othello";
@@ -808,15 +808,15 @@ run_test("initialize", () => {
 
         let appended_names = [];
 
-        compose_pm_pill.set_from_typeahead = (item) => {
+        compose_pm_pill.__Rewire__("set_from_typeahead", (item) => {
             appended_names.push(item.full_name);
-        };
+        });
 
         let cleared = false;
         function fake_clear() {
             cleared = true;
         }
-        compose_pm_pill.widget = {clear_text: fake_clear};
+        compose_pm_pill.__Rewire__("widget", {clear_text: fake_clear});
 
         options.query = "hamletchar";
         options.updater(hamletcharacters, event);

frontend_tests/node_tests/typing_status.js

@@ -263,7 +263,7 @@ run_test("basics", () => {
     // test that we correctly detect if worker.get_recipient
     // and typing_status.state.current_recipient are the same
 
-    compose_pm_pill.get_user_ids_string = () => "1,2,3";
+    compose_pm_pill.__Rewire__("get_user_ids_string", () => "1,2,3");
     typing_status.state.current_recipient = typing.get_recipient();
 
     const call_count = {
@@ -294,14 +294,14 @@ run_test("basics", () => {
 
     // change in recipient and new_recipient should make us
     // call typing_status.stop_last_notification
-    compose_pm_pill.get_user_ids_string = () => "2,3,4";
+    compose_pm_pill.__Rewire__("get_user_ids_string", () => "2,3,4");
     typing_status.update(worker, typing.get_recipient());
     assert.deepEqual(call_count.maybe_ping_server, 2);
     assert.deepEqual(call_count.start_or_extend_idle_timer, 3);
     assert.deepEqual(call_count.stop_last_notification, 1);
 
     // Stream messages are represented as get_user_ids_string being empty
-    compose_pm_pill.get_user_ids_string = () => "";
+    compose_pm_pill.__Rewire__("get_user_ids_string", () => "");
     typing_status.update(worker, typing.get_recipient());
     assert.deepEqual(call_count.maybe_ping_server, 2);
     assert.deepEqual(call_count.start_or_extend_idle_timer, 3);

frontend_tests/node_tests/ui_init.js

@@ -67,7 +67,7 @@ page_params.presences = [];
 
 set_global("activity", {initialize() {}});
 set_global("click_handlers", {initialize() {}});
-set_global("compose_pm_pill", {initialize() {}});
+rewiremock("../../static/js/compose_pm_pill").with({initialize() {}});
 rewiremock("../../static/js/drafts").with({initialize() {}});
 set_global("emoji_picker", {initialize() {}});
 set_global("gear_menu", {initialize() {}});

static/js/bundles/app.js

@@ -16,7 +16,6 @@ import "flatpickr/dist/plugins/confirmDate/confirmDate";
 import "../i18n";
 import "../fold_dict";
 import "../input_pill";
-import "../compose_pm_pill";
 import "../channel";
 import "../setup";
 import "../unread_ui";

static/js/compose.js

@@ -10,6 +10,7 @@ const render_compose_not_subscribed = require("../templates/compose_not_subscrib
 const render_compose_private_stream_alert = require("../templates/compose_private_stream_alert.hbs");
 
 const common = require("./common");
+const compose_pm_pill = require("./compose_pm_pill");
 const drafts = require("./drafts");
 const echo = require("./echo");
 const loading = require("./loading");

static/js/compose_actions.js

@@ -5,6 +5,7 @@ const autosize = require("autosize");
 const fenced_code = require("../shared/js/fenced_code");
 
 const common = require("./common");
+const compose_pm_pill = require("./compose_pm_pill");
 const drafts = require("./drafts");
 const people = require("./people");
 

static/js/compose_pm_pill.js

@@ -1,10 +1,10 @@
-"use strict";
+import * as people from "./people";
+import * as user_pill from "./user_pill";
+import * as util from "./util";
 
-const people = require("./people");
+export let widget;
-const user_pill = require("./user_pill");
-const util = require("./util");
 
-exports.initialize_pill = function () {
+export function initialize_pill() {
     const container = $("#private_message_recipient").parent();
 
     const pill = input_pill.create({
@@ -14,62 +14,60 @@ exports.initialize_pill = function () {
     });
 
     return pill;
-};
+}
 
-exports.initialize = function () {
+export function initialize() {
-    exports.widget = exports.initialize_pill();
+    widget = initialize_pill();
 
-    exports.widget.onPillCreate(() => {
+    widget.onPillCreate(() => {
         compose_actions.update_placeholder_text();
     });
 
-    exports.widget.onPillRemove(() => {
+    widget.onPillRemove(() => {
         compose_actions.update_placeholder_text();
     });
-};
+}
 
-exports.clear = function () {
+export function clear() {
-    exports.widget.clear();
+    widget.clear();
-};
+}
 
-exports.set_from_typeahead = function (person) {
+export function set_from_typeahead(person) {
     // We expect person to be an object returned from people.js.
     user_pill.append_person({
-        pill_widget: exports.widget,
+        pill_widget: widget,
         person,
     });
-};
+}
 
-exports.set_from_emails = function (value) {
+export function set_from_emails(value) {
     // value is something like "alice@example.com,bob@example.com"
-    exports.clear();
+    clear();
-    exports.widget.appendValue(value);
+    widget.appendValue(value);
-};
+}
 
-exports.get_user_ids = function () {
+export function get_user_ids() {
-    return user_pill.get_user_ids(exports.widget);
+    return user_pill.get_user_ids(widget);
-};
+}
 
-exports.has_unconverted_data = function () {
+export function has_unconverted_data() {
-    return user_pill.has_unconverted_data(exports.widget);
+    return user_pill.has_unconverted_data(widget);
-};
+}
 
-exports.get_user_ids_string = function () {
+export function get_user_ids_string() {
-    const user_ids = exports.get_user_ids();
+    const user_ids = get_user_ids();
     const sorted_user_ids = util.sorted_ids(user_ids);
     const user_ids_string = sorted_user_ids.join(",");
     return user_ids_string;
-};
+}
 
-exports.get_emails = function () {
+export function get_emails() {
     // return something like "alice@example.com,bob@example.com"
-    const user_ids = exports.get_user_ids();
+    const user_ids = get_user_ids();
     const emails = user_ids.map((id) => people.get_by_user_id(id).email).join(",");
     return emails;
-};
+}
 
-exports.filter_taken_users = function (persons) {
+export function filter_taken_users(persons) {
-    return user_pill.filter_taken_users(persons, exports.widget);
+    return user_pill.filter_taken_users(persons, widget);
-};
+}
-
-window.compose_pm_pill = exports;

static/js/compose_state.js

@@ -1,5 +1,7 @@
 "use strict";
 
+const compose_pm_pill = require("./compose_pm_pill");
+
 let message_type = false; // 'stream', 'private', or false-y
 
 exports.set_message_type = function (msg_type) {

static/js/composebox_typeahead.js

@@ -9,6 +9,7 @@ const pygments_data = require("../generated/pygments_data.json");
 const emoji = require("../shared/js/emoji");
 const typeahead = require("../shared/js/typeahead");
 
+const compose_pm_pill = require("./compose_pm_pill");
 const people = require("./people");
 const settings_data = require("./settings_data");
 const user_pill = require("./user_pill");

static/js/global.d.ts

@@ -21,7 +21,6 @@ declare let compose: any;
 declare let compose_actions: any;
 declare let composebox_typeahead: any;
 declare let compose_fade: any;
-declare let compose_pm_pill: any;
 declare let compose_state: any;
 declare let compose_ui: any;
 declare let condense: any;

static/js/typing.js

@@ -1,5 +1,6 @@
 import * as typing_status from "../shared/js/typing_status";
 
+import * as compose_pm_pill from "./compose_pm_pill";
 import * as people from "./people";
 
 // This module handles the outbound side of typing indicators.

static/js/ui_init.js

@@ -9,6 +9,7 @@ const fenced_code = require("../shared/js/fenced_code");
 const render_edit_content_button = require("../templates/edit_content_button.hbs");
 
 const alert_words = require("./alert_words");
+const compose_pm_pill = require("./compose_pm_pill");
 const copy_and_paste = require("./copy_and_paste");
 const drafts = require("./drafts");
 const echo = require("./echo");