Тестирование JavaScript от А до Я (Jest, React Testing Library, e2e, screenshot)

Ғылым және технология

В этом ролике мы научимся тестировать JS приложения. Ознакомимся с JEST и научимся писать UNIT тесты. С помощью React testing library и jest научимся писать интеграционные тесты на react приложения в связке с react router dom и redux. Используя WebdriverIO научимся писать e2e тесты в реакт приложении. Также с помощью storybook и loki js научимся делать регрессионное тестирование UI части приложения.
Мой курс "Продвинутый Frontend. В production на React" - ulbitv.ru/frontend
Мой канал в telegram и канал для общения подписчиков - t.me/ulbi_tv
Весь исходный код из ролика здесь - t.me/ulbi_tv/64
Таймкоды:
00:00 ➝ Введение. Теория. Пирамида тестирования. Квадрат допустимых значений
12:00 ➝ Практика. unit тесты с JEST
27:40 ➝ Юнит тестирование асинхронных функций. Мокаем данные. Snapshots
37:00 ➝ Тестирование React приложений. React Testing library
42:50 ➝ findBy, getBy, queryBy. Пример с useEffect. Асинхронный код
49:00 ➝ Тестирование событий. onClick, onChange, onInput. FireEvent, userEvent
54:40 ➝ Тестирование компонента с асинхронной загрузкой данных с сервера
58:40 ➝ Интеграционное тестирование в связке с react router dom v6
01:07:20 ➝ Хелпер для удобного тестирования роутинга
01:12:10 ➝ Интеграционное тестирование в связке с Redux toolkit
01:16:00 ➝ Тестируем селектор
01:22:00 ➝ Хелпер для удобного тестирования компонентов, в которых используется Redux
01:25:00 ➝ e2e тесты с WebdriverIO
01:33:00 ➝ PageObject паттерн
01:38:15 ➝ Пример е2е теста с асинхронным кодом
01:44:45 ➝ Скриншотные тесты storybook и loki js
01:53:00 ➝ Ставим лайки и пишем комменты, всем спасибо)
Поддержать меня и мой канал вы можете по ссылкам ниже.
Patreon/boosty (доступ к бонусам) - boosty.to/ulbitv
Qiwi кошелек - qiwi.com/n/BODYE821
Яндекс деньги - yoomoney.ru/to/4100116193037469

Пікірлер: 659

  • @efimkapliy6370
    @efimkapliy637024 күн бұрын

    Отличное видео по тестированию во Frontend на React! Актуально в 2024!

  • @user-rx1dg3tk8c
    @user-rx1dg3tk8c2 жыл бұрын

    Благодаря Тимуру многому научился. Перед тем как сделать Cloud Disk самостоятельно и окончательно разобраться во всем, прошел другие необходимые курсы на этом замечательном канале. И вот финишная прямая - Деплой, и что товарищи я получаю от Heroku при регистрации - следующий ответ: We do not accept sign-ups from your country. Все знают с чем это связано на сегодняшнюю дату. Такова жизнь, блин...

  • @varanakonda
    @varanakonda2 жыл бұрын

    давайте лайкнем и прокомментируем этот видос чтобы в мире стало больше чистого кода покрытого тестами

  • @user-yk4ie1ks4v
    @user-yk4ie1ks4v2 жыл бұрын

    Просто шикарно - в интернете крайне сложно найти хорошую информацию про тестирование, а тут все структурировано в одном видео. Большое спасибо!

  • @sashap1rus562
    @sashap1rus5622 жыл бұрын

    Наконец, как же я долго ждал этого курса от тебя, поможем Тимуру поднять видос в топ!!!

  • @user-jz6tu5lh8r
    @user-jz6tu5lh8r2 жыл бұрын

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

  • @dmitrykarpovich186
    @dmitrykarpovich1862 жыл бұрын

    То чего очень не хватало) Спасибо большое, буду изучать на днях!

  • @skysar
    @skysar2 жыл бұрын

    Вот это просто бомба! Тестирование - это самая обделённая вниманием тема на ютубе, по моему мнению. Спасибо, Тимур!

  • @HaveFun77777
    @HaveFun777772 жыл бұрын

    КРУТО! Спасибо, давно ждал от тебя видео по тестам!

  • @user-ht5qv3wy4z
    @user-ht5qv3wy4z2 жыл бұрын

    Ой браток, как же вовремя видос за тесты, как раз собирался их изучать, а здесь 2 часа практики, делаешь годноту, респект тебе! :)

  • @kamenskiy7703
    @kamenskiy77032 жыл бұрын

    Тимур, огромное спасибо за твой труд и старания Просто знай, что мы ценим это)

  • @user-bl4te2kg8v
    @user-bl4te2kg8v2 жыл бұрын

    А что тут сказать? Все ОЧЕНЬ здорово!!! Впрочем как всегда. Огромнейшее СПАСИБО. Здоровья и благополучия!!!

  • @aleksandrzelenskiy4000
    @aleksandrzelenskiy40002 жыл бұрын

    Тестирование это то чего так не хватало! Спасибо Тимур! JEST, e2e, React Testing Library! Огонь!

  • @Evgeny..
    @Evgeny..2 жыл бұрын

    Js, JavaScript, test, тестирование. Тимур! Спасибо тебе огромное, ты лучший. Всех благ тебе!

  • @disconnect355
    @disconnect3552 жыл бұрын

    Очень нужно разобраться в написании тестов. Автор молодец, автору спасибо)

  • @danevgen
    @danevgen2 жыл бұрын

    Сильно ждал тесты. СПАСИБО огромное!

  • @antonskrebetz4935
    @antonskrebetz49352 жыл бұрын

    Ульби, отличный канал, без преувеличения. Поставил колокольчик пару месяцев назад, как нашел твой канал. Все видео крайне полезны, без лишней воды, с хорошими практическими примерами. Еще не посмотрел тесты, но даже не сомневаюсь в полезности материала! Продолжай в том же духе! Всем знакомым рекомендую твой канал. Это наверно мой первый комментарий на KZread ;)

  • @matfeyivandaev5024
    @matfeyivandaev50242 жыл бұрын

    Как всегда, огромное спаcибо за вводный курс по тестированию JavaScript (JS) с использованием технологий Jest, React Testing Library! Отдельная благодарность за скриншотные тесты!

  • @helenit4365
    @helenit43652 жыл бұрын

    Вот это ДА! Спасибо, Тима! Смотрим!💥

  • @kostyakykyshkin7974
    @kostyakykyshkin79742 жыл бұрын

    Огромное спасибо! Только собирался тестировать проект, и тут бац, вся нужная инфа в одном в видео)

  • @user-tx9cz5jn1j
    @user-tx9cz5jn1j2 жыл бұрын

    Тесты - тема, до которой так и не доходят руки. Думаю что вот именной сейчас настает время изучить эту тему с помощью видео замечательного от замечательного автора)

  • @ne4to777

    @ne4to777

    Жыл бұрын

    Ничего, начнешь программировать, сразу тесты заставят писать)

  • @jestemzbiaorusi8379

    @jestemzbiaorusi8379

    Жыл бұрын

    @@ne4to777 ой не факт, часто встречаются репы без тестов, особенно фронтовые

  • @user-md7px6he6c

    @user-md7px6he6c

    11 ай бұрын

    @@ne4to777 Никто не заставит, я бы сказал начнешь прОграммировать - потеряешься в бесконечных митингах через 10 лет, где и по прОграммировать тебе не дадут, это реальнее )

  • @user-do8kg9fj1u

    @user-do8kg9fj1u

    4 ай бұрын

    я пришел к тестам так: нагрузка не равномерная на проекте и пока нет задач что бы от меня все отстали, я сказал я пишу тесты)

  • @sidless3862
    @sidless38622 жыл бұрын

    Ulbi, ты как будто мои мысли прочитал! В настоящее время начал изучать тему тестов, и даже планирую их писать в своем приложении. И тут твое видео, после которого я точно уверен, что буду разбираться в теме. Ты просто подарок судьбы для начинающих!

  • @user-zk3bc1lf8k
    @user-zk3bc1lf8k2 жыл бұрын

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

  • @KolomeetsAV
    @KolomeetsAV3 ай бұрын

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

  • @user-tl4xv1sy3y
    @user-tl4xv1sy3y2 жыл бұрын

    Ulbi лучший, не даром твои уроки на первых местах находятся по определённым темам, спасибо что освещаешь темы довольно полно и доступно, продолжай в том же духе!

  • @PC-mv5jj
    @PC-mv5jj Жыл бұрын

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

  • @user-qx6gp9ci5d
    @user-qx6gp9ci5d2 жыл бұрын

    Отлично, как раз нужен был курс по тестам, вечером посмотрю обязательно)

  • @onufrienko.a476
    @onufrienko.a4762 жыл бұрын

    Боже, храните Ulbi за такой классный контент!!!

  • @demetrx7972
    @demetrx7972 Жыл бұрын

    Коммент в поддержку автора. Очень нравится твоя подача, точность, балансирование между необходимым уровнем теории и практикой. Желаю всего лучшего 🔥

  • @whoisyourdaddybaby
    @whoisyourdaddybaby2 жыл бұрын

    Тимур! Хочу поблагодарить вас за топовый контент! Очень полезная информация сосредоточена в одном видео, да собственно как и в каждом вашем видео и без воды. Желаю вам успехов во всех начинаниях! JavaScript, JEST, e2e, React Testing Library.

  • @ipa_stor
    @ipa_stor2 жыл бұрын

    вот это неожиданно! надо будет крайне внимательно смотреть!👀 спасибо огромное

  • @adelinaromanova8353
    @adelinaromanova83532 жыл бұрын

    То что нужно !!!! Как раз изучаем это!!! Спасибо, помог!

  • @daddy7847
    @daddy78472 жыл бұрын

    Только задался вопросом и начал искать про это инфу, это видео просто подарок!

  • @mzx6531
    @mzx65312 жыл бұрын

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

  • @meowmyacivh
    @meowmyacivh2 жыл бұрын

    Тимур, спасибо за проделанную работу и качественную подачу материала!

  • @MrVolkodaff
    @MrVolkodaff2 жыл бұрын

    Вот это просто замечательно, в одном месте, все тезисно, без соплей. Как обычно в принципе у этого человека =) Вообще, чел, большой респект тебе, ты реально помогаешь учиться.

  • @igorovdienko58
    @igorovdienko582 жыл бұрын

    Агонь!🔥🔥🔥 Спасибо за полезную информацию!

  • @yuryitikhonoff9631
    @yuryitikhonoff96312 жыл бұрын

    Да это просто огонь! Респект за системную инфу. Эй, Ютуб. Давай в топ советам всем кодерам!

  • @Vladislav0Art
    @Vladislav0Art2 жыл бұрын

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

  • @egolege
    @egolege2 жыл бұрын

    Огромная благодарность! Отличный материал!

  • @brucewayne_007
    @brucewayne_0072 жыл бұрын

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

  • @demiurgen13
    @demiurgen132 жыл бұрын

    Лайк не глядя! Спасибо. Уверен, это будет самая полезная выжимка по юнит-тестированию, е2е тестам, jest и react testing library

  • @romuelson
    @romuelson2 жыл бұрын

    Мощь, сила, ярость! Невероятно качественное видео, лучший жи есть!

  • @user-tr8xi3ik3c
    @user-tr8xi3ik3c2 жыл бұрын

    Важная тема. Большое спасибо за материал!

  • @graves3799
    @graves37992 жыл бұрын

    Конкретно сегодня решил закрыть все пробелы по этой теме. И тут на. Ну спасибо, бро 👍

  • @serdargurbanmyradow287
    @serdargurbanmyradow2872 жыл бұрын

    Спасибо тебе большое! Очень долго ждал этого урока)

  • @Es_nova
    @Es_nova2 жыл бұрын

    Мужик, как же ты вовремя, на работе как раз решили покрывать тестами проект и тут твое видео

  • @Good_nick_name

    @Good_nick_name

    2 жыл бұрын

    так иди на завод, стой да гайти чисти, и все окей) чем на заводе то плохо?

  • @user-lg4yc9xi9h

    @user-lg4yc9xi9h

    2 жыл бұрын

    @@Good_nick_name иди сам толчки драй, я программист, я буду говнокодить, меня все устраивает

  • @user-sj4oy1el5y
    @user-sj4oy1el5y2 жыл бұрын

    Этот парень был из тех кто просто делал годноту ууууу...

  • @alik64
    @alik642 жыл бұрын

    Поехали !!! 🚀🚀🚀 Jest, React Testing Library, e2e, screenshot

  • @user-yk6iq5hn4d
    @user-yk6iq5hn4d2 жыл бұрын

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

  • @user-en4cj3dn9p
    @user-en4cj3dn9p2 жыл бұрын

    Как во время! Большое спасибо! Написал комент, потом пошел смотреть)))

  • @met1388
    @met13882 жыл бұрын

    Круто!!! Ждал этот материал

  • @dmytromykhailenko3497
    @dmytromykhailenko34972 жыл бұрын

    Это однозначно зачет! Спасибо!

  • @nikpan3421
    @nikpan34212 жыл бұрын

    Годнота - подъехала😃 Огромное спасибо за Ваш бесценный труд!!

  • @olehmudriy9308
    @olehmudriy93082 жыл бұрын

    Заочно жирный лайк! План на вечер! Спасибо!

  • @philipryazankin1073
    @philipryazankin10732 жыл бұрын

    Спасибо. Ролик как всегда супер. Материал, подача, скорость!

  • @xqz666
    @xqz6662 жыл бұрын

    Ты и Михаил непомнящий лучшие

  • @andrewsam224

    @andrewsam224

    5 ай бұрын

    Согласен!!!!!

  • @user-nl9dk4tg8e
    @user-nl9dk4tg8e2 жыл бұрын

    Недавно искал ролик на канале по тестированию. И вот он.

  • @mclotos
    @mclotos2 жыл бұрын

    мы ждали и дождались! наконец-то! =)))

  • @jimmycaldwell2012
    @jimmycaldwell20122 жыл бұрын

    Это офигенно! Спасибо за проделанную работу

  • @bohdanartiukhov3572
    @bohdanartiukhov35722 жыл бұрын

    Ulbi спасибо тебе большое, твои видео это просто нечто, очень тебе благодарен, наконец-то что то годное появилось про тесты

  • @user-fh2ds7yw7x
    @user-fh2ds7yw7x2 жыл бұрын

    Браво, как всегда контент наилучшего качества)

  • @tevi6667
    @tevi66672 жыл бұрын

    ты четкий, рад что нашел твой ютуб канал.

  • @88noname88
    @88noname882 жыл бұрын

    Красавчик! Спасибо за курс!

  • @user-ov8xk7cn9e
    @user-ov8xk7cn9e22 күн бұрын

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

  • @alexbigar9769
    @alexbigar97692 жыл бұрын

    Круть! Спасибо за годный контент!!! 🚀🚀🚀

  • @user-ej5up4bk8o
    @user-ej5up4bk8o2 жыл бұрын

    Спасибо огромное за труд. Более подробного разбора я действительно нигде не видел.

  • @sergeysamius1128
    @sergeysamius11282 жыл бұрын

    Спасибо за полезный контент! Тестирование js, react, unit, jest, react testing library, e2e js

  • @karinabertosh5698
    @karinabertosh56982 жыл бұрын

    как обычно все очень круто, понятно, без воды, спасибо!

  • @adam-front
    @adam-front2 жыл бұрын

    Лайк поставил, ночью посмотрю

  • @barbatage5078
    @barbatage50782 жыл бұрын

    Ух! 2 часаааа 🙏🏻 спасибо!

  • @serkh139
    @serkh1392 ай бұрын

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

  • @user-ku3bx8we1c
    @user-ku3bx8we1c2 жыл бұрын

    Спасибо! Великолепный материал, с очень серьезной проработкой. Поставил лайк 👍

  • @g0ld3nsecr3t6
    @g0ld3nsecr3t62 жыл бұрын

    Спасибо за огромный вклад в этот мир :)

  • @AZErste
    @AZErste2 жыл бұрын

    Господи, автор просто читает мысли, в кои то веки нехотя решил наконец тестами заняться, а тут контент) лол с тайпскриптом и редаксом так же было)

  • @xenia6638
    @xenia66382 жыл бұрын

    Очень своевременно. Как раз разбираюсь с этой темой

  • @tinalee8686
    @tinalee86862 жыл бұрын

    Спасибо! Посмотрела до конца. Пойду изучать подробно каждую из них

  • @GyrWorker
    @GyrWorker2 жыл бұрын

    По описанию видео, то что мне надо )

  • @arturhimself
    @arturhimself2 жыл бұрын

    Спасибо, родной дорогой, только вот собрался инфу собирать

  • @PetyL
    @PetyL2 жыл бұрын

    Классный ролик. Уйма нужной информации. Спасибо!

  • @vp9878
    @vp98782 жыл бұрын

    Спасибо! Лучший как всегда

  • @alexeyilin1527
    @alexeyilin15272 жыл бұрын

    Очень вовремя, спасибо)

  • @user-sd9je7ov8o
    @user-sd9je7ov8o Жыл бұрын

    Всё в одном видео. Понятно, сжато и без воды.

  • @aboronilov
    @aboronilov2 жыл бұрын

    О да. Как же я долго этого ждал!!!

  • @Science790
    @Science7909 ай бұрын

    Тимур, ты топ! Спасибо за курсы и старания. Разжевываешь все за нас)

  • @kolyabokov88
    @kolyabokov882 жыл бұрын

    НУ, вот опять же в тему) я сейчас на новой работе как раз сижу за докой Cypress, впервые столкнулся с тестированием) спасибо бро, обязательно к просмотру!

  • @DeIgado95

    @DeIgado95

    2 жыл бұрын

    какие люди)

  • @kolyabokov88

    @kolyabokov88

    2 жыл бұрын

    @@DeIgado95 😘🙏

  • @parnasmi
    @parnasmi2 жыл бұрын

    Спасибо за столько полезный контент. Один из лучших уроков по тестирование!

  • @vadimpyatakov7021
    @vadimpyatakov70212 жыл бұрын

    лайк глядя на половину

  • @sergsergey4251
    @sergsergey42512 жыл бұрын

    Огонь, топ контент - в топ поиска)))

  • @mykolavarvarchuk937
    @mykolavarvarchuk9372 жыл бұрын

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

  • @falsetrue7910
    @falsetrue79102 жыл бұрын

    Посмотрел 30 минут и уже вижу, что годнота, досмотрю и дам полный фидбэк, спасибо! Тестирование js, react, unit, jest, react testing library, e2e js

  • @user-uq5tf7id7y

    @user-uq5tf7id7y

    2 жыл бұрын

    после 30 той минуты уровень с вертолетиком

  • @itmodern2386

    @itmodern2386

    2 жыл бұрын

    А этот чел всё ещё досматривает похоже)

  • @yagamithink8663
    @yagamithink8663 Жыл бұрын

    Хотелось бы увидеть такой же фундаментальный курс по регрессионному тестированию, так как анализ безопасности, нагрузки на приложение - это очень интересные темы. За этот ролик большое спасибо. Успехов тебе по жизни!

  • @ylsv
    @ylsv Жыл бұрын

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

  • @evshushkov
    @evshushkov2 жыл бұрын

    Спасибо большое, как раз на работе надо начинать писать тесты)

  • @user-vk5cu5vb3o
    @user-vk5cu5vb3o2 жыл бұрын

    Лайк авансом. Потом обязательно посмотрю

  • @user-tm7ct2zn9p
    @user-tm7ct2zn9p2 жыл бұрын

    как всегда понятно и доходчиво, спасибо)

  • @user-eq2to1gc4k
    @user-eq2to1gc4k2 жыл бұрын

    Народ, всем ( Тимурке отдельный ), как же ты круто угадал тему для видоса, как вариант для будущих видео - Recoil (думаю скоро будет актуально)

  • @itpro952
    @itpro9522 жыл бұрын

    Очередной альманах, но в этот раз уже по тестированию, кто согласен что формат фундаментальных курсов от а до я топ ставьте лайк

  • @nikel5345
    @nikel53452 жыл бұрын

    Канал очень хороший! Никак не доходят руки до тестирования, это хороший повод! Пожелание! было бы здорово в таком же формате разобрать ci/cd Спасибо огромное за ваши труды !!!

  • @rostyslav5334
    @rostyslav53342 жыл бұрын

    То что надо, спасибо большое!

Келесі