diff --git a/.eslintrc.json b/.eslintrc.json index a5b4d41c7e..bb7a7062b7 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -168,6 +168,7 @@ "stream_muting": false, "stream_popover": false, "stream_sort": false, + "StripeCheckout": false, "submessage": false, "subs": false, "tab_bar": false, diff --git a/frontend_tests/node_tests/billing.js b/frontend_tests/node_tests/billing.js new file mode 100644 index 0000000000..877e7e3f1e --- /dev/null +++ b/frontend_tests/node_tests/billing.js @@ -0,0 +1,77 @@ +const noop = () => {}; +const { JSDOM } = require("jsdom"); +const fs = require("fs"); + +const template = fs.readFileSync("templates/corporate/billing.html", "utf-8"); +const dom = new JSDOM(template, { pretendToBeVisual: true }); +const document = dom.window.document; + +var jquery_init; +global.$ = (f) => {jquery_init = f;}; +set_global('helpers', { + set_tab: noop, +}); +set_global('StripeCheckout', { + configure: noop, +}); + +zrequire('billing', "js/billing/billing"); +set_global('$', global.make_zjquery()); + +run_test("initialize", () => { + var token_func; + helpers.set_tab = (page_name) => { + assert.equal(page_name, "billing"); + }; + + helpers.create_ajax_request = (url, form_name, stripe_token) => { + assert.equal(url, "/json/billing/sources/change"); + assert.equal(form_name, "cardchange"); + assert.equal(stripe_token, "stripe_token"); + }; + + const open_func = (config_opts) => { + assert.equal(config_opts.name, "Zulip"); + assert.equal(config_opts.zipCode, true); + assert.equal(config_opts.billingAddress, true); + assert.equal(config_opts.panelLabel, "Update card"); + assert.equal(config_opts.label, "Update card"); + assert.equal(config_opts.allowRememberMe, false); + assert.equal(config_opts.email, "{{stripe_email}}"); + + token_func("stripe_token"); + }; + + StripeCheckout.configure = (config_opts) => { + assert.equal(config_opts.image, '/static/images/logo/zulip-icon-128x128.png'); + assert.equal(config_opts.locale, 'auto'); + assert.equal(config_opts.key, '{{publishable_key}}'); + token_func = config_opts.token; + + return { + open: open_func, + }; + }; + + $("#payment-method").data = (key) => { + return document.querySelector("#payment-method").getAttribute("data-" + key); + }; + + jquery_init(); + + const e = { + preventDefault: noop, + }; + const click_handler = $('#update-card-button').get_on_handler('click'); + click_handler(e); +}); + +run_test("billing_template", () => { + // Elements necessary for create_ajax_request + assert(document.querySelector("#cardchange-error")); + assert(document.querySelector("#cardchange-loading")); + assert(document.querySelector("#cardchange_loading_indicator")); + assert(document.querySelector("#cardchange-success")); + + assert(document.querySelector("input[name=csrfmiddlewaretoken]")); +}); diff --git a/tools/test-js-with-node b/tools/test-js-with-node index 81fcec9f35..64efa764fb 100755 --- a/tools/test-js-with-node +++ b/tools/test-js-with-node @@ -89,6 +89,7 @@ enforce_fully_covered = { 'static/js/widgetize.js', 'static/js/poll_widget.js', 'static/js/search_pill.js', + 'static/js/billing/billing.js', } parser = argparse.ArgumentParser(USAGE)