测开必备：Playwright 浏览器上下文与页面复用深度拆解

// 创建独立的浏览器上下文
const context = await browser.newContext({
  viewport: { width: 1280, height: 720 },
  userAgent: '测试专用UA'
});

// 在上下文中创建多个页面
const page1 = await context.newPage();
const page2 = await context.newPage();

describe('用户账户相关测试', () => {
let context;
let page;

  beforeAll(async () => {
    // 整个测试套件共享一个上下文
    context = await browser.newContext();
    page = await context.newPage();
    await page.goto('https://example.com/login');
    await performLogin(page); // 执行一次登录
  });

  afterAll(async () => {
    await context.close();
  });

  test('查看个人资料', async () => {
    // 直接使用已登录状态的页面
    await page.click('#profile-link');
    // ... 验证逻辑
  });

  test('修改账户设置', async () => {
    // 复用同一个页面，无需重新登录
    await page.click('#settings-link');
    // ... 测试逻辑
  });
});

class PagePool {
constructor(context, size = 3) {
    this.context = context;
    this.pool = [];
    this.size = size;
    this.available = [];
  }

async initialize() {
    for (let i = 0; i < this.size; i++) {
      const page = awaitthis.context.newPage();
      this.pool.push(page);
      this.available.push(page);
    }
  }

async acquire() {
    if (this.available.length === 0) {
      // 可以等待或创建新页面
      const page = awaitthis.context.newPage();
      this.pool.push(page);
      return page;
    }
    returnthis.available.pop();
  }

  release(page) {
    // 重置页面状态（根据需求决定是否清理）
    page.goto('about:blank');
    this.available.push(page);
  }
}

async function createLoggedInContext(browser) {
const context = await browser.newContext();
const page = await context.newPage();

// 执行登录
await page.goto(loginUrl);
await page.fill('#username', 'testuser');
await page.fill('#password', 'password');
await page.click('#login-btn');

// 等待登录完成
await page.waitForSelector('#user-menu');

// 存储上下文状态
await context.storageState({ path: 'auth-state.json' });

await context.close();
return'auth-state.json';
}

// 在其他测试中复用登录状态
const context = await browser.newContext({
storageState: 'auth-state.json'
});

beforeEach(async () => {
  // 每个测试前清理特定状态
  await page.evaluate(() => {
    localStorage.removeItem('shoppingCart');
    sessionStorage.clear();
  });
  
  // 或者导航到中性页面
  await page.goto('about:blank');
});

// 为每个并行工作进程创建独立上下文
test.describe.configure({ mode: 'parallel' });

test.describe('并行测试套件', () => {
  test.beforeEach(async ({ browser }) => {
    // Playwright Test 会自动为每个并行测试提供隔离的上下文
  });
});

// 定期清理不再使用的页面
async function cleanupOldPages(context, maxPages = 10) {
  const pages = context.pages();
  if (pages.length > maxPages) {
    const oldPages = pages.slice(0, pages.length - maxPages);
    for (const oldPage of oldPages) {
      if (!oldPage.isClosed()) {
        await oldPage.close();
      }
    }
  }
}

// 不好的做法
const context1 = await browser.newContext();

// 好的做法
const adminUserContext = await browser.newContext({
  storageState: 'admin-auth.json'
});
const customerContext = await browser.newContext({
  storageState: 'customer-auth.json'
});

// 创建可自动清理的上下文包装器
asyncfunction createManagedContext(browser, options) {
const context = await browser.newContext(options);
const originalNewPage = context.newPage;
const pages = [];

  context.newPage = asyncfunction(...args) {
    const page = await originalNewPage.apply(this, args);
    pages.push(page);
    
    // 设置自动清理
    page.on('close', () => {
      const index = pages.indexOf(page);
      if (index > -1) pages.splice(index, 1);
    });
    
    return page;
  };

  context.cleanup = asyncfunction() {
    for (const page of pages) {
      if (!page.isClosed()) await page.close();
    }
    awaitthis.close();
  };

return context;
}