80 lines
3.3 KiB
TypeScript
80 lines
3.3 KiB
TypeScript
import { test, expect } from '@playwright/test';
|
|
import { login } from './helpers/auth';
|
|
|
|
test.describe('Plans', () => {
|
|
test.beforeEach(async ({ page }) => {
|
|
await login(page);
|
|
await page.goto('/plans');
|
|
await page.waitForURL(/\/plans/);
|
|
});
|
|
|
|
test('plans page renders with header and table', async ({ page }) => {
|
|
await expect(page.locator('h1:has-text("Plans")')).toBeVisible();
|
|
await expect(page.locator('table')).toBeVisible();
|
|
await expect(page.locator('th:has-text("Name")')).toBeVisible();
|
|
await expect(page.locator('th:has-text("Type")')).toBeVisible();
|
|
});
|
|
|
|
test('plans list loads rows from API', async ({ page }) => {
|
|
// Wait for at least one row (demo data has 5 plans)
|
|
await expect(page.locator('[data-testid="plan-row"]').first()).toBeVisible({ timeout: 10000 });
|
|
const count = await page.locator('[data-testid="plan-row"]').count();
|
|
expect(count).toBeGreaterThan(0);
|
|
});
|
|
|
|
test('add plan modal opens and submits', async ({ page }) => {
|
|
// Open create modal
|
|
await page.click('[data-testid="btn-add-plan"]');
|
|
await expect(page.locator('[data-testid="input-plan-name"]')).toBeVisible();
|
|
|
|
// Fill form with correct numeric fields
|
|
const planName = `E2E Plan ${Date.now()}`;
|
|
await page.fill('[data-testid="input-plan-name"]', planName);
|
|
await page.selectOption('[data-testid="select-plan-type"]', 'PREPAID');
|
|
await page.fill('[data-testid="input-plan-speed-down"]', '25');
|
|
await page.fill('[data-testid="input-plan-speed-up"]', '10');
|
|
await page.fill('[data-testid="input-plan-price"]', '999');
|
|
|
|
// Submit
|
|
await page.click('[data-testid="btn-submit-create"]');
|
|
|
|
// Modal should close after successful API call
|
|
await expect(page.locator('[data-testid="input-plan-name"]')).not.toBeVisible({ timeout: 10000 });
|
|
|
|
// New plan should appear in table
|
|
await expect(page.locator(`text=${planName}`)).toBeVisible({ timeout: 10000 });
|
|
});
|
|
|
|
test('edit plan modal opens and submits', async ({ page }) => {
|
|
// Wait for rows
|
|
await expect(page.locator('[data-testid="plan-row"]').first()).toBeVisible({ timeout: 10000 });
|
|
|
|
// Click first edit button
|
|
await page.locator('[data-testid="btn-edit-plan"]').first().click();
|
|
await expect(page.locator('[data-testid="input-edit-name"]')).toBeVisible();
|
|
|
|
// Edit the name
|
|
await page.fill('[data-testid="input-edit-name"]', 'Updated Plan Name');
|
|
await page.click('[data-testid="btn-submit-edit"]');
|
|
|
|
// Modal should close
|
|
await expect(page.locator('[data-testid="input-edit-name"]')).not.toBeVisible({ timeout: 10000 });
|
|
});
|
|
|
|
test('delete plan shows confirmation dialog', async ({ page }) => {
|
|
// Wait for rows
|
|
await expect(page.locator('[data-testid="plan-row"]').first()).toBeVisible({ timeout: 10000 });
|
|
|
|
// Click first delete button
|
|
await page.locator('[data-testid="btn-delete-plan"]').first().click();
|
|
|
|
// Confirmation modal should appear
|
|
await expect(page.locator('[data-testid="btn-confirm-delete"]')).toBeVisible();
|
|
await expect(page.locator('[data-testid="btn-cancel-delete"]')).toBeVisible();
|
|
|
|
// Cancel — don't actually delete
|
|
await page.click('[data-testid="btn-cancel-delete"]');
|
|
await expect(page.locator('[data-testid="btn-confirm-delete"]')).not.toBeVisible();
|
|
});
|
|
});
|