TestCafe - 将选择器的结果存储在变量中
TestCafe - Storing results of Selector in variable
所以为了测试,我的搜索结果根据我输入的关键字而不同,我想在输入关键字之前存储搜索结果的节点列表,然后将它们与我得到的搜索结果的节点列表进行比较添加关键字,但我无法使其正常工作。
我试过:
let results = await Selector('#example')
但是,这并没有给我返回一个节点列表。
我还尝试只使用带有 document.querySelectorAll()
的 clientFunction,但 TestCafe 然后告诉我改用 Selector。
怎么办?是否有更好的方法来测试这个,我没有看到?
您可以提取所有需要的属性以供以后比较。
检查这个小例子:
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
function removeSpanId3 () {
const span = document.getElementById('id3');
document.querySelector('div').removeChild(span);
}
</script>
<button id="removeSpan" onclick="removeSpanId3()">Remove span</button>
<div>
<span id="id1">
test1
</span>
<span id="id2">
test12
</span>
<span id="id3">
test123
</span>
<span id="id4">
none
</span>
</div>
test.js:
import { Selector } from 'testcafe';
fixture `test`
.page('http://localhost:8080');
test('Test1', async t => {
const results = await Selector('span');
const resultsCount1 = await Selector('span').count;
const result1 = [];
const result2 = [];
for (let i = 0; i < resultsCount1; i++) {
const text = await results.nth(i).innerText;
result1.push(text);
}
// Remove span
await t.click(Selector('button').withText('Remove span'));
const resultsCount2 = await Selector('span').count;
for (let i = 0; i < resultsCount2; i++) {
const text = await results.nth(i).innerText;
result2.push(text);
}
await t
.expect(result1.length).eql(result2.length + 1);
});
所以为了测试,我的搜索结果根据我输入的关键字而不同,我想在输入关键字之前存储搜索结果的节点列表,然后将它们与我得到的搜索结果的节点列表进行比较添加关键字,但我无法使其正常工作。
我试过:
let results = await Selector('#example')
但是,这并没有给我返回一个节点列表。
我还尝试只使用带有 document.querySelectorAll()
的 clientFunction,但 TestCafe 然后告诉我改用 Selector。
怎么办?是否有更好的方法来测试这个,我没有看到?
您可以提取所有需要的属性以供以后比较。
检查这个小例子:
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
function removeSpanId3 () {
const span = document.getElementById('id3');
document.querySelector('div').removeChild(span);
}
</script>
<button id="removeSpan" onclick="removeSpanId3()">Remove span</button>
<div>
<span id="id1">
test1
</span>
<span id="id2">
test12
</span>
<span id="id3">
test123
</span>
<span id="id4">
none
</span>
</div>
test.js:
import { Selector } from 'testcafe';
fixture `test`
.page('http://localhost:8080');
test('Test1', async t => {
const results = await Selector('span');
const resultsCount1 = await Selector('span').count;
const result1 = [];
const result2 = [];
for (let i = 0; i < resultsCount1; i++) {
const text = await results.nth(i).innerText;
result1.push(text);
}
// Remove span
await t.click(Selector('button').withText('Remove span'));
const resultsCount2 = await Selector('span').count;
for (let i = 0; i < resultsCount2; i++) {
const text = await results.nth(i).innerText;
result2.push(text);
}
await t
.expect(result1.length).eql(result2.length + 1);
});