如何系统测试实时反应多人游戏？

Question

我正在开发一个实时多人棋盘游戏，使用 node 构建，socket.io 用于后端，react + redux 用于前端。这是我第一次做这种类型的项目，即实时和多人游戏。

我不确定如何最好地进行 integration/system 测试。我怎样才能真正自动启动，比如 10 个前端并让它们一起玩游戏？我应该为此使用测试框架吗？如果是的话，哪个是一个不错的选择，为什么？

Answer 1

我发现这个问题和同一个问题。我已经找到了它的工作方式，我猜你现在也有，但要让其他人遇到：

术语说明：可以使用 mount() 对 Jest + 酶之类的东西进行集成测试。我根据寻找 end-to-end / 验收测试来回答这个问题，您实际上是从用户的角度（在这里，在网站上浏览）测试您的产品。

由于这是从用户的角度出发，我相信您使用的是 React 无关紧要。

那么，如何做到这一点？有many JS testing options。该资源可以帮助了解您可能想要哪个测试包 select。您想要模拟实际浏览器的东西。

在调查上述资源中列出的一些选项时，我发现：

TestCafe does not support multi-page 测试。
WebdriverIO does support同时使用多个浏览器。
Puppeteer does support 同时显示多个页面。

编辑： 我最初建议使用 nightmare。但是，当运行多次测试（意外超时，Electron 实例未正确关闭）时，我遇到了一些奇怪的行为，并且研究了一些其他选项。但我会保留信息以供参考：

我 select 编辑 nightmare 因为它被宣传为简单。

下面是一个示例测试，使用 Jest 和 nightmare（以及一些草率的 TypeScript）。该站点有一个结束玩家回合的按钮，还有一个 header 指示轮到谁了。我将模拟单击该按钮并确保 header 按预期更改。另请注意，在这些测试期间，您将需要您的开发服务器和前端运行。

import * as Nightmare from 'nightmare';


let nightmare1: Nightmare;
let nightmare2: Nightmare;

beforeEach(async () => {
  nightmare1 = new Nightmare({ show: true })
  nightmare2 = new Nightmare({ show: true })
  await nightmare1
    .goto('http://127.0.0.1:3000');
  await nightmare2
    .goto('http://127.0.0.1:3000');
});

afterEach(async () => {
  await nightmare1.end();
  await nightmare2.end();
});

it('sockets turn changes via End Turn button', async () => {
  expect.assertions(6);

  // Both display the same player's turn ("Red's Turn")
  const startingTurnIndicator1 = await nightmare1
    .evaluate(() => document.querySelector('h1').innerText);
  const startingTurnIndicator2 = await nightmare2
    .evaluate(() => document.querySelector('h1').innerText);
  expect(startingTurnIndicator1).toBe(startingTurnIndicator2);

  // Both change ("Blue's Turn")
  const oneClickTI1 = await nightmare1
    .click('button')
    .evaluate(() => document.querySelector('h1').innerText)
  const oneClickTI2 = await nightmare2
    .evaluate(() => document.querySelector('h1').innerText);
  expect(oneClickTI1).toBe(oneClickTI2);
      expect(oneClickTI1).not.toBe(startingTurnIndicator1);

  // Both change back ("Red's Turn")
  const twoClickTI2 = await nightmare2
    .click('button')
    .evaluate(() => document.querySelector('h1').innerText)
  const twoClickTI1 = await nightmare1
    .evaluate(() => document.querySelector('h1').innerText);
  expect(twoClickTI1).toBe(twoClickTI2);
  expect(twoClickTI1).toBe(startingTurnIndicator2);
  expect(twoClickTI1).not.toBe(oneClickTI1);
});

我不确定此测试中的实际代码好如何，但它可以工作。

如何系统测试实时反应多人游戏？

How to system-test real-time react multiplayer game?

testing

integration-testing

multiplayer

socket.io

reactjs