Size: a a a

React — русскоговорящее сообщество

2021 April 24

ЕИ

Евгений Ишимов... in React — русскоговорящее сообщество
источник

D

D M in React — русскоговорящее сообщество
Ну по мне тут есть несколько вариантов. 1) Ты протестировал компонент A, далее ты тестируешь компонент B, подменяя компонент A на какую нибудь заглушку. (Для этого в enzyme например есть shallow render) И тогда получается если упал тест в B, ты знаешь что виноват именно компонент B, а не какой то другой.
2) Второй подход не мокать компоненты и тестировать как есть (по сути интеграционные тесты получаются). Kent Dodds говорил в одной статье про shallow render: "Какая разница что твой юнит тест с замоканным компонентом проходит если модуль в целом не работает". И получается ты тестируешь сразу работоспособность целого модуля ничего не мокая, делая по большей части интеграционные тесты.

В твоем случае при применении первого подхода когда ты проверяешь полную работоспособность, логично что твой тест упадет если модуль который он использует сломанный (Интеграционный тест получается), значит твоя система не работает в целом.
Во втором случае ты мокаешь компонент и у тебя получается чистый юнит тест без каких то зависимостей. Ты проверил работоспособность конкретно модуля B. И если он у тебя ломается при небольшом рефакторинге когда общее поведение сохраняется, то это немного странно.
источник

И

Илья in React — русскоговорящее сообщество
Какой-то дичайший микс await и then, зачем?

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

И делать это можно в одной функции и репы (если тебе не нужны ещё где-то) не проставлять в стор.

И у тебя ставится loading, но нигде не снимается.
источник

SG

Sos Genrikovich in React — русскоговорящее сообщество
Изменение АПИ компонента А может сломать тесты компонента B, если тесты проверяют работоспособность B при моке А, который имитирует его правильную работу.

Например, у А есть коллбэк. У B есть коллбэк, который с  какими-то изменениями пробрасывается в А.
Есть тест, который проверяет правильно ли вызывается коллбэк, переданный в B, когда А вызывает коллбэк. Получается, изменив имя коллбэка в А, упадёт данный тест для B.

Это логично с одной стороны, т.к. это спасает от ситуации, когда интерфейс поменяли, а в каком-то компоненте использование поменять забыли. Но получается очень шаткая "конструкция".

По поводу интеграционных тестов согласен. Реализуем их для каждой фичи, но shared компоненты такими тестами не протестировать. И при падении интеграционного теста потом не так уж и легко найти причину его падения
источник

SG

Sos Genrikovich in React — русскоговорящее сообщество
По поводу Enzyme думал тоже, но у него с shallow render'ом и эффектами есть проблема
источник

ЕИ

Евгений Ишимов... in React — русскоговорящее сообщество
loading в редюсере отключается, так почему несколько функций не вызываються?
источник

ЕИ

Евгений Ишимов... in React — русскоговорящее сообщество
мне нужно просто вызвать функции последовательно и все
источник

D

D M in React — русскоговорящее сообщество
Если мы пишем unit тест компонента B, то он не должен проверять как там что то вызывается в A. Он предполагает что компонент A изначально рабочий, для этого мы его и мокаем.
источник

SG

Sos Genrikovich in React — русскоговорящее сообщество
Он должен проверять правильно ли всё вызывается в B, когда что-то вызывается в A
источник

D

D M in React — русскоговорящее сообщество
Это уже интеграционный тест. Ты проверяешь работу двух модулей. И логично если сломается один, то другой тоже упадет
источник

A

Alexey in React — русскоговорящее сообщество
Есть в сети вообще нормальный гайд по тестам для нубов?
источник

A

Alexey in React — русскоговорящее сообщество
Я единственным, чем пользуюсь в vs code так это Code Runner
источник

D

D M in React — русскоговорящее сообщество
А причем тут тесты и Code Runner )
источник

SG

Sos Genrikovich in React — русскоговорящее сообщество
it(
 'should call onAClick with current input value on A click',  
 () => {
   let onClick;
   mockedA.mockImplementation(props => (onClick = props.onClick))

   const onAClick = jest.fn()
   const defaultValue = {a: 1}
   render(<B onAClick={onAClick} defaultValue={defaultValue} />)

   onClick()

   expect(onAClick).toBeCalledWith(defaultValue)
 }
)
источник

SG

Sos Genrikovich in React — русскоговорящее сообщество
Разве такой тест считается интеграционным?
источник

A

Alexey in React — русскоговорящее сообщество
ну типа, передаю в функцию нужные мне значения и через console.log получаю выходные даннные
источник

a

az1.zz in React — русскоговорящее сообщество
здраствуйте ребята у меня такая проблема решаю freeCodeCamp проект QuoteMachine работа с API когда запрос отправлю данный придут но послу refresh page новый пояевится а я хочу при клике на кнопку вот тут мой код https://codesandbox.io/s/quote-machine-freecodecamp-tqt8y
источник

D

D M in React — русскоговорящее сообщество
Если честно, немного сложно понять что тут происходит
источник

SG

Sos Genrikovich in React — русскоговорящее сообщество
Компонент А замокан, мы получаем переданный в его пропсы коллбэк и вызываем его сами, чтобы проверить правильно ли отработает логика в компоненте B, которая должна произойти по этому коллбэку. В данном случае, B должен вызвать коллбэк onAClick с текущим значением внутреннего инпута. Но так же это мог бы быть какой-нибудь сайд эффект
источник

D

D M in React — русскоговорящее сообщество
Сейчас у тебя делается запрос только при загрузке страницы. А при клике на кнопку вызывается только функция на смену background. Вызывай по клику еще и функцию которая запрашивает цитату.
источник