92 - тестируем компоненты, тесты, react-test-renderer - React JS

  Рет қаралды 40,461

IT-KAMASUTRA

IT-KAMASUTRA

Күн бұрын

it-incubator.i... - человекоориентированное, честное и профессиональное обучение front-end и back-end разработке гарантированно до трудоустройства за фиксированную стоимость.
Поддержать меня можно на patreon / itkamasutra или оформив спонсорство на данном канале.
Помогайте друг другу вот здесь: t.me/reactjs_s...
API: social-network...
Тема тестирования - мутная и сложная. Но безумно интересная и полезная))
Мы научились с вами в этом выпуске тестировать бизнес логику, а именно наши reducer-ы:
• 89 - Тесты, jest, tdd,...
В данном выпуске мы научимся тестировать компоненты:
будем их "фейково" отрисовывать, "фейково" взаимодействовать с ними и проверять, что там с нашей компонентой произошло.
Тема сложная. Материала много... Мы будем постепенно осваивать это искусство - искусство tdd (test driving development)
Для теста компонент будем подключать библиотеку react-test-renderer
Обратите внимание: устанавливайте версию, такую же, какая у вас версия react-а
Летим, самураи!!!
Уроки по React JS: • Курс "React JS - путь ...
Сайты:
it-kamasutra.com
it-incubator.eu
samuraijs.com
Мы в соц. сетях:
itkamas...
/ itkamasutra
telegram.me/it...
Мои личные VK и Insta:
d.kuzyu...
/ it.kamasutra.dimych
#tdd #reactJS #тестирование #практика #пример #уроки #курс

Пікірлер: 362
@MikhailKuklenkov
@MikhailKuklenkov 5 ай бұрын
Я человек простой. Смотрю урок от Димы - ставлю жирнющий лайк. Благодарю за мега труд, Дима! #tdd #reactJS #тестирование #практика #пример #уроки #курс
@yuliiashpak9719
@yuliiashpak9719 5 жыл бұрын
Чем больше узнаю, тем больше понимаю, как мало я знаю) Спасибо за уроки React Redux . Уже даже спится плохо, если знаю, что там на канале новый урок а я его не посмотрела, в сети так мало людей, которым не влом рзажевать другим то, что они поняли, и еще меньше тех, кто умеет это делать качественно, а ты большой молодец!
@ITKAMASUTRA
@ITKAMASUTRA 5 жыл бұрын
Спасибо и пожалуйста))) И спи спокойно, ибо важно не сойти с ума)) а сфера незнания будет всё увеличиваться и увеличиваться)))
@EduardCloneTobilkoClone
@EduardCloneTobilkoClone Жыл бұрын
@@ITKAMASUTRA и для этого к нам пришел chatgpt, который + - справляется с unit тестами) Но за урок спасибо, очень полезно понимать их роботу!
@pashabezk
@pashabezk Жыл бұрын
2022. Сложно смотреть. Какие-то кусочки уже неактуальны. К Димычу никаких вопросов, все супер! Но вот желание изучать тестирование отваливается. Хотя и надо! Обязательно ещё вернусь к этой теме
@genapolyakov
@genapolyakov Жыл бұрын
и в новом обновлении нужно писать тест в App.test.js: import { createRoot } from 'react-dom/client'; test('renders without crashing', () => { const container = document.createElement('div'); const root = createRoot(container); root.render(); root.unmount(); }); ReactDom импортировать не нужно! По другим позициям тоже много изменилось. Разбираюсь пока
@genapolyakov
@genapolyakov Жыл бұрын
Сейчас много поменялось в 2022. изменился синтаксис и теперь вылетает ошибка с render, нужно использовать вместо этого createRoot и в новом обновлении нужно писать тест в App.test.js: import { createRoot } from 'react-dom/client'; test('renders without crashing', () => { const container = document.createElement('div'); const root = createRoot(container); root.render(); root.unmount(); }); ReactDom импортировать не нужно!
@Karifax
@Karifax Жыл бұрын
Спасибо, работает
@ivanrussui4126
@ivanrussui4126 Жыл бұрын
React 18 версия?
@VladislavWebDev
@VladislavWebDev 3 күн бұрын
Новичкам стоит помнить ещё, что что сейчас snapshot тестинг является почти deprecated в реакт. react-test-renderer больше нельзя использовать совместно с реакт. Есть теперь другая библиотека. Таким действием реакт нарушил сам принцип пирамиды тестов.
@ltmte
@ltmte 3 жыл бұрын
Есть такое ощущение, что для тестов нужно тоже писать тесты
@ИсхакИшмахаметов-ы7и
@ИсхакИшмахаметов-ы7и 3 жыл бұрын
ахахаха
@segasigma
@segasigma 2 жыл бұрын
🤣
@EmilGasanov-v7q
@EmilGasanov-v7q 3 ай бұрын
так и делают
@vladyslavkravchenko5955
@vladyslavkravchenko5955 Жыл бұрын
49:57 уровень профессионализма - рассказывать тему и в попыхах искать зарядку для ноута😂 лучший🙌
@shhhamsy2304
@shhhamsy2304 Жыл бұрын
в новой версии текперь по другому, я написал тест вот так: import SamuraiJSApp from "./App"; import {createRoot} from "react-dom/client"; it('renders without crashing', () => { const div = document.createElement('div'); const root = createRoot(div); root.render(); root.unmount(); });
@is_eliseeva
@is_eliseeva Жыл бұрын
спасибо!
@n0escape
@n0escape Жыл бұрын
август 2023 - код Димыча работает без ошибок
@ЯрославаКондратенко
@ЯрославаКондратенко 6 ай бұрын
Спасибо, апрель 2024 - помогло
@razlond159
@razlond159 4 жыл бұрын
Ой, когда ставишь видео на паузу и дебажишь сам, находишь решение и только потом смотришь что дальше. Оййй какое же приятное чувство
@n0escape
@n0escape Жыл бұрын
Главная идея урока - научится основным принципам тестирования. Основной принцип программного тестирования - программно имитировать пользовательское взаимодействие - ожидая некоторый результат. Первая часть урока, касается теста App компоненты jestом, на то, рисуется она без проблем или нет. Однако тест ломается если не передать нужные вещи для отрисовки самой компоненты. Поэтому мы вынесли оборачивание BrowserRouter в отдельную комопоненту, которую и будем тестривать. Принцип теста. Создаем выдуманный div и рендерим его в VirtualDOM передавая нужную компоненту AppWithBrowserRouter, а после демонтируем ее из div: test('renders App component', () => { const div = document.createElement('div') ReactDOM.render(, div); ReactDOM.unmountComponentAtNode(div); }) Итак. Далее рассматриваем библиотеку react-test-renderer для теста компонент. Устанавливаем библиотеку как на видео. Проверяем версию react и устанавливаем коммандой: npm i --save-dev react-test-renderer@версия реакта После приступаем к тестам (тестируем ProfileStatus в отдельном файле). Новая инфа. Есть возможность группировать тесты. Для этого пишем следующий синтаксис describe('название группы тестов', () => { test('sназвание теста', () => { //тест }) }) Для классовых компонент и их внутренностей использвуют const instance = component.getInstance(); Из дальнейших тестов, важно. getInstance() нельзя использовать при тесте функциональных компонент (не классовых). Для функциональных комопонент и их внутренностей используют const root = component.root; Изза этого первый тест претерпел изменений. Т.к компонента ProfileStatus уже функциональная. test('status form props should be in state', () => { const component = create(); const root = component.root; const span = root.findByType("span"); expect(span.children[0]).toBe("status text") }) Чтобы не засорят коммент опишу тесты которые описывают некоторые кейсы: 1) Обработка ожидания ошибки. Тоесть предполагаем что на выходе будет ошибка. Для этого в expect передаем функцию в которой ожидается ошибочный параметр и после пишем .toThrow(): test('after render input shouldn`t be shown', () => { const component = create(); const root = component.root; //ожидание комопненты expect(()=>{ const span = root.findByType("input"); }).toThrow() }); 2) ожидание значение с логическим нет. После ecpect() пишем .not test('after render span shold be shown v2', () => { const component = create(); const root = component.root; const span = root.findByType("span"); expect(span).not.toBeNull() }); 3) Имитация действия с элементом. Важно, перед использованием убедиться в передаваемом действии на элемент, чтобы получить его из props Вобщем чтобы имитировать действие (допустим дабл клик), нужно вызвать функцию действия, пришедшую из props span.props.doubleClick() Тест дейстия по клику выглядит так: test('after doubleClick on span shold be changed to input whith correct statust', () => { const component = create(); const root = component.root; let span = root.findByType("span"); span.props.onDoubleClick(); let input = root.findByType("input"); expect(input.props.value).toBe("status text") }) }) 4) Отслеживание колличества вызвовов функции. В тесте можно создать выдуманный колбек, колличество вызовов которого, можно отследить. Создание функции: const mockCallBack = jest.fn( (передаваемые значения) => {тело функии} ) Отслеживание: expect(mockCallBack.mock.calls.length).toBe(1) Пример теста: test('callback should be called', () => { const mockCallBack = jest.fn( () => { } ) const component = create(); const instance = component.getInstance(); root.deactivateEditMode(); expect(mockCallBack.mock.calls.length).toBe(1) }) Важно! В примере указан способ для теста функции в классовой компоненте. Однако в функциональной, такой способ не сработает. На текущий момент (август 2023), не нашел способа тестирования фуинкий в функциональных комнонентах. Если найдете решение, прошу отписать в ответ
@ВикторКлименко-щ9ф
@ВикторКлименко-щ9ф 4 жыл бұрын
Спасибо большое!!! Я был недопрограммист, теперь я ещё и недотестировщик))) Но нисего, бомбим по кругу заново, чтобы стать истинными самураями!!
@Аннанежная-м8я
@Аннанежная-м8я 2 жыл бұрын
Я уже переделала ProfileStatus в функциональный компонент, get instance можно получить только у классового компонента судя по документации. Немного зашла в тупик, но придумала как написать тест для фунционального компонета. Этот тест проверяет совпадает ли текст в спане со статусом из пропсов. describe('Profile status component', () => { test('Status from props should be in state', () => { const testStatusStr = 'Test status'; const component = TestRenderer.create(); let statusInSpan = component.toJSON().children[0].children[1] expect(statusInSpan).toBe(testStatusStr) }) }) Не знаю делают так или нет, но тест прошел))
@ДенисВладимирович-ы2ъ
@ДенисВладимирович-ы2ъ 3 жыл бұрын
2021 г. react 17.0.1 - Базовый тест App отличается от теста версии Димыча, пришлось повозиться, что бы сделать его зелёным. ) Тест по умолчанию, ищет в отрисованном дереве ссылку learn react , которой там давно уже нет. Нужно дать для поиска то, что есть в вашем дереве на самом верху, - присвоить атрибут role к div, который рисуется в верху(какие div видны тесту, будет видно в ошибке к тесту), а затем найти его через div = screen.getByRole(/main/i) - тест зелёный Летим дальше!!! P.S мысли переписать тест на тест, как у Димыча в ролике, проскакивали)
@dechto1
@dechto1 2 жыл бұрын
я так понимаю нужный нам div это первый див в render внутри App, с ним эти махинации делать?
@dechto1
@dechto1 2 жыл бұрын
Крутил по всякому, никак не получилось повторить что бы работало. Сделал то что у Димыча.
@ПолинаПолинина-ш8и
@ПолинаПолинина-ш8и 2 жыл бұрын
Спасибо. Покрутила и все вышло. В терминале указывает доступное место для вставки role.
@marynakosiv3750
@marynakosiv3750 4 жыл бұрын
оч полезно!! мне кажется именно такие видео полезны джунам!как ориентироваться когда не все очевидно!
@crumblemusic
@crumblemusic 2 жыл бұрын
У кого красным подчеркивается root.findByType() вы можете тесты сделать асинхронными, например так: test('test', async () => { ... let span = await root.findByType("span"); ... })
@darjat.1069
@darjat.1069 4 жыл бұрын
Пока делала тесты и пыталась понять, почему они не работают, внезапно поняла, что с тестами всё отлично. С тестами всё отлично, а вот в коде всё это время была нелепая ошибка, которую я даже не замечала.) Тесты огонь. Просто необходимая штука.
@lvasmart3516
@lvasmart3516 3 жыл бұрын
А ума не хватило, здесь описать свою ошибку ?!
@dididie158
@dididie158 Жыл бұрын
@@lvasmart3516 невежа
@tema_skakun
@tema_skakun Жыл бұрын
спасибо за выпуск, Димыч) летим дальше, полёт нормальный)) #tdd #reactJS #тестирование #практика #пример #уроки #курс
@АртемийЛукин-г4ы
@АртемийЛукин-г4ы 11 ай бұрын
Летим !
@olexandrkozirskiy6917
@olexandrkozirskiy6917 Жыл бұрын
тестируем компоненты, тесты, react-test-renderer - React JS 21.08.2023
@НиколайТесля-ш4е
@НиколайТесля-ш4е Жыл бұрын
Димыч красава! Мы красавы кто дошел сюда! Истинные самураи! Пришел из php и бэка на Laravel! Думал что реакт сложный и запутанный но Димыч разжевал все как надо!
@bugaga8144
@bugaga8144 2 жыл бұрын
Просто просмотрел выпуск и понял, что на моем уровне пока это будет слишком, просто ознакомился что это и для чего. А так сложилось мнение что теме тестов, настолько обширная, что действительно можно снять отдельно 100 выпусков по им. Летим дальше осталось 8 выпусков и пора на собесы
@webbomj
@webbomj 2 жыл бұрын
Взяли куда нибудь?
@bugaga8144
@bugaga8144 2 жыл бұрын
@@webbomj Да в Апреле 2022 года устроился
@webbomj
@webbomj 2 жыл бұрын
@@bugaga8144 Поздравляю!
@АндрейФилимончик-ю9у
@АндрейФилимончик-ю9у 3 жыл бұрын
Большое спасибо за курс! Димыч, ты лучший!)) тестируем компоненты, тесты, react-test-renderer
@marsonleonardovich4036
@marsonleonardovich4036 5 жыл бұрын
Спасибо, очень полезный был урок! LIKE!
@amaxe12345
@amaxe12345 4 жыл бұрын
Спасибо! тестриуем компоненты, react-test-renderer - React JS #tdd #reactJS #тестирование
@ДенисВладимирович-ы2ъ
@ДенисВладимирович-ы2ъ 3 жыл бұрын
Для каждого вида теста, сделал комментарий к каждой строчке, в файле с тестом, прямо в коде, шпаргалка. Летим!!!
@bosfaction
@bosfaction 2 жыл бұрын
Благодарю, Димыч!!! тестируем компоненты, react-test-renderer #React #JS #tdd #reactJS #тестирование
@СтепанПалий-д9ж
@СтепанПалий-д9ж 4 жыл бұрын
18:06 "скопирую этот код". поржал, спасибо )))
@STRIPPEDSTAR
@STRIPPEDSTAR 3 жыл бұрын
Ребят для тех кому интересно как тестят нынче kzbin.info/www/bejne/kJ65c3ammsuEm5o наиболее адекватное видео которое показывает современный синтаксис для тестов, если нашли более понятное - не зажмите ссылку..
@ruslanaliev2933
@ruslanaliev2933 3 жыл бұрын
Годно!
@Yukrop
@Yukrop 3 жыл бұрын
Очень годно спс
@annamalikova6225
@annamalikova6225 2 жыл бұрын
"Ой, я случайно плюнул в монитор" - Димыч.... ахахахаххаах
@MilkeeyCat
@MilkeeyCat 4 жыл бұрын
как же хорошо что я переделал на функциональный компонент
@maxim955
@maxim955 3 жыл бұрын
Спасибо большое за твои видео. Я безмерно благодарен. Ровно после этого видео получил оффер
@dimitriitkach7697
@dimitriitkach7697 3 жыл бұрын
spasibo za urok - 92 - тестриуем компоненты, react-test-renderer - React JS
@georgepustovit8728
@georgepustovit8728 4 жыл бұрын
Димыч, лайфах как жать меньше кнопок: чтобы открыть ссылку в новой вкладке нажми на нее колесиком мыши (эквивалентно трем пальцам на тачпаде) Уроки супер, спасибо)
@АлексГ-п3ж
@АлексГ-п3ж 4 жыл бұрын
Круто! P.S. Список ключевых слов: React, Redux, лучшие супер курсы, бесплатно, tdd, test, тест, react-test-renderer
@yuliiashpak9719
@yuliiashpak9719 5 жыл бұрын
сегодня тоже, только утром сидела тупила минуту вспоминала как length пишется))
@YuryKaliankou
@YuryKaliankou 4 жыл бұрын
Жизненно
@marina-ej4qd9kc1wh
@marina-ej4qd9kc1wh 8 ай бұрын
Посмотрела спустя рукава, очень тема для меня мутная. Но потом вернусь, пересмотрю как следует. Спасибо! react-test-renderer
@mhersimonyan974
@mhersimonyan974 5 жыл бұрын
test of components, тестируем компоненты, react-test-renderer , React, JS Погнали!
@НатальяПолянская-в4ь
@НатальяПолянская-в4ь 3 жыл бұрын
Раньше находила комментарий, поделюсь. Можно не проделывать все те процедуры которые Димыч проделывает в видео, можно в самом тесте обернуть роутерами, я не знаю насколько это правильно, (если не правильно отпишитесь пжл.) но у меня работает. вот пример кода. it('renders without crashing', () => { const div = document.createElement('div'); ReactDOM.render( , div); ReactDOM.unmountComponentAtNode(div); });
@АртемКулинский-ю4о
@АртемКулинский-ю4о 3 жыл бұрын
Сколько всего интересного! Дмитрий очень хороший преподаватель! Отличный курс по React - Redux! Какой же вы добрый и деятельный человек, Дмитрий! Настоящий самурай! IT-KAMASUTRA, вперед! Отличный урок по тестированию React - компонентов.
@shamilsalakhutdinov5519
@shamilsalakhutdinov5519 4 жыл бұрын
23:10 лол, вчера Маск, и правда, запустил ракету в космос 0о
@ЮрийМясников-н5щ
@ЮрийМясников-н5щ 4 жыл бұрын
И это была первая частная компания которая доставила космонавтов на МКС
@TheLevius
@TheLevius 4 жыл бұрын
@@ЮрийМясников-н5щ так все равно кредит государство дало
@owl_house2197
@owl_house2197 3 жыл бұрын
А Реакт постепенно сдает позиции mobx)
@Snegurjan
@Snegurjan 4 жыл бұрын
ох и намучался я с версиями react-test-renderer ,что бы заработало)))
@eliothome8056
@eliothome8056 5 жыл бұрын
Смотрю пока что 10-ый выпуск, многие моменты стали понятными. По документации не мог понять, спасибо тебе за контент!
@ritaravinsky8262
@ritaravinsky8262 2 жыл бұрын
Спасибо! тесты компонент, react-test-renderer.
@nickzimowsky609
@nickzimowsky609 2 жыл бұрын
лично мне это показалось самым мрачным за весь курс))
@alexandrcorbin
@alexandrcorbin 5 жыл бұрын
Дима, огромная просьба! Пожалуйста, сними ролик как удалять сообщения. Очень много времени потратил и не получилось ничего сделать. Всем будет очень полезно узнать, как сделать это грамотно. Спасибо!
@МихаилЗавражин-и7ь
@МихаилЗавражин-и7ь 5 жыл бұрын
Спасибо что продолжаешь выкладывать я сейчас активно учу js после начну Реакт продолжай выкладывать спасибо
@taras8068
@taras8068 4 жыл бұрын
Testing components, react test renderer, react addons test utils, jest. Спасибо за уроки!
@ctumyji9737
@ctumyji9737 4 жыл бұрын
Спасибо за урок! Было интересно и познавательно! Летим дальше! React JS от Димыча - бомба! :)
@oksanamishota6514
@oksanamishota6514 3 жыл бұрын
Спсаибо за тесты, react-test-renderer - React JS
@sharkman6434
@sharkman6434 3 жыл бұрын
стируем компоненты, тесты, react-test-renderer - React JS test jest react mock testing components спасибо бро !
@milter2539
@milter2539 4 жыл бұрын
Урок 92. Пишу свой белорусский социально-экологический проект. Комент как благодарность (:
@maksym_shkaf
@maksym_shkaf 3 жыл бұрын
тестируем компоненты, тесты, react-test-renderer - React JS Спасибо!)
@ПараСлов-н2и
@ПараСлов-н2и 3 жыл бұрын
tdd крутой вводный урок получился! Спасибо!
@ole_oli
@ole_oli 3 жыл бұрын
Спасибо Димычь. Понял как тестить. Видос огонь, как всегда. react-test-component.
@MiqayelPetrosyan
@MiqayelPetrosyan 4 жыл бұрын
у меня в App.test.js был такой код , и вызвало ошибки test('renders learn react link', () => { const { getByText } = render(); const linkElement = getByText(/learn react/i); expect(linkElement).toBeInTheDocument(); }); долго мучился, потом сделал как в видео заработало, видать версия react другая и там логика поменялось it('renders without crashing', () => { const div = document.createElement('div'); ReactDOM.render(, div); ReactDOM.unmountComponentAtNode(div); });
@nataliekholina6463
@nataliekholina6463 4 жыл бұрын
У тебя первый тест не работал, потому что он в искал ссылку с текстом 'learn react'.. Мы её удалили в самом начале. И так как не было этого текста, то он ничего и не находил -> ошибка
@Димкинкоп
@Димкинкоп 4 жыл бұрын
Как всегда круто, react-test-renderer - React JS. Летим дальше!!))))
@Aleks-lk1et
@Aleks-lk1et Жыл бұрын
Спасибо! 2022! Установил версию как сказал Димыч версия "react-test-renderer" должна быть как у React. У меня получилось такая: >npm i react-test-renderer@17.0.2 --save-dev. Все тесты как на видео прошли. Димон: "Я красавчик, ну и значит и вы красавчики. Смотрим, кто случайно закомментировал и отрываем тому руку, друзья!" Идем дальше.
@drilling_guitar
@drilling_guitar Жыл бұрын
Привет, у меня такая же версия реакта, но не пошло. Ругается на зависимость react-redux. Кстати у тебя какая версия react-redux сработала?
@ВладПономарёв-м1ъ
@ВладПономарёв-м1ъ Жыл бұрын
Димыч, спасибо. тестируем компоненты, тесты, react-test-renderer
@АзимАзимов-ч1й
@АзимАзимов-ч1й 5 жыл бұрын
Круто что продолжаешь выкладывать уроки. Я только на 37 но дойду до конца
@STRIPPEDSTAR
@STRIPPEDSTAR 3 жыл бұрын
Тесты это щикарно)
@vladimirww5152
@vladimirww5152 3 жыл бұрын
Полезная штука, эти тесты для JS и React и Redux!
@Kalebra013
@Kalebra013 4 жыл бұрын
Greate lesson! Test Driven Development))
@bitcoin-
@bitcoin- 5 жыл бұрын
Мне понравилась тема!Буду ее изучать глубже!
@ЮлияМарченко-э1ж
@ЮлияМарченко-э1ж 4 жыл бұрын
Спасибо за урок! Тестирование компонент, react-test-render, jest
@arayoflight
@arayoflight 4 жыл бұрын
react-test-renderer - React JS. В VSC тесты можно запустить в сценариях npm, нажав run на test. Правда, они все сразу запускаются, но занимает это секунды.
@denweb2408
@denweb2408 5 жыл бұрын
Классный урок по тестированию)!
@bitcoin-
@bitcoin- 5 жыл бұрын
тестриуем компоненты, react-test-renderer - React JS
@semial
@semial 4 жыл бұрын
Спасибо за урок! react-test-renderer reactjs react redux
@bitcoin-
@bitcoin- 5 жыл бұрын
Я просто с нетерпением жду продолжение курса))очень очень жду!
@mykhailostepanishchev6472
@mykhailostepanishchev6472 4 жыл бұрын
Спасибо классный выпуск ! react-test-renderer - React JS
@technical777
@technical777 4 жыл бұрын
Testing component in React: взрыв мозга, у меня тест не прошел, работаю в Visual Code, Visual дебажит внутри везде только не в тестовых файлах. В самом тесте пришлось компонент в create обернуть не видел store. Потом ошибка падала на getInstance, сейчас ошибка падает на expect :))) Вообщем все хорошо, как обычно что то не получается - летим дальше, тесты пока отложил, вернусь к ним в течении недели )
@vitaliyirtlach
@vitaliyirtlach 4 жыл бұрын
Если ты еще задаешься данным вопросом то оберни свою компоненту в BrowserRouter и Provider и не забудь сделать импорты!
@olegthesheriff
@olegthesheriff 3 жыл бұрын
Тесты, тесты, ох как не просты!
@ollegat
@ollegat 5 жыл бұрын
С компонентами вообще не понятно как и что тестировать, но Димыч как всегда поливает свет знаний!
@logizm9431
@logizm9431 Жыл бұрын
этот урок можно просто просмотреть ))
@genapolyakov
@genapolyakov Жыл бұрын
при установке react-test-renderer вылетают ошибки из-за forms поэтому нужно установить принудительно: для этого нужно дописать в конце опять --force и все установится
@hrachhambardzumyan3300
@hrachhambardzumyan3300 5 жыл бұрын
Привет ! ! ! . Большое спасибо за курс .
@annabolbot1228
@annabolbot1228 2 жыл бұрын
react-test-renderer - React JS курс супер
@ЛусінеАтаджанян
@ЛусінеАтаджанян 3 жыл бұрын
Дима,красавчик. mock, Jest, react-test-render, TDD. Честно говоря, не самая приятная тема, но что поделать. По-прежнему лучший курс по React JS и JavaScript
@travelOpens
@travelOpens 3 жыл бұрын
Была ошибочка у меня. При проверки записи в стейт, ничего не передавалось. Все что было с статусами падало. Спустя пол часа проб и ошибок, оказалось что у нас в стейте написано "!this.props.status". Если удалить восклицательный знак, все тесты стали успешными. #react #react-test-renderer #react-test Благодарю Димыч и с ДР !)
@sanbuz
@sanbuz 8 ай бұрын
Спасибо
@braivs
@braivs 2 жыл бұрын
React jest тесты проходятся и на typescript тоже, но приходится ставить @ts-ignore перед expect(instance.state.status) и instance.deactivateEditMode().
@MugivaraLuffy
@MugivaraLuffy 2 жыл бұрын
Без связи, вам не хватает скорее всего типизации для jest. @types/jest проинсталлируйте. Так же, вы должны передать тип инстанс, если вы хотите так ей пользоваться. Описать интерфейс типа. Но лучше посмотрите, как использовать jest более эффективно, через spyOn, в этом случае. А лучше всего возьмите отдельный курс по тестированию, это сразу вас о делит от всех других джуниоров на те же вакансии. @ts-ignore это никогда не выход. Ну практически. Тогда вообще не стоит писать с типами.
@braivs
@braivs 2 жыл бұрын
@@MugivaraLuffy спасибо)
@alexanonymous5823
@alexanonymous5823 3 жыл бұрын
как просто тестировать реакт с react-test-renderer. спасибо. лайк однозначно=))
@r_yunusov
@r_yunusov 5 жыл бұрын
Спасибо за качественный контент) Твои видео реально помогают в решении коммерческих задач для джунов) Кстати, ты слышал что-нибудь о "Стачке"?
@ITKAMASUTRA
@ITKAMASUTRA 5 жыл бұрын
Неа... буду гуглить!!
@r_yunusov
@r_yunusov 5 жыл бұрын
@@ITKAMASUTRA я думаю твое выступление помогло бы в развитии инкубатора)
@danybohd
@danybohd 4 жыл бұрын
Лайк за тести!
@ГеннадийГорохов-ц8н
@ГеннадийГорохов-ц8н 2 жыл бұрын
Сегодня 19.11.21г Очень понравился урок по тестированию реакта!
@marina.health
@marina.health 2 жыл бұрын
Не хватило примера теста функциональных компонент)
@aidosbatyrkulov3272
@aidosbatyrkulov3272 4 жыл бұрын
The brilliant course
@katjafed
@katjafed 2 жыл бұрын
В итоге сделала с помощью react-testing-library, который уже был установлен в приложении и тестировала не классовый компонент, а функциональный компонент с хуками)
@MooMonero
@MooMonero 5 жыл бұрын
Ура, тесты !
@yaroslavoz
@yaroslavoz 2 жыл бұрын
Димыч ты как всегда зе бест оф зе бест оф зе бест! Кросавчег! Твоя подача и объяснения - уникальны. Даже на англоютубе я такого не видел Ты крут! Я уже устроился, но на работе нужно внедрять тестирование, нигде нормального контента не нашел на эту тему пока, только здесь! !"На пальцах разжевал" )))
@ivanrussui4126
@ivanrussui4126 Жыл бұрын
Спасибо Дима, приходилось немного писать на работе авто-тесты на Python используя библиотеку Selenium, очень нравилось, жаль что с мобилизацией прикрыли курс. Так вот в целом похоже)
@ivanmiarkulau8320
@ivanmiarkulau8320 3 жыл бұрын
TDD - это тема) jest - удобный инструмент для тестирования)
@smolhs1586
@smolhs1586 Жыл бұрын
"а потом смотрим, кто это закомментировал, и отрываем ему руки" (с) 😆
@mrmicolka
@mrmicolka 4 жыл бұрын
дебажить тесты это что-то)
@andreysv7752
@andreysv7752 4 жыл бұрын
тесты это пушка!
@SergeSchekhovtsov
@SergeSchekhovtsov 2 жыл бұрын
Длинное видео, но полезное и интересное!
@MrSvent0vit
@MrSvent0vit 4 жыл бұрын
блин, чтобы увидеть полезные коменты, теперь надо рыться среди всех этих seoшных комментов! остановитесь епта
@tatianakruglaya6760
@tatianakruglaya6760 4 жыл бұрын
помогаем Димычу!!! А вы лайком подняли нужную инфу?
@indigosay8272
@indigosay8272 4 жыл бұрын
угу надо спасибо писать под 1 комментом автора, а остальные комменты должны по делу чисто
@olegzidane7099
@olegzidane7099 4 жыл бұрын
кстати, да))))
@АндрейВерхулин
@АндрейВерхулин 3 жыл бұрын
@@indigosay8272 ты думаешь эти комменты бесполезные великие умы современности пишут? Димыч же еще вначале курса сказал, "у меня могут обучаться домохозяйки". Вот кто эти люди
@Украинец-м3х
@Украинец-м3х 3 жыл бұрын
согласен, и у всех все идеально работает нихера не ломается...
@dw_tv3992
@dw_tv3992 3 жыл бұрын
2021г.... Илон по прежнему лишь мечтает.... Redux React по-прежнему актуальны😎
@ЭддиД
@ЭддиД 4 жыл бұрын
тестируем компоненты, react-test-render - React JS Спасибо за урок!!!
@saithirius
@saithirius 4 жыл бұрын
2020 год! Какой Реакт?! Илон Маск пару дней назад в космос ракету отправил с Людьми!
@МитяА-р5к
@МитяА-р5к 4 жыл бұрын
он тоже начинал с программирования 😉
@sergeystork4996
@sergeystork4996 2 жыл бұрын
Что делать в 2022 году? При использовании React testing library ступор.
73 - React JS - http put, local state
45:32
IT-KAMASUTRA
Рет қаралды 59 М.
Do you choose Inside Out 2 or The Amazing World of Gumball? 🤔
00:19
когда не обедаешь в школе // EVA mash
00:51
Will A Guitar Boat Hold My Weight?
00:20
MrBeast
Рет қаралды 275 МЛН
Основы и секреты Rest API
5:13
Хочу вАйти
Рет қаралды 4,8 М.
80 - React JS - инициализация приложения
41:35
60 - React JS - withRouter, props.match.params
30:24
IT-KAMASUTRA
Рет қаралды 79 М.
Металл будущего. Как производят титан
25:41
Анатомия Монстров
Рет қаралды 270 М.
78 - React JS - login и logout api
40:32
IT-KAMASUTRA
Рет қаралды 59 М.
97 - ReactJS - обновление профиля
1:23:22
IT-KAMASUTRA
Рет қаралды 55 М.
91 - chrome extensions для react и redux - React JS
23:55
IT-KAMASUTRA
Рет қаралды 32 М.