我正在尝试熟悉 Test Cafe，但目前我陷入困境。 我有一个网络应用程序，我想测试从登录开始到注销结束。 当我使用错误的凭据登录时，我会显示一个 id = errorMsg 的 DOM 元素。
通过 Test Cafe，我想检查 DOM 元素是否存在。
这是我的测试脚本，basic-page-model.js 是测试中使用的所有 DOM 元素 id 的集合。
import Page from './basic-page-model';
import { Selector } from 'testcafe';
fixture `Full Test Run of Main Features Role User`
.page `https://localhost:8443/login.jsp`;
const page = new Page();
const errorMessage= Selector('#errorMsg');
test('login test', async t => {
await t
.typeText(page.nameInput, 'user')
.typeText(page.passInput, 'user') //correct password -> password
.click(page.login)
.expect(errorMessage.exists).notOk();
});
无论登录是否失败，它总是返回测试通过。 有人可以指出我正确的方向吗？
最佳答案
根据您的测试代码，在两种情况下都没有 #errorMsg DOM 元素:具有正确和不正确的凭据。我创建了一个简单的示例，效果很好:
index.html(存在错误消息)
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Error Message</title>
</head>
<body>
<div id="errorMsg">
<p>Error Message</p>
</div>
</body>
</html>
no-message.html(无错误消息)
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>No Error Message</title>
</head>
<body>
</body>
</html>
test.js
import { Selector } from 'testcafe';
fixture `Error message`;
const errorMessage = Selector('#errorMsg').addCustomDOMProperties({
outerHtml: el => el.outerHtml
});
test
.page('localhost:8080/no-message')
('message should not exist', async t => {
await t
.expect(errorMessage.exists).notOk();
});
test
.page('localhost:8080')
('message should exist', async t => {
await t
.expect(errorMessage.exists).ok();
});
结果:
>testcafe chrome test.js
Running tests in:
- Chrome 83.0.4103.116 / Windows 10
Error message
√ message should not exist
√ message should exist
2 passed (0s)
您的测试中可能有错误的错误消息id。
如果上面的示例没有帮助，我建议您用一个简单的项目更新您的问题。
关于testing - Testcafe 检查 DOM 元素是否不存在，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/62881945/