用Playwright端到端测试PDF翻译功能：Web自动化测试实战

一、背景

最近在做一个PDF翻译工具的Web端，需要自动化测试核心流程：上传PDF → 选择语言 → 等待翻译完成 → 下载翻译结果。这正好适合用 Playwright 做端到端测试。

二、测试目标

我们的核心用户旅程：

1. 打开翻译页面
2. 上传一个测试PDF
3. 选择目标语言（如中英对照）
4. 点击"开始翻译"按钮
5. 等待翻译完成
6. 下载翻译结果
7. 验证翻译结果文件存在且可读

三、环境准备

pip install playwright pytest pytest-playwright
playwright install chromium

四、测试用例设计

4.1 基础页面对象模型

# pages/translate_page.py
from playwright.sync_api import Page, expect

class TranslatePage:
    def __init__(self, page: Page):
        self.page = page
        self.file_input = page.locator('input[type="file"]')
        self.target_lang_select = page.locator('select[name="target_lang"]')
        self.translate_button = page.locator('button:has-text("开始翻译")')
        self.status_label = page.locator('.translation-status')
        self.download_button = page.locator('a:has-text("下载翻译结果")')

    def upload_pdf(self, file_path: str):
        self.file_input.set_input_files(file_path)

    def select_target_language(self, lang_code: str):
        self.target_lang_select.select_option(lang_code)

    def click_translate(self):
        self.translate_button.click()

    def wait_for_completion(self, timeout: int = 120000):
        expect(self.status_label).to_have_text('翻译完成', timeout=timeout)

    def get_download_url(self) -> str:
        return self.download_button.get_attribute('href')

4.2 核心测试用例

# tests/test_pdf_translate.py
import os
import pytest
from pathlib import Path
from pages.translate_page import TranslatePage

TEST_PDF = Path(__file__).parent / 'fixtures' / 'sample_contract.pdf'

@pytest.mark.e2e
def test_translate_single_pdf(page, tmp_path):
    """测试单PDF翻译流程"""
    # 1. 打开翻译页面
    page.goto('https://www.pdftranslator.com/')
    translate_page = TranslatePage(page)

    # 2. 上传PDF
    translate_page.upload_pdf(str(TEST_PDF))

    # 3. 选择目标语言（中英对照）
    translate_page.select_target_language('zh-en')

    # 4. 点击翻译
    translate_page.click_translate()

    # 5. 等待翻译完成
    translate_page.wait_for_completion(timeout=180000)

    # 6. 验证下载按钮可用
    assert translate_page.download_button.is_visible()

    # 7. 下载并验证文件
    with page.expect_download() as download:
        translate_page.download_button.click()
    download_path = tmp_path / 'translated.pdf'
    download.value.save_as(str(download_path))

    assert download_path.exists()
    assert download_path.stat().st_size > 0

五、关键技巧

5.1 处理大文件上传超时

PDF文件可能很大，上传+翻译可能超过浏览器默认超时。建议：

@pytest.fixture
def page(browser):
    context = browser.new_context(
        timeout=300000,  # 5分钟全局超时
        accept_downloads=True
    )
    page = context.new_page()
    yield page
    context.close()

5.2 处理长任务轮询

翻译是异步任务，前端通常轮询状态或用 WebSocket。Playwright 提供了自动重试的 expect：

def wait_for_completion(self, timeout: int = 180000):
    # 自动重试，每500ms检查一次，最多等3分钟
    expect(self.status_label).to_have_text('翻译完成', timeout=timeout)

5.3 验证翻译质量（可选）

翻译完成后，可以下载翻译结果，做一些基础验证：

def test_translation_preserves_layout(page, tmp_path):
    """验证翻译结果保留原版排版"""
    translate_page = TranslatePage(page)
    translate_page.upload_pdf(str(TEST_PDF))
    translate_page.select_target_language('zh-CN')
    translate_page.click_translate()
    translate_page.wait_for_completion()

    # 下载翻译结果
    with page.expect_download() as download:
        translate_page.download_button.click()
    result_path = tmp_path / 'result.pdf'
    download.value.save_as(str(result_path))

    # 验证PDF可打开
    import pypdf
    reader = pypdf.PdfReader(str(result_path))
    assert len(reader.pages) > 0

    # 验证文本被翻译
    text = reader.pages[0].extract_text()
    assert len(text) > 100  # 不是空白页

六、并行测试

多个PDF翻译测试可以并行执行，加快 CI 速度：

# pytest.ini
[pytest]
addopts = -n 4 --dist loadfile

七、CI/CD集成

GitHub Actions 示例：

name: E2E Tests
on: [push, pull_request]

jobs:
  e2e:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-python@v4
        with:
          python-version: '3.11'
      - run: pip install playwright pytest pytest-playwright
      - run: playwright install chromium
      - run: pytest tests/ -m e2e --video=on
      - uses: actions/upload-artifact@v3
        if: always()
        with:
          name: playwright-videos
          path: test-results/

八、踩过的坑

1. 文件上传路径 ：Windows 下要用 Path 转字符串，避免反斜杠被吞
2. 下载文件路径 ：download.save_as() 必须传字符串
3. Playwright 与 Selenium 冲突：一个环境不要同时装两者
4. 中文PDF渲染：某些PDF字体在Linux容器里没装，需要安装中文字体包

十、总结

Playwright 做端到端测试比 Selenium 更现代------自动等待、跨浏览器、内置录制，特别是处理文件上传下载、异步任务等待非常顺手。配合 pytest 做参数化和并行执行，CI 跑完整个测试套也就5分钟。

工具推荐

• Playwright：浏览器自动化首选
• pytest：测试框架
• pytest-playwright：Playwright pytest 插件
• pypdf：PDF 内容验证