Как проверить имя класса CSS в конкретном элементе HTML с капибарой?

Question

Я хочу проверить, что мой конкретный элемент tr получает класс selected css, добавленный к нему при нажатии на ячейку. Я хочу идентифицировать конкретную строку по ее тексту, затем щелкните ячейку в строке и затем проверьте ее классы CSS.

Этот код, который проверяет этот CSS на всей странице, похоже, работает:

row = find(:xpath, "//tr[contains(., 'My Text')]")
cell = find(:xpath, "//tr[contains(., 'My Text')]/td")
expect(page).to_not have_css("tr.selected") # success
cell.click
expect(page).to have_css("tr.selected") # success

... но я бы хотел ограничить поиск конкретным объектом строки. Этот код никогда не находит css, который я ищу, и всегда терпит неудачу последний expect.

row = find(:xpath, "//tr[contains(., 'My Text')]")
cell = find(:xpath, "//tr[contains(., 'My Text')]/td")
expect(row).to_not have_css("tr.selected")
cell.click
expect(row).to have_css("tr.selected") # fails

Когда я смотрю на row[:class] после click, я вижу 'selected' в его списке классов. Как правильно ограничить свой тест поиском класса .selected только в моей конкретной строке?

Answer 1

have_css проверяет потомков, чтобы проверить текущий элемент, который вы хотите match_css

row = find(:xpath, "//tr[contains(., 'My Text')]")
cell = row.find('td')
expect(row).to_not match_css("tr.selected")
cell.click
expect(row).to match_css("tr.selected")

Кроме того, если у вас нет особой необходимости использовать XPath

row = find('tr:not(.selected)', text: 'My Text')
row.find('td').click
expect(row).to match_css('tr.selected')

читается намного лучше