js: Convert static/js/billing/helpers.js to ES6 module.

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

.eslintrc.json

@@ -133,7 +133,6 @@
                 "dropdown_list_widget": false,
                 "favicon": false,
                 "flatpickr": false,
-                "helpers": false,
                 "history": false,
                 "home_msg_list": false,
                 "i18n": false,

frontend_tests/node_tests/billing.js

@@ -4,6 +4,7 @@ const {strict: assert} = require("assert");
 const fs = require("fs");
 
 const {JSDOM} = require("jsdom");
+const rewiremock = require("rewiremock/node");
 
 const {set_global, with_field, zrequire} = require("../zjsunit/namespace");
 const {run_test} = require("../zjsunit/test");
@@ -13,13 +14,17 @@ const template = fs.readFileSync("templates/corporate/billing.html", "utf-8");
 const dom = new JSDOM(template, {pretendToBeVisual: true});
 const document = dom.window.document;
 
-const helpers = set_global("helpers", {
+const helpers = {
+    __esModule: true,
     set_tab: () => {},
-});
+};
+rewiremock("../../static/js/billing/helpers").with(helpers);
 const StripeCheckout = set_global("StripeCheckout", {
     configure: () => {},
 });
 
+rewiremock.enable();
+
 run_test("initialize", (override) => {
     let token_func;
 
@@ -107,3 +112,4 @@ run_test("billing_template", () => {
 
     assert(document.querySelector("input[name=csrfmiddlewaretoken]"));
 });
+rewiremock.disable();

frontend_tests/node_tests/upgrade.js

@@ -29,32 +29,35 @@ const helpers = zrequire("helpers", "js/billing/helpers");
 
 run_test("initialize", () => {
     let token_func;
-    helpers.set_tab = (page_name) => {
+    helpers.__Rewire__("set_tab", (page_name) => {
         assert.equal(page_name, "upgrade");
-    };
+    });
 
     let create_ajax_request_form_call_count = 0;
-    helpers.create_ajax_request = (url, form_name, stripe_token, numeric_inputs, redirect_to) => {
-        create_ajax_request_form_call_count += 1;
-        if (form_name === "autopay") {
-            assert.equal(url, "/json/billing/upgrade");
-            assert.equal(stripe_token, "stripe_add_card_token");
-            assert.deepEqual(numeric_inputs, ["licenses"]);
-            assert.equal(redirect_to, undefined);
-        } else if (form_name === "invoice") {
-            assert.equal(url, "/json/billing/upgrade");
-            assert.equal(stripe_token, undefined);
-            assert.deepEqual(numeric_inputs, ["licenses"]);
-            assert.equal(redirect_to, undefined);
-        } else if (form_name === "sponsorship") {
-            assert.equal(url, "/json/billing/sponsorship");
-            assert.equal(stripe_token, undefined);
-            assert.equal(numeric_inputs, undefined);
-            assert.equal(redirect_to, "/");
-        } else {
-            throw new Error("Unhandled case");
-        }
-    };
+    helpers.__Rewire__(
+        "create_ajax_request",
+        (url, form_name, stripe_token, numeric_inputs, redirect_to) => {
+            create_ajax_request_form_call_count += 1;
+            if (form_name === "autopay") {
+                assert.equal(url, "/json/billing/upgrade");
+                assert.equal(stripe_token, "stripe_add_card_token");
+                assert.deepEqual(numeric_inputs, ["licenses"]);
+                assert.equal(redirect_to, undefined);
+            } else if (form_name === "invoice") {
+                assert.equal(url, "/json/billing/upgrade");
+                assert.equal(stripe_token, undefined);
+                assert.deepEqual(numeric_inputs, ["licenses"]);
+                assert.equal(redirect_to, undefined);
+            } else if (form_name === "sponsorship") {
+                assert.equal(url, "/json/billing/sponsorship");
+                assert.equal(stripe_token, undefined);
+                assert.equal(numeric_inputs, undefined);
+                assert.equal(redirect_to, "/");
+            } else {
+                throw new Error("Unhandled case");
+            }
+        },
+    );
 
     const open_func = (config_opts) => {
         assert.equal(config_opts.name, "Zulip");
@@ -79,15 +82,15 @@ run_test("initialize", () => {
         };
     };
 
-    helpers.show_license_section = (section) => {
+    helpers.__Rewire__("show_license_section", (section) => {
         assert.equal(section, "automatic");
-    };
+    });
 
-    helpers.update_charged_amount = (prices, schedule) => {
+    helpers.__Rewire__("update_charged_amount", (prices, schedule) => {
         assert.equal(prices.annual, 6400);
         assert.equal(prices.monthly, 640);
         assert.equal(schedule, "monthly");
-    };
+    });
 
     $("input[type=radio][name=license_management]:checked").val = () =>
         document.querySelector("input[type=radio][name=license_management]:checked").value;
@@ -108,7 +111,7 @@ run_test("initialize", () => {
     const invoice_click_handler = $("#invoice-button").get_on_handler("click");
     const request_sponsorship_click_handler = $("#sponsorship-button").get_on_handler("click");
 
-    helpers.is_valid_input = () => true;
+    helpers.__Rewire__("is_valid_input", () => true);
     add_card_click_handler(e);
     assert.equal(create_ajax_request_form_call_count, 1);
     invoice_click_handler(e);
@@ -116,25 +119,25 @@ run_test("initialize", () => {
     request_sponsorship_click_handler(e);
     assert.equal(create_ajax_request_form_call_count, 3);
 
-    helpers.is_valid_input = () => false;
+    helpers.__Rewire__("is_valid_input", () => false);
     add_card_click_handler(e);
     invoice_click_handler(e);
     request_sponsorship_click_handler(e);
     assert.equal(create_ajax_request_form_call_count, 3);
 
-    helpers.show_license_section = (section) => {
+    helpers.__Rewire__("show_license_section", (section) => {
         assert.equal(section, "manual");
-    };
+    });
     const license_change_handler = $("input[type=radio][name=license_management]").get_on_handler(
         "change",
     );
     license_change_handler.call({value: "manual"});
 
-    helpers.update_charged_amount = (prices, schedule) => {
+    helpers.__Rewire__("update_charged_amount", (prices, schedule) => {
         assert.equal(prices.annual, 6400);
         assert.equal(prices.monthly, 640);
         assert.equal(schedule, "monthly");
-    };
+    });
     const schedule_change_handler = $("input[type=radio][name=schedule]").get_on_handler("change");
     schedule_change_handler.call({value: "monthly"});
 

static/js/billing/billing.js

@@ -1,3 +1,5 @@
+import * as helpers from "./helpers";
+
 export function initialize() {
     helpers.set_tab("billing");
 

static/js/billing/helpers.js

@@ -1,8 +1,6 @@
-"use strict";
+import * as loading from "../loading";
 
-const loading = require("../loading");
-
-exports.create_ajax_request = function (
+export function create_ajax_request(
     url,
     form_name,
     stripe_token = null,
@@ -66,9 +64,9 @@ exports.create_ajax_request = function (
             $(free_trial_alert_message).show();
         },
     });
-};
+}
 
-exports.format_money = function (cents) {
+export function format_money(cents) {
     // allow for small floating point errors
     cents = Math.ceil(cents - 0.001);
     let precision;
@@ -79,13 +77,13 @@ exports.format_money = function (cents) {
     }
     // TODO: Add commas for thousands, millions, etc.
     return (cents / 100).toFixed(precision);
-};
+}
 
-exports.update_charged_amount = function (prices, schedule) {
-    $("#charged_amount").text(exports.format_money(page_params.seat_count * prices[schedule]));
-};
+export function update_charged_amount(prices, schedule) {
+    $("#charged_amount").text(format_money(page_params.seat_count * prices[schedule]));
+}
 
-exports.update_discount_details = function (organization_type) {
+export function update_discount_details(organization_type) {
     const discount_details = {
         open_source: "Open source projects are eligible for fully sponsored (free) Zulip Standard.",
         research:
@@ -96,9 +94,9 @@ exports.update_discount_details = function (organization_type) {
         other: "Your organization might be eligible for a discount or sponsorship.",
     };
     $("#sponsorship-discount-details").text(discount_details[organization_type]);
-};
+}
 
-exports.show_license_section = function (license) {
+export function show_license_section(license) {
     $("#license-automatic-section").hide();
     $("#license-manual-section").hide();
 
@@ -109,7 +107,7 @@ exports.show_license_section = function (license) {
     $(section_id).show();
     const input_id = `#${CSS.escape(license)}_license_count`;
     $(input_id).prop("disabled", false);
-};
+}
 
 let current_page;
 
@@ -118,7 +116,7 @@ function handle_hashchange() {
     $("html").scrollTop(0);
 }
 
-exports.set_tab = function (page) {
+export function set_tab(page) {
     const hash = location.hash;
     if (hash) {
         $(`#${CSS.escape(page)}-tabs.nav a[href="${CSS.escape(hash)}"]`).tab("show");
@@ -131,10 +129,8 @@ exports.set_tab = function (page) {
 
     current_page = page;
     window.addEventListener("hashchange", handle_hashchange);
-};
+}
 
-exports.is_valid_input = function (elem) {
+export function is_valid_input(elem) {
     return elem[0].checkValidity();
-};
-
-window.helpers = exports;
+}

static/js/billing/upgrade.js

@@ -1,3 +1,5 @@
+import * as helpers from "./helpers";
+
 export const initialize = () => {
     helpers.set_tab("upgrade");
 

static/js/global.d.ts

@@ -10,7 +10,6 @@ declare let csrf_token: any;
 declare let current_msg_list: any;
 declare let emoji: any;
 declare let favicon: any;
-declare let helpers: any;
 declare let home_msg_list: any;
 declare let i18n: any;
 declare let input_pill: any;