billing: Make create_ajax_request accept callback function.

This is a prep commit for the Stripe checkout migration.

create_ajax_request function used to create an ajax request to our
billing API and on completion redirect to one of the URLs in our
website. The stripe migration requires the ajax request function to
execute Stripe javascript code post the request completion to redirect
to Stripe checkout page. So this commit updates the function to accept a
callback function which gets executed post the request completion.

frontend_tests/node_tests/billing.js

@@ -33,13 +33,23 @@ run_test("initialize", ({override}) => {
     });
 
     let create_ajax_request_called = false;
-    function card_change_ajax(url, form_name, stripe_token, ignored_inputs, redirect_to, method) {
+    function card_change_ajax(
+        url,
+        form_name,
+        stripe_token,
+        ignored_inputs,
+        method,
+        success_callback,
+    ) {
         assert.equal(url, "/json/billing/sources/change");
         assert.equal(form_name, "cardchange");
         assert.equal(stripe_token, "stripe_token");
-        assert.deepEqual(ignored_inputs, undefined);
-        assert.equal(redirect_to, undefined);
-        assert.equal(method, undefined);
+        assert.deepEqual(ignored_inputs, []);
+        assert.equal(method, "POST");
+        window.location.replace = (new_location) => {
+            assert.equal(new_location, "/billing");
+        };
+        success_callback();
         create_ajax_request_called = true;
     }
 
@@ -88,13 +98,23 @@ run_test("initialize", ({override}) => {
     });
 
     create_ajax_request_called = false;
-    function plan_change_ajax(url, form_name, stripe_token, ignored_inputs, redirect_to, method) {
+    function plan_change_ajax(
+        url,
+        form_name,
+        stripe_token,
+        ignored_inputs,
+        method,
+        success_callback,
+    ) {
         assert.equal(url, "/json/billing/plan");
         assert.equal(form_name, "planchange");
         assert.equal(stripe_token, undefined);
-        assert.deepEqual(ignored_inputs, undefined);
-        assert.equal(redirect_to, undefined);
+        assert.deepEqual(ignored_inputs, []);
         assert.equal(method, "PATCH");
+        window.location.replace = (new_location) => {
+            assert.equal(new_location, "/billing");
+        };
+        success_callback();
         create_ajax_request_called = true;
     }
 
@@ -111,15 +131,18 @@ run_test("initialize", ({override}) => {
         form_name,
         stripe_token,
         ignored_inputs,
-        redirect_to,
         method,
+        success_callback,
     ) {
         assert.equal(url, "/json/billing/plan");
         assert.equal(form_name, "licensechange");
         assert.equal(stripe_token, undefined);
         assert.deepEqual(ignored_inputs, ["licenses_at_next_renewal"]);
-        assert.equal(redirect_to, undefined);
         assert.equal(method, "PATCH");
+        window.location.replace = (new_location) => {
+            assert.equal(new_location, "/billing");
+        };
+        success_callback();
         create_ajax_request_called = true;
     }
     with_field(helpers, "create_ajax_request", license_change_ajax, () => {
@@ -181,15 +204,18 @@ run_test("initialize", ({override}) => {
         form_name,
         stripe_token,
         ignored_inputs,
-        redirect_to,
         method,
+        success_callback,
     ) {
         assert.equal(url, "/json/billing/plan");
         assert.equal(form_name, "licensechange");
         assert.equal(stripe_token, undefined);
         assert.deepEqual(ignored_inputs, ["licenses"]);
-        assert.equal(redirect_to, undefined);
         assert.equal(method, "PATCH");
+        window.location.replace = (new_location) => {
+            assert.equal(new_location, "/billing");
+        };
+        success_callback();
         create_ajax_request_called = true;
     }
     with_field(helpers, "create_ajax_request", licenses_at_next_renewal_change_ajax, () => {

frontend_tests/node_tests/billing_helpers.js

@@ -49,7 +49,6 @@ run_test("create_ajax_request", ({override}) => {
         zulip_limited_section_hide: 0,
         free_trial_alert_message_hide: 0,
         free_trial_alert_message_show: 0,
-        location_reload: 0,
         pushState: 0,
         make_indicator: 0,
     };
@@ -112,6 +111,11 @@ run_test("create_ajax_request", ({override}) => {
 
     $("#autopay-form").serializeArray = () => jquery("#autopay-form").serializeArray();
 
+    let success_callback_called = false;
+    const success_callback = (response) => {
+        assert.equal(response.result, "success");
+        success_callback_called = true;
+    };
     override($, "ajax", ({type, url, data, success, error}) => {
         assert.equal(state.form_input_section_hide, 1);
         assert.equal(state.form_error_hide, 1);
@@ -143,18 +147,8 @@ run_test("create_ajax_request", ({override}) => {
             assert.equal(path, "/upgrade/");
         };
 
-        location.reload = () => {
-            state.location_reload += 1;
-        };
+        success({result: "success"});
 
-        window.location.replace = (reload_to) => {
-            state.location_reload += 1;
-            assert.equal(reload_to, "/billing");
-        };
-
-        success();
-
-        assert.equal(state.location_reload, 1);
         assert.equal(state.pushState, 1);
         assert.equal(state.form_success_show, 1);
         assert.equal(state.form_error_hide, 2);
@@ -163,6 +157,7 @@ run_test("create_ajax_request", ({override}) => {
         assert.equal(state.zulip_limited_section_show, 0);
         assert.equal(state.free_trial_alert_message_hide, 1);
         assert.equal(state.free_trial_alert_message_show, 0);
+        assert.ok(success_callback_called);
 
         error({responseText: '{"msg": "response_message"}'});
 
@@ -179,8 +174,8 @@ run_test("create_ajax_request", ({override}) => {
         "autopay",
         {id: "stripe_token_id"},
         ["license_management"],
-        undefined,
         "PATCH",
+        success_callback,
     );
 });
 

frontend_tests/node_tests/upgrade.js

@@ -36,26 +36,38 @@ run_test("initialize", ({override}) => {
     let create_ajax_request_form_call_count = 0;
     helpers.__Rewire__(
         "create_ajax_request",
-        (url, form_name, stripe_token, ignored_inputs, redirect_to) => {
+        (url, form_name, stripe_token, ignored_inputs, type, success_callback) => {
             create_ajax_request_form_call_count += 1;
             switch (form_name) {
                 case "autopay":
                     assert.equal(url, "/json/billing/upgrade");
                     assert.equal(stripe_token, "stripe_add_card_token");
-                    assert.equal(ignored_inputs, undefined);
-                    assert.equal(redirect_to, undefined);
+                    assert.deepEqual(ignored_inputs, []);
+                    assert.equal(type, "POST");
+                    window.location.replace = (new_location) => {
+                        assert.equal(new_location, "/billing");
+                    };
+                    success_callback();
                     break;
                 case "invoice":
                     assert.equal(url, "/json/billing/upgrade");
                     assert.equal(stripe_token, undefined);
-                    assert.equal(ignored_inputs, undefined);
-                    assert.equal(redirect_to, undefined);
+                    assert.deepEqual(ignored_inputs, []);
+                    assert.equal(type, "POST");
+                    window.location.replace = (new_location) => {
+                        assert.equal(new_location, "/billing");
+                    };
+                    success_callback();
                     break;
                 case "sponsorship":
                     assert.equal(url, "/json/billing/sponsorship");
                     assert.equal(stripe_token, undefined);
-                    assert.equal(ignored_inputs, undefined);
-                    assert.equal(redirect_to, "/");
+                    assert.deepEqual(ignored_inputs, []);
+                    assert.equal(type, "POST");
+                    window.location.replace = (new_location) => {
+                        assert.equal(new_location, "/");
+                    };
+                    success_callback();
                     break;
                 default:
                     throw new Error("Unhandled case");

static/js/billing/billing.js

@@ -8,8 +8,8 @@ export function create_update_license_request() {
         "licensechange",
         undefined,
         ["licenses_at_next_renewal"],
-        undefined,
         "PATCH",
+        () => window.location.replace("/billing"),
     );
 }
 
@@ -22,7 +22,14 @@ export function initialize() {
         image: "/static/images/logo/zulip-icon-128x128.png",
         locale: "auto",
         token(stripe_token) {
-            helpers.create_ajax_request("/json/billing/sources/change", "cardchange", stripe_token);
+            helpers.create_ajax_request(
+                "/json/billing/sources/change",
+                "cardchange",
+                stripe_token,
+                [],
+                "POST",
+                () => window.location.replace("/billing"),
+            );
         },
     });
 
@@ -67,8 +74,8 @@ export function initialize() {
             "licensechange",
             undefined,
             ["licenses"],
-            undefined,
             "PATCH",
+            () => window.location.replace("/billing"),
         );
     });
 
@@ -77,9 +84,9 @@ export function initialize() {
             "/json/billing/plan",
             "planchange",
             undefined,
-            undefined,
-            undefined,
+            [],
             "PATCH",
+            () => window.location.replace("/billing"),
         );
         e.preventDefault();
     });

static/js/billing/helpers.js

@@ -8,8 +8,8 @@ export function create_ajax_request(
     form_name,
     stripe_token = null,
     ignored_inputs = [],
-    redirect_to = "/billing",
     type = "POST",
+    success_callback,
 ) {
     const form = $(`#${CSS.escape(form_name)}-form`);
     const form_loading_indicator = `#${CSS.escape(form_name)}_loading_indicator`;
@@ -47,7 +47,7 @@ export function create_ajax_request(
         type,
         url,
         data,
-        success() {
+        success(response) {
             $(form_loading).hide();
             $(form_error).hide();
             $(form_success).show();
@@ -58,7 +58,7 @@ export function create_ajax_request(
                     location.hash = "";
                 }
             }
-            window.location.replace(redirect_to);
+            success_callback(response);
         },
         error(xhr) {
             $(form_loading).hide();

static/js/billing/upgrade.js

@@ -12,7 +12,14 @@ export const initialize = () => {
         image: "/static/images/logo/zulip-icon-128x128.png",
         locale: "auto",
         token(stripe_token) {
-            helpers.create_ajax_request("/json/billing/upgrade", "autopay", stripe_token);
+            helpers.create_ajax_request(
+                "/json/billing/upgrade",
+                "autopay",
+                stripe_token,
+                [],
+                "POST",
+                () => window.location.replace("/billing"),
+            );
         },
     });
 
@@ -41,7 +48,9 @@ export const initialize = () => {
             return;
         }
         e.preventDefault();
-        helpers.create_ajax_request("/json/billing/upgrade", "invoice");
+        helpers.create_ajax_request("/json/billing/upgrade", "invoice", undefined, [], "POST", () =>
+            window.location.replace("/billing"),
+        );
     });
 
     $("#sponsorship-button").on("click", (e) => {
@@ -53,8 +62,9 @@ export const initialize = () => {
             "/json/billing/sponsorship",
             "sponsorship",
             undefined,
-            undefined,
-            "/",
+            [],
+            "POST",
+            () => window.location.replace("/"),
         );
     });