反应：超时 - 在 jasmine.DEFAULT_TIMEOUT_INTERVAL 指定的超时内未调用异步回调

Question

在我的反应应用程序中，我正在尝试使用 puppeteer（开玩笑）编写 e2e 测试。

test.js

  const puppeteer = require("puppeteer");

    let browser;
    let page;

    describe("LoginPage", () => {
     beforeAll(async () => {
     browser = await puppeteer.launch({
     headless: false,
     slowMo: 250
    });
      page = await browser.newPage();
    });

   it("should display login page", async () => {
     await page.goto("http://localhost:3000/");
     const text = await page.evaluate(() => document.body.innerText);
     expect(text).toContain("Unity");
   });

    it("should show error message if email is not correct", async() => {
      await page.type("#email", "user");
      await page.type("#password", "pass");
      await page.click("button[type=submit]";

            const errorMessage = await page.evaluate(
            async () =>
             document.getElementsByClassName("ui negative message container")[0]
            );
          console.log("errorMessage", errorMessage);
       });
    });

但这种 e2e 测试无法使其发挥作用。

我收到一个错误：

Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.

有人可以帮我解决这个问题吗？

Answer 1

使用 jest v23，我会尝试超时和一些小版本的代码（检查 cmets）：

const puppeteer = require("puppeteer");

let browser;
let page;

describe("LoginPage", () => {
  beforeAll(async() => {
    browser = await puppeteer.launch({
      headless: false,
      slowMo: 250
    });
    page = await browser.newPage();
  }, 60e3); // timeout

  afterAll(() => browser.close()); // <-- don't leave browser hanging after the suite

  beforeEach(() => page.goto("http://localhost:3000")); // start with fresh page between test, don't keep implicit page state dependency

  it("should display login page", async() => {
    const text = await page.evaluate(() => document.body.innerText);
    expect(text).toContain("Unity");
    done(); //here
  });

  it("should show error message if email is not correct", async() => {
    await page.type("#email", "user");
    await page.type("#password", "pass");
    await page.click("button[type=submit]");

    try { // you need to try catch the error with async await
      await page.evaluate(
        () => document.getElementsByClassName("ui negative message container")[0] // no need for async
      );
    } catch (errorMessage) {
      console.log("errorMessage", errorMessage);
    }
    
    // you lack the expectation in the test
    // expect(true).toBe(true)
  });
});