0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-10 23:36:14 -05:00

Fixed broken Stripe donations browser tests (#21605)

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.
This commit is contained in:
Ronald Langeveld 2024-11-13 14:20:21 +08:00 committed by GitHub
parent 01120c9e2f
commit 06f6483aa7
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -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