Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Testes Unitários em React
Search
Jonathan Cruz Rocha Ferreira
June 07, 2019
Technology
0
58
Testes Unitários em React
Jonathan Cruz Rocha Ferreira
June 07, 2019
Tweet
Share
More Decks by Jonathan Cruz Rocha Ferreira
See All by Jonathan Cruz Rocha Ferreira
Automatizando Release
joohncruz
0
10
Design System com StencilJs - 17 de fev. de 2020
joohncruz
0
13
Introducao React Apps
joohncruz
0
10
Engatinhando_com_Redux_Saga.pdf
joohncruz
0
18
Arquitetura React Projeto Base
joohncruz
0
56
Apresentando o VueJs
joohncruz
0
12
Ecossistema de Testes com JavaScript
joohncruz
0
71
Testes Unitários em App React
joohncruz
0
16
Other Decks in Technology
See All in Technology
PacketProxyで探るGemini CLIのコンテキストエンジニアリング 〜AIエージェントを信頼できる相棒に〜
kakira9618
0
460
LINEヤフーのQA組織について
lycorptech_jp
PRO
0
310
意外と難しいGraphQLのスカラー型
uhyo
4
220
経営の意思決定を加速する 「事業KPIダッシュボード」構築の全貌
recruitengineers
PRO
3
140
How AI agents are changing the way we should build APIs
fabpot
1
330
そのJavaScript、V8が泣いてます。V8の気持ちを理解して書くパフォーマンス最適化
riyaamemiya
15
5.7k
カスタムUIを作る覚悟 / The determination to create a custom UI
matsuji
2
1.4k
メディアカンパニー LINE NEWS QA採用
lycorptech_jp
PRO
0
180
AlarmKitで実現する 新時代のシステム通知
tsuzuki817
0
390
LINEギフト/ショッピングタブ
lycorptech_jp
PRO
0
150
Windows 11 version 25H2 への準備はできていますか?
tamaiyutaro
1
120
Create Ruby native extension gem with Go
sue445
0
240
Featured
See All Featured
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.1k
Building Adaptive Systems
keathley
43
2.8k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Docker and Python
trallard
46
3.6k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Code Review Best Practice
trishagee
71
19k
A better future with KSS
kneath
239
17k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.5k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
KATA
mclloyd
32
14k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Transcript
Testes Unitários em React Jonathan Cruz (Shun) Github/Twitter joohncruz
“Por que não devemos testar nossa aplicação?”
CONCEITOS
Testes Automatizados
Testes Unitários
React • Biblioteca para criar interfaces • Componentes • Virtual-DOM
• JSX FACEBOOK
Componentes Presentational e Container Stateless e Stateful
Ferramentas? JEST MOXIOS SINON JASMINE ENZYME CHAI MOCHA QUNIT KARMA
JEST? • Zero configurações • Completo para testar soluções JavaScript.
• Feedback instantâneo • Reporte de Cobertura • Mocks • Snapshots FACEBOOK
None
ESCOPO
CICLOS
COVERAGE
COVERAGE Setup
EXPECT .toBeNull() .toBeTruthy() .toBeUndefined() .toContain(item) .toEqual(value) .toHaveLength(int)
ENZYME? AIRBNB É uma lib de teste em JS para
React que tornar mais fácil lidar com asserts, manipulações e output de componentes.
API Reference first() render() mount() equals() find() instance() setState() simulate()
text() html()
Montando componente React com o Enzyme
Shallow • Não renderiza o Children • Isolado
Render • Sem lifecycles • Render children • Less APIs
(setState, debug...)
Mount • Lifecycle methods (componentDidMount) • Render children
Como consigo testar métodos dentro de um Componente?!
.instance() • Obtém a instância do componente sendo renderizado; •
Retorna null em componentes stateless;
SNAPSHOT Jest + Enzyme E uma maneira de armazenar o
resultado do seu componente em pleno texto.
SNAPSHOT Mas não era para conseguir ver a diferença na
marcação do componente na hora da modificação?
SNAPSHOT Agora sim… enzyme-to-json
Como testar componentes que encapsulados? Redux Com dependência por componentização
Componente com Redux :(
Componente com Redux :) Unitário!
Mas o que deve ser testado? Meus componentes são simples...
Não devemos pensar apenas os métodos! • O componente está
sendo renderizado corretamente? • As ações dos usuário estão sendo realizadas? • As propriedades passadas são coerentes e estão onde deveriam estar?