Тестирование React приложения

Ух, информативно и по пунктикам, как раз как надо) все за час разложил, даже css задел)
Не помешало бы конечно еще задеть API тесты, но было круто)

Михаил, спасибо большое за уроки! У меня такой вопрос к вам - как подключить в VS code автокомплит методов jest?

Спасибо!

+

Михаил, спасибо! Отличное видео! Надеюсь на продолжения темы тестирования! 8-)

ОГРОМНОЕ СПАСИБО!! Преподавание ведете легко и свобоно! Сразу чувствуется, что полностью в теме!

АААААААА белая тема в вскоде 😲😲😲😲

Очень крутая дикция и манера подачи

Подскажите , как эти тесты работают если в приложении задействован redux?

Отличное видео, большое спасибо!!! Очень чётко, понятно и просто! Примеры супер!

Хорошее видео, но на мой взгляд с тестом стилей тут что-то не то, тестирование по classNames противоречит философии тестирования, тесты должны рассматривать проект с точки зрения пользователя, а пользователю не важно есть ли className с определенным именем на определенном элементе, classNames могу поменяться/перетасоваться так что UI останется прежним, а тесты упадут. По идее правильно было бы смотреть на конкретные стили, изменился ли backgroundColor после какого-либо действия и тд, но react-testing-library при своей эмуляции не создает дом и стилей уэтих элементов не посмотреть(

Крутая подача, странно что так мало подписчиков

Спасибо за материал. Для старта самое оно!

Немного по полочкам в голове расставили, спасибо большое

Дякую.

хоть убей не понимаю смысл снэпшот тестирования, зачем тестировать плейсхолдер и чилдрен, если это функционал реакта? тесты ради тестов

Такой добрый осенний голос)

Дякую за відео, класні кейси покриті для початківців.
дуже зрозуміло!

Интересно, а какую то отдельную ошибку можно игнорировать в Jest? Нашел, как отдельные папки в игнор добавлять, а как конкретное правило игнорить...

Спасибо! Отличный материал

Большое спасибо за подробное объяснение с отличными примерами!

Спасибо за видео. Главный вопрос - как понять какие тесты действительно нужно писать, а какие нет? потому что кажется, что можно придумать под 100 тестов на каждую мелочь и увеличить время разработки в 5 раз, не получив сопоставимой пользы.

Спасибо братишка что все так четко объяснил!

Ну все, после этого видоса я точно готов жениться )

использую в своем проекте, но получаю ошибку на использование jest.fn(). пишет что jest is not defined. установил отдельный пакет jest globals, получил следующую ошибку Do not import `@jest/globals` outside of the Jest test environment. как можно решить данную проблему?

Отличная подача, спасибо. Пару моментов:
1. не dinamyc a dynamic, там еще были грамматические ошикби (советую установить плагин у vs code - Code Spell Checker)
2. toHaveStyle работает в том случае, если ты передашь стили (display: flex) через атрибут style, иначе это просто стили с класса

не знал про либу classnames - понравилась))

Подскажите, пожалуйста, насчет всех видов тестирования. Нужно ли в одном проекте использовать юнит-тестирование, интеграционное и end2end тестирование? Или ты выбираешь какой вариант тебе ближе и тот постоянно используешь?

а может быть метод toHaveStyle() проверяет наличие атрибута style у элемента, ну по типу <div style='color: red;'> </div>??
это предположение))

Планируете записывать видео курс Jest Enzyme? На всем ютубе инфа размазана, приходится часами слушать неструктурированные, местами не понятные обучающие видеоролики. То-то дело Ваши!
Я бы и на платной платформе купил ваш курс по этой теме, но нету, все полноценные курсы на английском только!

возможно прослушал, а что означает значает / / эти штуки и значек i после них?

круто, спасибо

Очень качественное видео про тестирование React приложения. Спасибо.

Спасибо за Ваш труд

Добрые люди,подскажите начинающему AQA js где этот шаблон взять? Установила @testing-lib.../react и jest-dom но никаких файлов кроме node-modules и .json нету(((

Отличное видео!

Если у кого самый последний тест кейс не отрабатывает то это из за того что те места кода которые вызивают обновление стейта нужно оборачивать в act();
test("search filter works", () => {
render(<App />);
expect(screen.getByText("react")).toBeInTheDocument();
expect(screen.getByText("css")).toBeInTheDocument();
act(() => {
userEvent.type(screen.getByRole("textbox"), "script");
});
expect(screen.queryByText('css')).toBeNull();
expect(screen.queryByText('java script')).toBeInTheDocument();
});
Вот так вот оно отработало без ошыбок, а то пару часов бился и не мог понять почему у автора все работает а у меня нет, но потом перезапустил проект и запустил тесты и мне насипалось кучу warning где как раз и советуется , те места которые вызивают обновление стейта нужно оборачивать в act();
Спасибо автору за урок .

Спасибо вас огромное) Изучаю Реакт сейчас, поняла без усилий и пересмотров!)

большое спасибо!

Топ👍🏻

Спасибо вам, очень информативно и без воды

Не работает почему-то тест самый последний с фильтрацией, в консоли говорится, что нужно использовать обёртку act()

ни у кого не появлялась ошибка Warning: An update to App inside a test was not wrapped in act(...) в интеграционных тестах? не пойму как решить

p.s. оборачиваю в act. но начинает ругаться ESLint: Avoid wrapping Testing Library util calls in `act`(testing-library/no-unnecessary-act)

Это одно русское видио в конце 2023 года !! Которое реально полезное и помогает понять как работают тесты с реактом и не только ! По больше бы реально полезных видео от @Mихаил Непомнящий .

Спустя два года все равно актуально, благодарю за качественный материал!

Михаил, спасибо вам за прекрасное объяснение материала. Вы помогли мне разобраться с темой, прикасаться к которой мне не хотелось до последнего)

Nice boost 🎉