diff --git a/src/apps/dashboard/static/apps/dashboard/wallet.js b/src/apps/dashboard/static/apps/dashboard/wallet.js index 506a770..135f83b 100644 --- a/src/apps/dashboard/static/apps/dashboard/wallet.js +++ b/src/apps/dashboard/static/apps/dashboard/wallet.js @@ -21,27 +21,7 @@ const initWallet = () => { saveBtn.hidden = false; cancelBtn.hidden = false; const section = addBtn.closest('section'); - const rowPx = 3 * parseFloat(getComputedStyle(document.documentElement).fontSize); - const updateRows = () => { - const sectionTop = section.getBoundingClientRect().top; - let maxBottom = sectionTop; - for (const child of section.children) { - if (child.hidden) continue; - maxBottom = Math.max(maxBottom, child.getBoundingClientRect().bottom); - } - const padBot = parseFloat(getComputedStyle(section).paddingBottom); - const rows = Math.ceil((maxBottom - sectionTop + padBot) / rowPx) + 1; - section.style.setProperty('--applet-rows', String(rows)); - }; - paymentEl.on('ready', () => { - updateRows(); - const stripeContainer = document.getElementById('id_stripe_payment_element'); - if (stripeContainer) { - const obs = new ResizeObserver(updateRows); - obs.observe(stripeContainer); - section._stripeObs = obs; - } - }); + section.style.setProperty('--applet-rows', '15'); }); saveBtn.addEventListener('click', async () => { @@ -68,8 +48,7 @@ const initWallet = () => { saveBtn.hidden = true; cancelBtn.hidden = true; const section = cancelBtn.closest('section'); - section.style.setProperty('--applet-rows', '2'); - if (section._stripeObs) { section._stripeObs.disconnect(); section._stripeObs = null; } + section.style.setProperty('--applet-rows', '3'); }); cancelBtn.addEventListener('click', () => { @@ -81,8 +60,7 @@ const initWallet = () => { saveBtn.hidden = true; cancelBtn.hidden = true; const section = cancelBtn.closest('section'); - section.style.setProperty('--applet-rows', '2'); - if (section._stripeObs) { section._stripeObs.disconnect(); section._stripeObs = null; } + section.style.setProperty('--applet-rows', '3'); }); }; diff --git a/src/apps/dashboard/tests/integrated/test_wallet_views.py b/src/apps/dashboard/tests/integrated/test_wallet_views.py index c2a0771..b14724e 100644 --- a/src/apps/dashboard/tests/integrated/test_wallet_views.py +++ b/src/apps/dashboard/tests/integrated/test_wallet_views.py @@ -61,7 +61,7 @@ class WalletViewAppletContextTest(TestCase): ) Applet.objects.get_or_create( slug="wallet-payment", - defaults={"name": "Payment Methods", "grid_cols": 6, "grid_rows": 2, "context": "wallet"}, + defaults={"name": "Payment Methods", "grid_cols": 6, "grid_rows": 3, "context": "wallet"}, ) self.client.force_login(self.user) @@ -96,7 +96,7 @@ class ToggleWalletAppletsTest(TestCase): )[0] Applet.objects.get_or_create( slug="wallet-payment", - defaults={"name": "Payment Methods", "grid_cols": 6, "grid_rows": 2, "context": "wallet"}, + defaults={"name": "Payment Methods", "grid_cols": 6, "grid_rows": 3, "context": "wallet"}, ) self.client.force_login(self.user) diff --git a/src/functional_tests/test_wallet.py b/src/functional_tests/test_wallet.py index 70dfa3c..ef01a41 100644 --- a/src/functional_tests/test_wallet.py +++ b/src/functional_tests/test_wallet.py @@ -12,7 +12,7 @@ class WalletDisplayTest(FunctionalTest): for slug, name, cols, rows in [ ("wallet-balances", "Wallet Balances", 3, 3), ("wallet-tokens", "Wallet Tokens", 3, 3), - ("wallet-payment", "Payment Methods", 6, 2), + ("wallet-payment", "Payment Methods", 6, 3), ]: Applet.objects.get_or_create( slug=slug, @@ -141,6 +141,44 @@ class WalletDisplayTest(FunctionalTest): ) ) + def test_user_can_cancel_adding_payment_method(self): + # 1. Log in, navigate to wallet page + self.create_pre_authenticated_session("capman@test.io") + self.browser.get(self.live_server_url + "/dashboard/wallet/") + # 2. Click Add Payment Method + self.wait_for_slow( + lambda: self.browser.find_element(By.ID, "id_add_payment_method") + ).click() + # 3. Wait for Cancel button to appear (visible after setup-intent fetch returns) + self.wait_for_slow( + lambda: self.assertFalse( + self.browser.find_element(By.ID, "id_cancel_payment_method").get_attribute("hidden") + ) + ) + # 3a. Assert applet expanded to 15 rows + rows = self.browser.execute_script( + "return document.getElementById('id_payment_methods')" + ".style.getPropertyValue('--applet-rows').trim()" + ) + self.assertEqual(rows, '15') + # 4. Click Cancel + self.browser.find_element(By.ID, "id_cancel_payment_method").click() + # 5. Assert Cancel + Save buttons are hidden again + self.wait_for_slow( + lambda: self.assertTrue( + self.browser.find_element(By.ID, "id_cancel_payment_method").get_attribute("hidden") + ) + ) + self.assertTrue( + self.browser.find_element(By.ID, "id_save_payment_method").get_attribute("hidden") + ) + # 6. Assert applet collapses back to 3 grid rows + rows = self.browser.execute_script( + "return document.getElementById('id_payment_methods')" + ".style.getPropertyValue('--applet-rows').trim()" + ) + self.assertEqual(rows, '3') + def test_user_can_purchase_tithe_token_bundle(self): # 1. Log in, navigate to wallet page self.create_pre_authenticated_session("capman@test.io")