Использование селекторов в TestCafe, необходимо захватить элемент с идентификатором и классом - PullRequest
0 голосов
/ 04 декабря 2018

Используя TestCafe, мне нужна помощь в выборе элемента из таблицы и нажатии на этот элемент.На веб-странице есть несколько таблиц, в которых элемент этого класса = "элемент записи таблицы кликабелен", но я хочу выбрать только первый экземпляр этого класса после id = "alert", где id = "alert" - начало моегожелаемый стол.

Есть несколько разных вещей, которые я пробовал, но ни одна из них не сработала для меня должным образом.Вот некоторые из этих попыток.

test('Try #1) Select and click on item', async t=> {
    const table_element = await Selector('#alert').child('.table-entry.item.clickable');

await t
// clicks on the desired table element
    .click(table_element)
});

test('Try #2) Select and click on item', async t=> {
var table_element = page.getElementByID("alert").getElementsByClassName("table-entry.item.clickable")[0];

await t
// clicks on the desired table element
    .click(table_element)
});        

Любая помощь будет оценена.Дайте мне знать, если понадобится какая-либо дополнительная информация, которую я пропустил.

1 Ответ

0 голосов
/ 05 декабря 2018

Насколько я понимаю из вашего описания, у вас есть разметка, подобная следующей:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
</head>
<body>

<div id="alert">
    <div>
        <table class="table">
            <tr>
                <td>
                    <div class="table-entry item clickable">
                        item
                    </div>
                </td>
            </tr>
    </div>
</div>
</body>
</html>

В этом случае вы не можете использовать селектор child из вашего первого примера, потому что childселектор возвращает только прямых потомков элемента.Лучше использовать следующий селектор

await t.click(Selector('#alert .table-entry.item.clickable'));

Этот селектор возвращает потомка элемента #alert с классом .table-entry.item.clickable независимо от иерархии элементов

...