Playwright API 测试中可复用方法的最佳实践-js教程-PHP中文网

Playwright API 测试中可复用方法的最佳实践

本文介绍如何在 playwright 中设计高内聚、低耦合的可复用 api 测试方法，通过封装请求逻辑、统一管理 baseurl 与认证头，并结合类结构与依赖注入提升测试可维护性与可读性。

本文介绍如何在 playwright 中设计高内聚、低耦合的可复用 api 测试方法，通过封装请求逻辑、统一管理 baseurl 与认证头，并结合类结构与依赖注入提升测试可维护性与可读性。

在 Playwright 的 API 测试中，将网络请求逻辑直接写在测试用例里会导致代码重复、难以维护，且不利于环境隔离（如开发/测试/生产）和认证信息统一管理。你遇到的 404 Not Found 问题，根本原因在于原始 subscriptionapi.js 中拼接的 URL 不完整："apiv3.apifootball.com/?action=get_countries" 缺少协议（https://），导致 Playwright 将其视为相对路径，最终向当前测试服务的本地地址发起请求（例如 http://localhost:3000/apiv3.apifootball.com/...），自然返回 404。

✅ 正确做法是：使用类封装 + 显式依赖注入 + 环境变量管理基础配置。以下是推荐的工程化结构：

✅ 1. 创建可复用的 API 客户端类（推荐）

// utils/subscriptionapi.js
import { APIRequestContext } from "@playwright/test";

export class SubscriptionAPI {
  constructor(request, options = {}) {
    this.request = request;
    // 支持运行时传入 baseURL，便于多环境切换（默认从 env 读取）
    this.baseURL = options.baseURL || process.env.API_BASEURL || "https://apiv3.apifootball.com";
  }

  async getSubscriptionsFromAPI() {
    const url = `${this.baseURL}/?action=get_countries`;
    const response = await this.request.get(url, {
      headers: {
        "X-Auth-Token": process.env.API_TOKEN || "abcdef",
      },
    });

    // 建议始终校验状态码并解析响应体
    expect(response).toBeOK();
    const data = await response.json();
    console.log(`✅ GET ${url} → ${response.status()}`);
    return data;
  }
}

? 提示：避免在工具类中 import { test, expect } —— 它们属于测试作用域，不应污染工具层；仅需导入 APIRequestContext 类型即可。

Playwright Browser Automation
使用Playwright API直接进行浏览器自动化。导航网站、与元素交互、提取数据、截图、生成PDF、录制视频，自动化复杂工作流程。比MCP方法更可靠。

下载

✅ 2. 在测试文件中实例化并调用

// tests/subscriptionApiTests.spec.js
import { test, expect } from "@playwright/test";
import { SubscriptionAPI } from "../utils/subscriptionapi.js";

test("get subscriptions from subscription API", async ({ request }) => {
  // ✅ 注入 request 实例，解耦测试上下文与业务逻辑
  const api = new SubscriptionAPI(request, {
    baseURL: "https://apiv3.apifootball.com", // 可覆盖环境变量
  });

  const countries = await api.getSubscriptionsFromAPI();
  expect(Array.isArray(countries)).toBe(true);
  expect(countries.length).toBeGreaterThan(0);
});

⚠️ 关键注意事项

URL 必须带协议：https://apiv3.apifootball.com 而非 apiv3.apifootball.com；
不要在工具模块中 import { test }：会导致模块加载异常或类型污染；
敏感凭证请使用 .env 文件管理：
```
# .env
API_BASEURL=https://apiv3.apifootball.com
API_TOKEN=your-real-token-here
```
并确保已安装 dotenv 并在测试入口（如 playwright.config.ts 或 global-setup.ts）中加载；
错误处理建议增强：生产级封装中可添加重试、日志追踪、超时控制等；
方法命名语义化：getSubscriptionsFromAPI() 更宜改为 getCountries()，贴合实际接口语义（避免 Subscriptions 造成歧义）。