Files
open-saas/template/e2e-tests/tests/pricingPageTests.spec.ts
Franjo Mindek 3f463fb202 format
2025-09-18 11:42:49 +02:00

86 lines
3.0 KiB
TypeScript

import { expect, test, type Page } from "@playwright/test";
import {
acceptAllCookies,
createRandomUser,
logUserIn,
makeStripePayment,
signUserUp,
type User,
} from "./utils";
let page: Page;
let testUser: User;
async function createAndLogInNewUser() {
testUser = createRandomUser();
await signUserUp({ page: page, user: testUser });
await logUserIn({ page: page, user: testUser });
}
// We need to run the tests sequentially to check for functionality before and after the user pays.
test.describe.configure({ mode: "serial" });
test.beforeAll(async ({ browser }) => {
page = await browser.newPage();
});
test.afterAll(async () => {
await page.close();
});
test("User should see Log In to Buy Plan button", async () => {
await page.goto("/pricing");
// There are three tiers on the page, so we want to retrieve the first of the three buttons
const buyPlanButton = page
.getByRole("button", { name: "Log in to buy plan" })
.first();
await expect(buyPlanButton).toBeVisible();
await expect(buyPlanButton).toBeEnabled();
await buyPlanButton.click();
await page.waitForURL("**/login");
expect(page.url()).toContain("/login");
});
test("User should see the Buy Plan button before payment", async () => {
// We only need to log the user in once since the tests are running sequentially
// and the same page is being shared between all the tests.
await createAndLogInNewUser();
await page.goto("/pricing");
// There are three tiers on the page, so we want to retrieve the first of the three buttons
const manageSubscriptionButton = page
.getByRole("button", { name: "Buy plan" })
.first();
await expect(manageSubscriptionButton).toBeVisible();
await expect(manageSubscriptionButton).toBeEnabled();
});
test("Make test payment with Stripe for hobby plan", async () => {
const planId = "hobby";
await page.goto("/");
await makeStripePayment({ test, page, planId });
});
test("User should see the Manage Subscription button after payment", async () => {
await page.goto("/pricing");
// There are three tiers on the page, so we want to retrieve the first of the three buttons
const manageSubscriptionButton = page
.getByRole("button", { name: "Manage Subscription" })
.first();
await expect(manageSubscriptionButton).toBeVisible();
await expect(manageSubscriptionButton).toBeEnabled();
await manageSubscriptionButton.click();
// clicking the button should take the user to the Stripe customer portal page with substring 'billing.stripe.com' in a new window
const newTabPromise = page.waitForEvent("popup");
const newTab = await newTabPromise;
await newTab.waitForLoadState();
await expect(newTab).toHaveURL(/^https:\/\/billing\.stripe\.com\//);
});
test("Make test payment with Stripe for 10 credits", async () => {
await createAndLogInNewUser();
await acceptAllCookies(page); // Clear the cookie consent modal so it doesn't interfere with the payment
const planId = "credits10";
await page.goto("/");
await makeStripePayment({ test, page, planId });
});