Cypress для End2end тестирования. Первый взгляд

Для тестирования полного функционала веб-приложения часто бывает недостаточно unit и интеграционных тестов. Здесь на сцену выходит end2end тестирование и одним из самых передовых решений является библиотека Cypress, широко востребованная в западных компаниях.
Стартовый проект для тестирования
github.com/mic...
Финальный вариант с тестами
github.com/mic...
Мои курсы по вебу с купонами:
✅ mishanep.com/
📢 Поддержка канала:
/ mishanep
www.tinkoff.ru...
paypal.me/mish...
#cypress

[@e.chefranov]

Очень приятный и наглядный урок, без лишней воды и по теме. Хочется еще уроков по Cypress в вашем исполнении. Спасибо!

[@yatut4467]

Спасибо, толковое видео, мало воды и все более чем понятно

[@DreamingDolphing]

Отличная подача материала. Спасибо.

[@awesomawesom372]

Спасибо за единственный толковый ролик на русском языке по Сайпресу! От вас бы увидеть дальнейшие уроки по этому инструменту!

[@MrOzziris]

Тезка, спасибо за твои труды, все видосы информативные и полезные. Всего тебе наилучшего!)

[@mishanep]

Спасибо на добром слове, тёзка :)

[@levient]

@@mishanep а Вас прям Михаилом назвали, или Вы что-то скрываете?)

[@valeriafurmanets2817]

Вау, спасибо большое! Очень крутой урок!

[@nerrisy8839]

Спасибо за урок. Подробно для новичка, понравилось

[@romanbush5164]

Блин как круто, хорошо бы тестировщикам начать чем то этим пользоваться. Наверно можо это сделать как отдельный проект. Конечно это для использования исключительно фронтенд разработчиком.

[@andrewkhar4615]

Спасибо! Успехов в дальнейшем!

[@misterX389]

Михаил, это лучший видос по сайпресс.

[@tatianatolubaeva8851]

Спасибо вам! Очень понятный разбор!

[@makeoverweb2663]

супер, спасибо!

[@olfi1728]

Спасибо

[@STELLS541]

очень полезно)

[@СемёнХеруимов-к6з]

Спасибо =)

[@NeoCoding]

в общих черта ясно, но надо конечно знать эти все варианты команд, а это прям учить надо все, или постоянно чатботить пока не запомнятся

[@ВладиславШкутович-ф1ь]

Отличная подача информации. Всё кратко, понятно и по делу. Спасибо!

[@Коджибака]

Жаль не разобрано. Та еще головомойка

[@OlgaLazarenko]

не запускаеться демо, только Welcome to Cypress! Review the differences between each testing type без рана тестов. И никаких папок не появилось после npm run test:cypress

[@Vinits-i]

А что-то посложнее первых тестов есть?

[@Mykola.Voloshyn]

не працює test:cypress, тільки npx cypress open

[@tyxa6540]

Как быть если на странице 15 одинаковых инпутов (класс, название, type) . Как выбрать именно нужный инпут и ввести туда текст?

[@mishanep]

Чаще всего на инпутах висит атрибут name с уникальным значением, можно использовать его.

[@tyxa6540]

@@mishanep к сожалению не вижу атрибута name, я могу скинуть куда-то скриншот инпута с его атрибутами. Сможете помочь , чтобы выбирался именно нужный инпут и туда вводился текст?

[@mishanep]

@@tyxa6540 Если это сайт, над которым вы работаете, то добавить атрибут несложно. Если для веб-скрапинга, то тут я вам не помощник :)

[@КостяКонев-з1н]

Здравствуйте. У меня cypress не сохраняет состояние сайта и перед каждый новым тестам обнуляет то, что мы сделали в предыдущих тестах. chatGPT предложил мне решении, но оно довольно громоздкое, нужно в каждом тесте сохраняться стейт в переменную и дальше эту переменную использовать в следующем тесте (+-). Есть ли какой-то более просто способ сказать cypress, чтобы он не обнулял изменения, которые были сделаны в предыдущих тестах?

[@КостяКонев-з1н]

И сейчас я прописываю cy.visit() в каждом тесте

[@mishanep]

Приветствую. Давно не работал с Cypress, ответить не смогу.

[@ReaktorGaming86]

Я не понимаю, как cypress определяет, где искать компонент, который мы тестируем? Почему мы пишем cy.visit('/'). Нужно ли использовать @cypress/react? У меня ничего не работает. ReferenceError: React is not defined. И еще, почему при использовании start-server-and-test у меня вместо теста открывается сам проект, как будто я запускаю npm start? И использует порт 3000 вместо 3010, который я указал.

[@mishanep]

Мы тестируем приложение в целом, а не отдельный компонент, поэтому открываем конкретную страницу. cy.visit("/") открывает главную страницу. Указанная ошибка возможно говорит о том, что у вас 16я версия реакта, у меня в примере 17я, где явно импортировать Реакт не требуется. При старте теста у вас должен запуститься локалхост с приложением (это и будет главной страницей для теста). По-моему я прилагал ссылку на свой проект. Можно для начала скачать его, поиграться. Возможно понимания станет больше.

[@ReaktorGaming86]

@@mishanep У меня React 17-й

[@ReaktorGaming86]

@@mishanep ваш проект при npm i выдает ошибку: Unable to authenticate, your authentication token seems to be invalid.

[@mishanep]

@@ReaktorGaming86 хм, тогда удалите yarn.lock, а то у меня с корпоративными прокси всё устанавливалось. Без него всё должно установиться.

[@gffftxxx]

Ща уже потихонечку на Playwright двигаются все

[@iharrwe]

Спасибо. Насколько приятнее стало тестировать компоненты благодаря cypress

[@A_Man_with_a_Dream]

Спасибо большое! Освежил информацию :)

[@OlgaLazarenko]

а еще реакт надо устанавливать?

[@mishanep]

У вас должно быть приложение, которое вы будете тестировать. В моем случае оно на реакте.