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

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

---

我不确定如何最好地进行集成/系统测试。我怎样才能真正自动化旋转，比如说10个前端，让他们一起玩游戏？我是否应该为此使用一个测试框架？如果是的话，哪一个是一个好的选择？为什么？

我发现这个问题与同一个问题相同。我已经想出了一个办法让它发挥作用，我猜你现在也有了，但其他人可能会遇到：

关于术语的澄清：可以使用mount（）对与Jest+酶等反应进行集成测试。我是在寻找端到端/验收测试的基础上回答这个问题的，在这里，你基本上是从用户的角度（这里，在网站上导航）测试你的产品

因为这是从用户的角度来看的，所以我认为使用React与此无关

那么，如何做到这一点呢？有。该资源有助于理解您可能想要选择的测试包。您需要模拟实际浏览器的东西

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

• 进行多页测试
• 同时执行多个浏览器
• 同时创建多个页面

编辑：我最初建议使用梦魇。然而，我在运行多个测试时遇到了一些不稳定的行为（意外超时、电子实例未正确关闭），并研究了其他一些选项。但我会保留这些信息以供参考：

我之所以选择它，是因为广告上说它很简单

下面是一个示例测试，使用Jest和噩梦（以及一些草率的打字脚本）。该站点有一个按钮来结束玩家的回合，并且有一个标题指示该轮到谁。我将模拟单击该按钮并确保标题按预期更改。还要注意，在这些测试期间，您需要运行dev服务器和前端

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);
});

我不确定这个测试中的实际代码有多好，但它可以工作