网络服务器

介绍

🌐 Introduction

Playwright 在配置文件中提供了一个 webServer 选项，它可以让你在运行测试之前启动本地开发服务器。这在开发期间编写测试时非常理想，尤其是在没有可用于测试的预发布或生产环境 URL 时。

🌐 Playwright comes with a webServer option in the config file which gives you the ability to launch a local dev server before running your tests. This is ideal for when writing your tests during development and when you don't have a staging or production url to test against.

配置网络服务器

🌐 Configuring a web server

在 Playwright 配置中使用 webServer 属性，在测试期间启动开发 Web 服务器。

🌐 Use the webServer property in your Playwright config to launch a development web server during the tests.

playwright.config.ts

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

export default defineConfig({
  // Run your local dev server before starting the tests
  webServer: {
    command: 'npm run start',
    url: 'http://localhost:3000',
    reuseExistingServer: !process.env.CI,
    stdout: 'ignore',
    stderr: 'pipe',
  },
});

| 属性 | 描述 |

| :- | :- |

| testConfig.webServer | 在测试期间启动一个开发 Web 服务器（或多个）。 |

| command| 启动应用本地开发服务器的 Shell 命令 |

| cwd | 生成进程的当前工作目录，默认为配置文件所在目录。 |

| env | 命令的环境变量。默认继承 process.env 并添加 PLAYWRIGHT_TEST=1。 |

| gracefulShutdown | 如何关闭进程。如果未指定，则进程组将被强制 SIGKILL。如果设置为 { signal: 'SIGTERM', timeout: 500 }，则进程组将收到 SIGTERM 信号，如果 500 毫秒内未退出，则随后发送 SIGKILL。你也可以使用 SIGINT 作为信号。0 超时意味着不会发送 SIGKILL。Windows 不支持 SIGTERM 和 SIGINT 信号，因此在 Windows 上会忽略此选项。注意，关闭 Docker 容器需要 SIGTERM。 |

| ignoreHTTPSErrors | 在获取 url 时是否忽略 HTTPS 错误。默认值为 false。 |

| name | 指定网页服务器的自定义名称。此名称将作为日志消息的前缀。默认值为 [WebServer]。 |

| port | 已弃用。请改用 url。这是你的 HTTP 服务器预期出现的端口。它会等待直到接受连接。应指定 port 或 url。 |

| reuseExistingServer| 如果 true，它将在可用时重用 port 或 url 上的现有服务器。如果没有服务器在 port 或 url 上运行，它将执行命令以启动一个新服务器。如果 false，当现有进程正在监听 port 或 url 时，它将抛出错误。通常应将其设置为 !process.env.CI，以便在本地运行测试时使用本地开发服务器。 |

| stderr | 是否将命令的标准错误输出重定向到进程的标准错误输出或忽略它。默认值为 "pipe"。 |

| stdout | 如果 "pipe"，它将把命令的标准输出传送到进程的标准输出。如果 "ignore"，它将忽略命令的标准输出。默认值为 "ignore"。 |

| timeout | 等待进程启动并可用的时间（以毫秒为单位）。默认值为60000。 |

| url| 你期望返回 2xx、3xx、400、401、402 或 403 状态码的 HTTP 服务器的 URL，当服务器准备好接受连接时。应指定 port 或 url 中的一个。 |

| wait | 仅当生成输出时才认为命令已启动。接收一个包含可选 stdout 和/或 stderr 正则表达式的对象。正则表达式中的命名捕获组会存储在环境中，例如 /Listening on port (?<my_server_port>\d+)/ 会将端口号存储在 process.env['MY_SERVER_PORT'] 中。 |

添加服务器超时

🌐 Adding a server timeout

网页服务器有时启动时间会更长。在这种情况下，你可以延长超时时间，等待服务器启动。

🌐 Webservers can sometimes take longer to boot up. In this case, you can increase the timeout to wait for the server to start.

playwright.config.ts

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

export default defineConfig({
  // Rest of your config...

  // Run your local dev server before starting the tests
  webServer: {
    command: 'npm run start',
    url: 'http://localhost:3000',
    reuseExistingServer: !process.env.CI,
    timeout: 120 * 1000,
  },
});

添加 baseURL

🌐 Adding a baseURL

还建议在配置的 use: {} 部分指定 baseURL，这样测试可以使用相对 URL，而无需重复指定完整的 URL。

🌐 It is also recommended to specify the baseURL in the use: {} section of your config, so that tests can use relative urls and you don't have to specify the full URL over and over again.

在使用 page.goto()、page.route()、page.waitForURL()、page.waitForRequest() 或 page.waitForResponse() 时，它会通过使用 URL() 构造函数来构建相应的 URL，从而考虑基础 URL。例如，通过将 baseURL 设置为 http://localhost:3000 并在测试中导航到 /login，Playwright 将使用 http://localhost:3000/login 运行测试。

🌐 When using page.goto(), page.route(), page.waitForURL(), page.waitForRequest(), or page.waitForResponse() it takes the base URL in consideration by using the URL() constructor for building the corresponding URL. For Example, by setting the baseURL to http://localhost:3000 and navigating to /login in your tests, Playwright will run the test using http://localhost:3000/login.

playwright.config.ts

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

export default defineConfig({
  // Rest of your config...

  // Run your local dev server before starting the tests
  webServer: {
    command: 'npm run start',
    url: 'http://localhost:3000',
    reuseExistingServer: !process.env.CI,
  },
  use: {
    baseURL: 'http://localhost:3000',
  },
});

现在你可以在导航页面时使用相对路径：

🌐 Now you can use a relative path when navigating the page:

test.spec.ts

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

test('test', async ({ page }) => {
  // This will navigate to http://localhost:3000/login
  await page.goto('./login');
});

多个网络服务器

🌐 Multiple web servers

可以通过提供一组 webServer 配置来同时启动多个 Web 服务器（或后台进程）。更多信息请参见 testConfig.webServer。

🌐 Multiple web servers (or background processes) can be launched simultaneously by providing an array of webServer configurations. See testConfig.webServer for more info.

playwright.config.ts

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

export default defineConfig({
  webServer: [
    {
      command: 'npm run start',
      url: 'http://localhost:3000',
      name: 'Frontend',
      timeout: 120 * 1000,
      reuseExistingServer: !process.env.CI,
    },
    {
      command: 'npm run backend',
      url: 'http://localhost:3333',
      name: 'Backend',
      timeout: 120 * 1000,
      reuseExistingServer: !process.env.CI,
    }
  ],
  use: {
    baseURL: 'http://localhost:3000',
  },
});