132 lines
3.4 KiB
TypeScript
132 lines
3.4 KiB
TypeScript
import { test as base, Page } from '@playwright/test';
|
|
|
|
/**
|
|
* Custom Fixtures for Playwright Tests
|
|
*
|
|
* Fixtures provide a way to set up test preconditions and share
|
|
* common setup logic across tests. They ensure test isolation
|
|
* and reduce boilerplate code.
|
|
*/
|
|
|
|
// Define custom fixture types
|
|
type MyFixtures = {
|
|
authenticatedPage: Page;
|
|
testUser: {
|
|
email: string;
|
|
password: string;
|
|
name: string;
|
|
};
|
|
};
|
|
|
|
/**
|
|
* Extend the base test with custom fixtures
|
|
*/
|
|
export const test = base.extend<MyFixtures>({
|
|
/**
|
|
* Fixture: Authenticated Page
|
|
*
|
|
* Provides a page that is already logged in with a test user.
|
|
* Use this when you need to test features that require authentication.
|
|
*
|
|
* Usage:
|
|
* test('should view profile', async ({ authenticatedPage }) => {
|
|
* await authenticatedPage.goto('/profile');
|
|
* // Test authenticated features
|
|
* });
|
|
*/
|
|
authenticatedPage: async ({ page }, use) => {
|
|
// Setup: Perform login
|
|
await page.goto('/login');
|
|
|
|
// Wait for login form to be visible
|
|
await page.locator('[data-testid="login-form"]').waitFor();
|
|
|
|
// Fill in credentials
|
|
await page.locator('[data-testid="email-input"]').fill('test@example.com');
|
|
await page.locator('[data-testid="password-input"]').fill('TestPassword123');
|
|
|
|
// Submit login form
|
|
await page.locator('[data-testid="login-button"]').click();
|
|
|
|
// Wait for successful login (redirect to dashboard)
|
|
await page.waitForURL('/dashboard');
|
|
|
|
// Verify login success
|
|
await page.locator('[data-testid="user-menu"]').waitFor();
|
|
|
|
// Provide the authenticated page to the test
|
|
await use(page);
|
|
|
|
// Teardown: Logout (optional)
|
|
// await page.locator('[data-testid="logout-button"]').click();
|
|
},
|
|
|
|
/**
|
|
* Fixture: Test User
|
|
*
|
|
* Provides consistent test user data across tests.
|
|
* Use this when you need user credentials or information.
|
|
*
|
|
* Usage:
|
|
* test('should register user', async ({ page, testUser }) => {
|
|
* await page.locator('[data-testid="email"]').fill(testUser.email);
|
|
* });
|
|
*/
|
|
testUser: async ({}, use) => {
|
|
const user = {
|
|
email: 'test@example.com',
|
|
password: 'TestPassword123',
|
|
name: 'Test User',
|
|
};
|
|
|
|
await use(user);
|
|
},
|
|
});
|
|
|
|
export { expect } from '@playwright/test';
|
|
|
|
/**
|
|
* Additional Fixture Examples:
|
|
*
|
|
* 1. Database Setup Fixture:
|
|
* dbContext: async ({}, use) => {
|
|
* const db = await setupTestDatabase();
|
|
* await use(db);
|
|
* await db.cleanup();
|
|
* }
|
|
*
|
|
* 2. API Context Fixture:
|
|
* apiContext: async ({ playwright }, use) => {
|
|
* const context = await playwright.request.newContext({
|
|
* baseURL: 'https://api.example.com',
|
|
* extraHTTPHeaders: { 'Authorization': 'Bearer token' }
|
|
* });
|
|
* await use(context);
|
|
* await context.dispose();
|
|
* }
|
|
*
|
|
* 3. Test Data Fixture:
|
|
* testProduct: async ({}, use) => {
|
|
* const product = {
|
|
* name: 'Test Product',
|
|
* price: 99.99,
|
|
* sku: 'TEST-001'
|
|
* };
|
|
* await use(product);
|
|
* }
|
|
*
|
|
* 4. Viewport Fixture:
|
|
* mobileViewport: async ({ page }, use) => {
|
|
* await page.setViewportSize({ width: 375, height: 667 });
|
|
* await use(page);
|
|
* }
|
|
*
|
|
* 5. Mock Data Fixture:
|
|
* mockApiResponses: async ({ page }, use) => {
|
|
* await page.route('**/api/users', route => {
|
|
* route.fulfill({ json: [{ id: 1, name: 'Test User' }] });
|
|
* });
|
|
* await use(page);
|
|
* }
|
|
*/
|