Fix e2e tests to wait for API calls and form rendering

- Wait for GET /api/admin/pricing response before checking elements
- Wait for heading to be visible before interacting with form
- Wait for inputs to be visible before reading values
- This ensures the page has finished loading before tests run
This commit is contained in:
counterweight 2025-12-26 21:02:45 +01:00
parent c9efcf79ff
commit 1874c3a057
Signed by: counterweight
GPG key ID: 883EDBAA726BD96C

View file

@ -26,7 +26,14 @@ test.describe("Admin Pricing Page - Admin Access", () => {
// Test page access and structure
await page.goto("/admin/pricing");
await expect(page).toHaveURL("/admin/pricing");
await expect(page.getByRole("heading", { name: "Pricing Configuration" })).toBeVisible();
// Wait for API call to complete and form to render
await page.waitForResponse(
(resp) => resp.url().includes("/api/admin/pricing") && resp.request().method() === "GET"
);
await expect(page.getByRole("heading", { name: "Pricing Configuration" })).toBeVisible({
timeout: 10000,
});
await expect(page.getByText("Configure premium pricing and trade amount limits")).toBeVisible();
// Check all form fields are present (using text + input selector since labels aren't associated)
@ -47,11 +54,17 @@ test.describe("Admin Pricing Page - Admin Access", () => {
test("can view current pricing configuration", async ({ page }) => {
await page.goto("/admin/pricing");
// Wait for data to load
await page.waitForLoadState("networkidle");
// Wait for API call to complete and form to render
await page.waitForResponse(
(resp) => resp.url().includes("/api/admin/pricing") && resp.request().method() === "GET"
);
await expect(page.getByRole("heading", { name: "Pricing Configuration" })).toBeVisible({
timeout: 10000,
});
// All input fields should have values (not empty)
// Wait for inputs to be visible
const inputs = page.locator('input[type="number"]');
await expect(inputs.first()).toBeVisible({ timeout: 5000 });
const count = await inputs.count();
expect(count).toBeGreaterThan(0);
@ -65,10 +78,18 @@ test.describe("Admin Pricing Page - Admin Access", () => {
test("can update pricing configuration", async ({ page }) => {
await page.goto("/admin/pricing");
await page.waitForLoadState("networkidle");
// Get current values (first input is premium_buy)
// Wait for API call to complete and form to render
await page.waitForResponse(
(resp) => resp.url().includes("/api/admin/pricing") && resp.request().method() === "GET"
);
await expect(page.getByRole("heading", { name: "Pricing Configuration" })).toBeVisible({
timeout: 10000,
});
// Wait for inputs to be visible
const inputs = page.locator('input[type="number"]');
await expect(inputs.first()).toBeVisible({ timeout: 5000 });
const premiumBuyInput = inputs.nth(0);
const currentBuyValue = await premiumBuyInput.inputValue();
const newBuyValue = currentBuyValue === "5" ? "6" : "5";
@ -107,10 +128,18 @@ test.describe("Admin Pricing Page - Admin Access", () => {
test("validation prevents invalid values", async ({ page }) => {
await page.goto("/admin/pricing");
await page.waitForLoadState("networkidle");
// Test premium range validation (should be -100 to 100)
// Wait for API call to complete and form to render
await page.waitForResponse(
(resp) => resp.url().includes("/api/admin/pricing") && resp.request().method() === "GET"
);
await expect(page.getByRole("heading", { name: "Pricing Configuration" })).toBeVisible({
timeout: 10000,
});
// Wait for inputs to be visible
const inputs = page.locator('input[type="number"]');
await expect(inputs.first()).toBeVisible({ timeout: 5000 });
const premiumBuyInput = inputs.nth(0); // First input is premium_buy
await premiumBuyInput.clear();
await premiumBuyInput.fill("150"); // Invalid: > 100
@ -149,10 +178,18 @@ test.describe("Admin Pricing Page - Admin Access", () => {
test("form fields update correctly when values change", async ({ page }) => {
await page.goto("/admin/pricing");
await page.waitForLoadState("networkidle");
// Small trade threshold is the 3rd input (after premium_buy and premium_sell)
// Wait for API call to complete and form to render
await page.waitForResponse(
(resp) => resp.url().includes("/api/admin/pricing") && resp.request().method() === "GET"
);
await expect(page.getByRole("heading", { name: "Pricing Configuration" })).toBeVisible({
timeout: 10000,
});
// Wait for inputs to be visible
const inputs = page.locator('input[type="number"]');
await expect(inputs.first()).toBeVisible({ timeout: 5000 });
const smallTradeThresholdInput = inputs.nth(2);
const currentThreshold = await smallTradeThresholdInput.inputValue();