javascript - 如何使用 testcafe 打印 promise 的内部文本？

Question

我正在尝试执行一个断言，打印出警报横幅的文本上下文。仅当用户输入错误的登录信息时，该横幅才可见。这是断言:

await t
    .expect(login.alertMessage.exists)
    .notOk(
        "I don't see the user details page. I see this " +
        await login.alertMessage.innerText 

    );

如果他输入了错误的信息，断言总是会通过。

如果我进行负面测试(意味着如果用户输入正确的登录信息)，则断言将在此行失败:await login.alertMessage.innerText 并且错误消息为

1) 无法获取有关节点的信息，因为指定的选择器与 DOM 树中的任何节点都不匹配。

如果我删除 await login.alertMessage.innerText 中的 await ，则断言不会显示横幅的内部文本。相反，我看到

1) AssertionError:我没有看到用户详细信息页面。我看到这个:{“_then”:[]，“_taskPromise”:null}:预期 true 为 false

任何帮助将不胜感激。

Answer 1

您传递给 .notOk() 的参数表达式函数总是在 Expect 语句完成断言之前执行。

这意味着 await login.alertMessage.innerText始终在 expect 之前执行声明。

当用户输入正确的登录信息时，TestCafe 将找不到alertMessage 选择器，并会输出您提到的第一个错误。

当您删除await时关键字，selector.innerText是 Promise<string> ;将此 Promise 与字符串连接将调用 Promise 上的 toString() 方法，但不会解析 Promise 本身。

你应该像这样重写你的期望语句:

const alertMessage = login.alertMessage;
if (await alertMessage.exists) {
    throw new Error(`user cannot login: ${await alertMessage.innerText}`);
}

但是这样做您可能会遇到另一个问题:警报弹出窗口可能需要一些时间才能出现在 DOM 中，并且可能会在 if 语句执行后出现，并且当用户无法登录时您将得到误报测试。

为了防止这种情况，您必须在输入 if 语句之前实现自己的等待机制。 一种解决方案是:

const alertMessage = login.alertMessage;
await t.wait(5000);
if (await alertMessage.exists) {
    throw new Error(`user cannot login: ${await alertMessage.innerText}`);
}

您还可以替换 await t.wait(5000)使用更复杂的方法，如所解释的 here