如何在同一文件中为每个Playwright测试指定运行浏览器？

你可以通过以下几种方式实现单个文件内不同测试绑定不同浏览器/环境的需求，无需拆分文件：

1. 按测试组配置浏览器 #

将同环境的测试归类到不同的test.describe块中，为每个块单独配置浏览器参数：

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

// 桌面端测试组 - 绑定Chromium
test.describe.configure({ browserName: 'chromium' });
test.describe('Desktop-specific tests', () => {
  test('test1 - should run in chromium', async ({ page }) => {
    await page.goto('https://your-site.com');
    // 桌面端测试逻辑与断言
    await expect(page.locator('.desktop-nav')).toBeVisible();
  });
});

// 移动端测试组 - 绑定Chromium移动端（含适配视口）
test.describe.configure({ 
  browserName: 'chromium',
  viewport: { width: 375, height: 667 }, // iPhone 12/13尺寸
  userAgent: 'Mozilla/5.0 (iPhone; CPU iPhone OS 16_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.0 Mobile/15E148 Safari/604.1'
});
test.describe('Mobile-specific tests', () => {
  test('test2 - should run in mobile', async ({ page }) => {
    await page.goto('https://your-site.com');
    // 移动端测试逻辑与断言
    await expect(page.locator('.mobile-menu-toggle')).toBeVisible();
  });
});

这种方式会让Playwright自动按组配置的浏览器运行对应测试，分组清晰，适合批量同环境测试。

2. 单个测试独立配置浏览器 #

如果不想分组，可在每个测试内部使用test.use()单独覆盖浏览器配置：

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

test('test1 - should run in chromium', async ({ page }) => {
  // 为当前测试单独指定Chromium
  test.use({ browserName: 'chromium' });
  
  await page.goto('https://your-site.com');
  // 桌面端测试逻辑
});

test('test2 - should run in mobile webkit', async ({ page }) => {
  // 为当前测试指定iOS WebKit移动端环境
  test.use({ 
    browserName: 'webkit',
    viewport: { width: 390, height: 844 }, // iPhone 14尺寸
    isMobile: true
  });
  
  await page.goto('https://your-site.com');
  // iOS移动端测试逻辑
});

注意：test.use()需放在测试函数的最顶部，它会覆盖全局配置中的对应参数。

3. 标记测试+运行时过滤（可选） #

如果希望保持测试代码简洁，可给测试打标记，运行时通过命令行指定浏览器和过滤规则：

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

test('test1 - should run in chromium', { tag: '@desktop' }, async ({ page }) => {
  // 测试逻辑
});

test('test2 - should run in mobile', { tag: '@mobile' }, async ({ page }) => {
  // 测试逻辑
});

然后分别运行对应测试：

# 运行桌面端测试（Chromium）
npx playwright test --browser chromium --grep "@desktop"

# 运行移动端测试（Chromium适配移动端）
npx playwright test --browser chromium --viewport-size=375,667 --grep "@mobile"

这种方式适合需要灵活切换运行环境的场景，测试代码无需绑定固定配置。

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