Найти элемент по значению свойства

Question

Я тестирую веб-приложение с использованием Nightwatch.js, которое использует Selenium WebDriver для взаимодействия с браузером. В моем приложении у меня есть динамически созданный список элементов, дифференцированных только по их именам, а имена отображаются как значения <input>. Мне нужно найти элемент по его названию.

Пример HTML-представление структуры документа:

<div class="item"> 
    <input> <!-- current value: "first" --> 
</div> 
<div class="item"> 
    <input> <!-- current value: "second" --> 
</div> 
<div class="item"> 
    <input> <!-- current value: "first" --> 
</div> 

мне нужно найти div.item, содержащий входной сигнал со значением second.

Обратите внимание, что значение в <input> определяется значением его valueсобственности, которая может отличаться от значения его valueатрибута. В моем случае DOM управляется React, поэтому входы могут не иметь атрибута value.

Есть ли способ найти элемент по property значение с Nightwatch (или Selenium WebDriver API)?

Я посмотрел на WebDriver documentation и единственный способ, которым я вижу executing пользовательский JavaScript кода, который имеет некоторые серьезные недостатки (например, требует собственной реализации ожидания для элемента появляться и не взаимодействует с NightWatch объектов страницы). Насколько я могу судить, все другие методы связаны только с HTML (так что атрибуты в лучшем случае, а не свойства).

---

Просто, чтобы быть совершенно ясно, с помощью селекторов, как input[value=...] (CSS) или //input[@value=...] (XPath) является не решение, так как он выполняет поиск по значению атрибута, а не значения свойства.

Answer 1

Вы можете использовать .elements(), чтобы получить список элементов с class="item", а затем перебрать все элементы, используя .getValue(), чтобы получить значение свойства каждого входа. Если он соответствует имени, которое вы хотите, верните элемент.

function getElementsByValue(xpathSelector, expectedValue, callback) { 
    const foundElements = []; 
    browser.elements('xpath', xpathSelector, ({ value }) => value.forEach(inputEl => { 
    browser.elementIdValue(inputEl.ELEMENT, result => { 
     if (result.value === expectedValue) { 
     foundElements.push(inputEl); 
     } 
    }); 
    }); 
    browser.perform(() => callback(foundElements)); 
}