.11. E2E工具-＜剧作家＞-不仅仅是前端

浅浅的花香味﹌ 2024-03-16 12:01 30阅读 0赞

在与 Playwright 的这条道路上，我们花了很多时间谈论前端世界中的端到端测试和组件测试。但现在是泄露秘密并告诉您一个秘密的时候了。Playwright 也可以在后端使用。

![e7b0bcb776324d818c282a1a3b658fbb.gif][]

API测试  
Playwright 也可以测试 REST API。在某些情况下，您没有 UI，但有 API 集成并且必须以某种方式测试您的集成。

使用 Playwright 的 API 测试，您可以在没有用户界面的情况下调用您的 API 并检查它们的正确执行。

在 Playwright 上做到这一点的关键是request对象。使用此对象，您可以调用 API 并检查其结果。

但是，让我们看一下。

首先，我没有为这个例子创建后端 API，而是使用了一个假的 API 来测试。我用 json-server 和 json-server-auth 创建了它。它们是两个使用 JSON 文件作为数据库并在 API 中公开数据库的 npm 包。  
是时候了解 API 测试的工作原理了。

一个简单的例子可能是这个

test("should call a winner", async ({
       
         request }) => {
       
        
      const result = await request.post("http://localhost:3001/api/winners", {
       
        
        data: {
       
        
          winner: "O",
        },
      });
      expect(result.ok()).toBeTruthy();
      expect(await result.json()).toEqual(
        expect.objectContaining({
       
        
          winner: "O",
          id: expect.any(Number),
        })
      );
    });

这个例子是为了理解一个API测试的结构，然后你会看到一个更复杂的例子。

该request对象由 Playwright 在每个测试中公开，就像浏览器中标准 e2e 测试中的页面对象一样。使用此对象，您可以调用一个或多个 HTTP 请求。然后，当您获得请求的结果时，您可以检查结果是否正常或响应是否符合特定模式。

如您所见，这是基本的

创建请求

等待结果

检查结果

通常，一个简单的 API 测试有这个流程，可能在你可以有一个登录请求之前，因为你的 API 正在认证中，但登录请求只是之前的另一个请求。

我创建了一个更复杂的示例，让您更好地了解可以使用 Playwright 和 API 测试创建的流程（这种方法也可以用于 e2e 测试）。

这个例子是如此结构化。对于每个测试，套件：

创建一个新的 json-server 数据库

创建一个新的 json-server 进程

运行测试

杀死 json 服务器

删除临时数据库

让我们从头开始。我为测试创建了两个文件。一个文件是数据库，其中一行为获胜者，其中有一个用户。另一个文件是路由文件，用于在 API 中进行某种身份验证。（您可以按照之前看到的 json-server 文档了解更多信息）。

所以这两个文件在db文件夹下，以这样的方式出现

// db_test.json
    {
       
        
      "users": [
        {
       
        
          "email": "test@test.it",
          "password": "$2a$10$ONSI/ac5n4iyMj7LfcRIsOzYQ8dqPYK33TTH1Qp7YORPjvofkoTgS",
          "id": 1
        }
      ],
      "winners": [
        {
       
        
          "winner": "X",
          "createdAt": "2023-01-16T21:06:20.749Z",
          "id": 1
        }
      ]
    }

// routes_test.json
    {
       
        
      "/api/*": "/$1",
      "users": 600,
      "winners": 664
    }

现在是时候为获取这两个文件的每个测试创建一个例程，创建数据库的副本，并在特定端口运行 json-server。这样，如果我们有许多并行测试，每个测试都不依赖于其他测试中完成的操作。

为此，我创建了这段代码

// api.spec.ts
    import {
       
         expect, test } from "@playwright/test";

[e7b0bcb776324d818c282a1a3b658fbb.gif]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/16/b2be0b09a59f4f788d403e4f2af2a961.png