Playwright测试中如何实现一次登录复用登录上下文

要实现只登录一次、复用上下文的需求，你可以借助 Playwright 的**浏览器上下文（Browser Context）**特性，结合test.beforeAll完成一次性登录，之后所有测试用例基于这个已登录的上下文创建页面即可。

具体实现步骤： #

• 声明变量存储已登录的上下文
• 在test.beforeAll中执行登录操作并保存上下文
• 每个测试用例从该上下文创建新页面，复用登录状态
• 测试结束后用test.afterAll清理上下文

完整代码示例： #

import { test } from '@playwright/test';

// 存储已登录的浏览器上下文
let loggedInContext;

async function loginAndSaveContext(browser) {
    // 创建新上下文
    const context = await browser.newContext();
    const page = await context.newPage();
    
    // 完整登录流程（替换为你的实际登录操作）
    await page.goto('<login page>', {
        waitUntil: 'commit',
        timeout: 500000,
    });
    await page.fill('#username', 'your-username'); // 替换为实际用户名选择器
    await page.fill('#password', 'your-password'); // 替换为实际密码选择器
    await page.click('#login-button'); // 替换为实际登录按钮选择器
    await page.waitForNavigation({ waitUntil: 'networkidle' }); // 等待登录跳转完成

    // 可选：验证登录成功，比如检查用户标识元素
    await page.waitForSelector('#user-avatar');

    // 关闭当前页面，保留上下文
    await page.close();
    return context;
}

// 全局前置：仅执行一次登录
test.beforeAll(async ({ browser }) => {
    loggedInContext = await loginAndSaveContext(browser);
});

// 全局后置：测试结束后关闭上下文
test.afterAll(async () => {
    await loggedInContext.close();
});

// 测试用例：基于已登录上下文创建页面
test('测试用例1', async () => {
    const page = await loggedInContext.newPage();
    await page.goto('<your-test-page>');
    // 执行测试逻辑...
    await page.close();
});

test('测试用例2', async () => {
    const page = await loggedInContext.newPage();
    await page.goto('<another-test-page>');
    // 执行测试逻辑...
    await page.close();
});

关键说明： #

• Browser Context：每个上下文是独立的隔离环境，但会保存Cookie、LocalStorage等登录状态，基于同一个上下文创建的页面会共享这些状态，实现登录复用。
• test.beforeAll：该钩子在所有测试用例执行前仅运行一次，适合全局初始化操作比如登录。
• 资源清理：每个测试用例结束后关闭页面避免资源占用，上下文在所有测试结束后统一关闭。

内容的提问来源于stack exchange，提问作者Carabes