From 06f6483aa7f9a3abb3727ec79e1800f7c7073840 Mon Sep 17 00:00:00 2001 From: Ronald Langeveld Date: Wed, 13 Nov 2024 14:20:21 +0800 Subject: [PATCH] Fixed broken Stripe donations browser tests (#21605) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit no issue Stripe recently updated their checkout page to use React with Framer Motion for animations, causing our Playwright tests to intermittently fail when attempting to click the “Card” payment button. The standard Playwright `.click()` method was unable to interact with the button reliably due to animation-related delays, where the button was present in the DOM but not fully interactable according to Playwright’s strict visibility checks. Switching to `dispatchEvent('click')` directly fires the click event on the button, bypassing Playwright’s visibility and interactability checks. This ensures the test can proceed without waiting for animations to fully complete, resolving the issue with the Stripe checkout flow. --- ghost/core/test/e2e-browser/portal/donations.spec.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/ghost/core/test/e2e-browser/portal/donations.spec.js b/ghost/core/test/e2e-browser/portal/donations.spec.js index 7b4c674bd5..9a7854a90e 100644 --- a/ghost/core/test/e2e-browser/portal/donations.spec.js +++ b/ghost/core/test/e2e-browser/portal/donations.spec.js @@ -13,10 +13,8 @@ test.describe('Portal', () => { await sharedPage.getByText('Change amount').click(); await sharedPage.locator('#customUnitAmount').fill('12.50'); await sharedPage.locator('#email').fill('member-donation-test-1@ghost.org'); + await sharedPage.getByTestId('card-accordion-item-button').dispatchEvent('click'); await completeStripeSubscription(sharedPage); - - await sharedPage.pause(); - // Check success modal await sharedPage.waitForSelector('[data-testid="portal-popup-frame"]', {state: 'visible'}); expect(sharedPage.url()).toMatch(/[^\/]\/#\/portal\/support\/success/); // Ensure correct URL and no double-slash const portalFrame = sharedPage.frameLocator('[data-testid="portal-popup-frame"]'); @@ -42,6 +40,7 @@ test.describe('Portal', () => { // Don't need to fill email as it's already filled await sharedPage.getByText('Change amount').click(); await sharedPage.locator('#customUnitAmount').fill('12.50'); + await sharedPage.getByTestId('card-accordion-item-button').dispatchEvent('click'); await completeStripeSubscription(sharedPage); // Check success notification @@ -70,7 +69,7 @@ test.describe('Portal', () => { const totalAmount = sharedPage.getByTestId('product-summary-total-amount'); await expect(totalAmount).toHaveText('€98.00'); - + await sharedPage.getByTestId('card-accordion-item-button').dispatchEvent('click'); await completeStripeSubscription(sharedPage); // Check success message