SlideShare uma empresa Scribd logo
1 de 19
Enzyme JS
JavaScript Testing utilities for React
Jonathan Sedrez
Frontend | ilegra
Utilitário de testes em javascript para React que
facilita verificar, manipular, e percorrer as saídas
produzidas por seus components React.
Enzyme foi fundada pela
Airbnb e posteriormente,
devido ao seu sucesso, foi
transferida para um
biblioteca independente
Enzyme
Utilitário de testes em javascript para React que
facilita verificar, manipular, e percorrer as
saídas produzidas por seus components React.
Integrações
Integrações
- Jest
- Mocha
- Karma
- React Native
Popularidade
Popularidade
Métodos de teste
Shallow x Mount x Render
Shallow
Shallow rendering é a forma básica de testar um componente
utilizando Enzyme, pois limita a renderização apenas ao
componente que está sendo testado, ou seja, os filhos não são
renderizados.
Mount e Render
Ambos mount e render efetuam a renderização total do
componente incluindo os componentes filhos. A diferença
existente entre os dois, é que o método mount executa os ciclos
de vida do componente e o segundo apenas a função render.
API
API
- find()
- simulate()
- debug()
- first()
- last()
...
Enzyme Adapter
Code
Conclusão
Obrigado!
JS > RUST

Mais conteúdo relacionado

Semelhante a Enzyme js

Ionic Reativo com RxJS e ngRx
Ionic Reativo com RxJS e ngRxIonic Reativo com RxJS e ngRx
Ionic Reativo com RxJS e ngRxLoiane Groner
 
Comparando as Hypes - React & Vue
Comparando as Hypes - React & VueComparando as Hypes - React & Vue
Comparando as Hypes - React & VueHerbert Henrique
 
Vue.js - o framework progressivo
Vue.js - o framework progressivoVue.js - o framework progressivo
Vue.js - o framework progressivoVinicius Reis
 
Java Bahia Desenvolvimento Java Area1
Java Bahia Desenvolvimento Java Area1Java Bahia Desenvolvimento Java Area1
Java Bahia Desenvolvimento Java Area1guestc9a1c7
 
Projetos reativos com Angular, RxJS e Redux (ngRx)
Projetos reativos com Angular, RxJS e Redux (ngRx)Projetos reativos com Angular, RxJS e Redux (ngRx)
Projetos reativos com Angular, RxJS e Redux (ngRx)Loiane Groner
 
Testando uma aplicação AngularJS utilizando o Karma
Testando uma aplicação AngularJS utilizando o KarmaTestando uma aplicação AngularJS utilizando o Karma
Testando uma aplicação AngularJS utilizando o KarmaHenrique Limas
 
Visual Regression Testing: mais um tipo de teste pra sua pipeline
Visual Regression Testing: mais um tipo de teste pra sua pipelineVisual Regression Testing: mais um tipo de teste pra sua pipeline
Visual Regression Testing: mais um tipo de teste pra sua pipelineSamanta Cicilia
 
Unit Test JavaScript
Unit Test JavaScriptUnit Test JavaScript
Unit Test JavaScriptDan Vitoriano
 
React - Front In Maceió Framework Edition - 2017
React - Front In Maceió Framework Edition - 2017React - Front In Maceió Framework Edition - 2017
React - Front In Maceió Framework Edition - 2017Djanilson Alves
 
Palestra Demoiselle V1.x no 11 FISL
Palestra Demoiselle V1.x no 11 FISL Palestra Demoiselle V1.x no 11 FISL
Palestra Demoiselle V1.x no 11 FISL Emerson Saito
 
Angular + Redux (ngRx)
Angular + Redux (ngRx)Angular + Redux (ngRx)
Angular + Redux (ngRx)Loiane Groner
 
TDC2015 Porto Alegre - Interfaces ricas com Rails e React.JS
TDC2015  Porto Alegre - Interfaces ricas com Rails e React.JSTDC2015  Porto Alegre - Interfaces ricas com Rails e React.JS
TDC2015 Porto Alegre - Interfaces ricas com Rails e React.JSRodrigo Urubatan
 
Java Web 2 - Ferramentas e configuração
Java Web 2 - Ferramentas e configuraçãoJava Web 2 - Ferramentas e configuração
Java Web 2 - Ferramentas e configuraçãoEduardo Mendes
 

Semelhante a Enzyme js (20)

Ionic Reativo com RxJS e ngRx
Ionic Reativo com RxJS e ngRxIonic Reativo com RxJS e ngRx
Ionic Reativo com RxJS e ngRx
 
Comparando as Hypes - React & Vue
Comparando as Hypes - React & VueComparando as Hypes - React & Vue
Comparando as Hypes - React & Vue
 
Vue.js - o framework progressivo
Vue.js - o framework progressivoVue.js - o framework progressivo
Vue.js - o framework progressivo
 
Começando com React.js
Começando com React.jsComeçando com React.js
Começando com React.js
 
Java Bahia Desenvolvimento Java Area1
Java Bahia Desenvolvimento Java Area1Java Bahia Desenvolvimento Java Area1
Java Bahia Desenvolvimento Java Area1
 
TDD para Java EE
TDD para Java EETDD para Java EE
TDD para Java EE
 
React nos Trilhos
React nos TrilhosReact nos Trilhos
React nos Trilhos
 
Projetos reativos com Angular, RxJS e Redux (ngRx)
Projetos reativos com Angular, RxJS e Redux (ngRx)Projetos reativos com Angular, RxJS e Redux (ngRx)
Projetos reativos com Angular, RxJS e Redux (ngRx)
 
Testando uma aplicação AngularJS utilizando o Karma
Testando uma aplicação AngularJS utilizando o KarmaTestando uma aplicação AngularJS utilizando o Karma
Testando uma aplicação AngularJS utilizando o Karma
 
Visual Regression Testing: mais um tipo de teste pra sua pipeline
Visual Regression Testing: mais um tipo de teste pra sua pipelineVisual Regression Testing: mais um tipo de teste pra sua pipeline
Visual Regression Testing: mais um tipo de teste pra sua pipeline
 
Unit Test JavaScript
Unit Test JavaScriptUnit Test JavaScript
Unit Test JavaScript
 
Cactus xp
Cactus xpCactus xp
Cactus xp
 
React - Front In Maceió Framework Edition - 2017
React - Front In Maceió Framework Edition - 2017React - Front In Maceió Framework Edition - 2017
React - Front In Maceió Framework Edition - 2017
 
Palestra Demoiselle V1.x no 11 FISL
Palestra Demoiselle V1.x no 11 FISL Palestra Demoiselle V1.x no 11 FISL
Palestra Demoiselle V1.x no 11 FISL
 
Angular + Redux (ngRx)
Angular + Redux (ngRx)Angular + Redux (ngRx)
Angular + Redux (ngRx)
 
Be React. Do Tests!
Be React. Do Tests!Be React. Do Tests!
Be React. Do Tests!
 
Java 08
Java 08Java 08
Java 08
 
Introdução Vue JS
Introdução Vue JSIntrodução Vue JS
Introdução Vue JS
 
TDC2015 Porto Alegre - Interfaces ricas com Rails e React.JS
TDC2015  Porto Alegre - Interfaces ricas com Rails e React.JSTDC2015  Porto Alegre - Interfaces ricas com Rails e React.JS
TDC2015 Porto Alegre - Interfaces ricas com Rails e React.JS
 
Java Web 2 - Ferramentas e configuração
Java Web 2 - Ferramentas e configuraçãoJava Web 2 - Ferramentas e configuração
Java Web 2 - Ferramentas e configuração
 

Mais de Jonathan de Britto Sedrez (15)

Typescript 4.1
Typescript 4.1Typescript 4.1
Typescript 4.1
 
Socket.io
Socket.ioSocket.io
Socket.io
 
RSocket
RSocketRSocket
RSocket
 
Rambda
RambdaRambda
Rambda
 
PWA
PWAPWA
PWA
 
OTA updates
OTA updatesOTA updates
OTA updates
 
OKRs
OKRsOKRs
OKRs
 
Jasmine
Jasmine Jasmine
Jasmine
 
Facebook flux
Facebook fluxFacebook flux
Facebook flux
 
Event bubbling
Event bubblingEvent bubbling
Event bubbling
 
EscmaScript
EscmaScriptEscmaScript
EscmaScript
 
Es2020
Es2020Es2020
Es2020
 
Cypress
CypressCypress
Cypress
 
Chart css
Chart cssChart css
Chart css
 
Bff patterns
Bff patternsBff patterns
Bff patterns
 

Enzyme js

Notas do Editor

  1. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  2. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  3. O websocket e um protocolo que torna possivbel a comunicação bidirecional entre um navegador web e um servidor . Ele permite a criação d eum tunel para transportar de uma forma continua entre um savegador e um servidor.
  4. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  5. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  6. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  7. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  8. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  9. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  10. Esse método é ótimo quando se deseja testar componentes de apresentação apenas, ou quando a mudança de comportamento em um componente filho não afeta o componente pai.
  11. Esse método é ótimo quando se deseja testar componentes de apresentação apenas, ou quando a mudança de comportamento em um componente filho não afeta o componente pai.
  12. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  13. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  14. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  15. Antes de falarmos propriamente de socet.io eu vou explicar m passo anterior que são os websockets. Ele faz parte das especificações do html 5 é suportado pelas ultimas versões dos navegadores
  16. socket.io é uma ferramenta muito poderosa para resolver problemas de comunicação continua (chat, pooling, jogos). É importante saber o momento de utilizar e tambem o momento de NÂO utilizar. Utilizar socket.io;websocket pode em casos que não sejam esses podem afetar negativamente a performance e adicionando complexidade para o desenvolvedor.