Команда cy.get() является одной из базовых и наиболее
часто используемых команд в Cypress. Она предназначена для поиска
элементов на странице с использованием CSS-селекторов, XPath (с
дополнительными плагинами) или других способов идентификации элементов.
Основной принцип работы cy.get() заключается в том, что она
возвращает объект Cypress, содержащий найденный элемент или
набор элементов, с которым можно далее взаимодействовать.
cy.get('button.submit')
В данном примере команда ищет все элементы
<button> с классом submit. Результатом
будет коллекция элементов, даже если найден только один.
cy.get()Используются стандартные CSS-селекторы:
По тегу:
cy.get('input')
Найдет все элементы <input> на странице.
По классу:
cy.get('.active')
Найдет все элементы с классом active.
По идентификатору:
cy.get('#login')
Найдет элемент с ID login.
Комбинированные селекторы:
cy.get('form#login input.username')
Найдет <input> с классом username,
находящийся внутри формы с ID login.
Атрибутные селекторы:
cy.get('input[name="password"]')
Позволяют выбирать элементы по атрибутам, например name,
type, data-*.
cy.get() по умолчанию ожидает появления
элемента в течение определенного времени, прежде чем вызвать
ошибку. Таймаут по умолчанию — 4 секунды, но его можно
изменить:
cy.get('button.submit', { timeout: 10000 })
Команда будет ждать до 10 секунд, пока элемент не появится в DOM. Это особенно важно для динамически загружаемых страниц или элементов, появляющихся после AJAX-запроса.
Для работы с найденными элементами можно использовать цепочку команд:
.first() и .last() —
выбрать первый или последний элемент из найденной коллекции:
cy.get('li.item').first()
cy.get('li.item').last().eq(index) — выбрать элемент по
индексу (нумерация с нуля):
cy.get('ul li').eq(2).filter(selector) — фильтрация
найденных элементов по дополнительному селектору:
cy.get('div.card').filter('.active').contains(text) — поиск элемента
внутри найденной коллекции по тексту:
cy.get('button').contains('Отправить')cy.get() чаще всего используется как отправная точка для
взаимодействия:
Клик:
cy.get('button.submit').click()Ввод текста:
cy.get('input[name="username"]').type('admin')Проверка видимости или состояния:
cy.get('div.alert').should('be.visible')
cy.get('input[type="checkbox"]').should('be.checked')Каждое взаимодействие возвращает объект Cypress, что позволяет строить цепочки команд без явного ожидания.
Если элемент появляется на странице после некоторого действия или
задержки, cy.get() автоматически повторяет поиск до тех
пор, пока элемент не станет доступен или не истечет таймаут. Это
называется retry-ability и является одной из ключевых
особенностей Cypress, отличающей его от других фреймворков для
тестирования.
Пример работы с динамическим элементом:
cy.get('div.notification', { timeout: 8000 }).should('contain', 'Успешно')
Cypress будет проверять наличие элемента
div.notification в течение 8 секунд и одновременно
проверять, что он содержит текст Успешно.
cy.get()cy.frameLoaded() или специальные плагины.cy.contains()..first() или
.eq(0).Использовать уникальные селекторы (например,
data-cy) для надежных тестов:
cy.get('[data-cy=login-button]').click()Избегать слишком общих селекторов (например,
div или span) — это снижает стабильность
тестов.
Комбинировать с командами фильтрации для точного выбора элемента из множества похожих элементов.
Задавать таймауты для динамических страниц, чтобы предотвратить ложные ошибки при медленной загрузке.
Использовать цепочку команд вместо многократного
вызова cy.get(), чтобы тест был компактным и
читаемым.
Команда cy.get() является фундаментом для взаимодействия
с элементами в Cypress. Она сочетает в себе простоту использования,
автоматическое ожидание элементов и гибкость фильтрации, что делает её
незаменимым инструментом для построения надежных тестов
пользовательского интерфейса.