Testes unitários com QUnit

Sobre o QUnit

• Framework de testes unitário para javascript

• De uso fácil e bem documentado

• Indicado para testar código javascript, independente de markup

• Desenvolvido originalmente por John Resig, criador do jQuery

• Utilizado por: jQuery, jQuery UI, jQuery Mobile

• Existem diversos plugins e métodos de integração

213/04/2023

13/04/2023 3

Teste unitário

DefiniçãoTeste unitário

413/04/2023

“É um código executável que

testa uma unidade funcional do

software”

Por que testar?

• Testes são documentação executável

• Testes garantes mudanças sem erros

• Problemas são facilmente identificados

513/04/2023

Teste unitário

Sobre teste unitárioTeste unitário

613/04/2023

“Um desenvolvedor

que não faz testes é como um

cirurgião que não lava as mãos”

Robert C. Martin(Uncle Bob)

13/04/2023 7

Como utilizar o QUnit

13/04/2023 8

testes

HTML

QUnit

+

+Testes unitários

HTMLExemplo – Widgets do UOL Perfil

913/04/2023

TestesExemplo – Widgets do UOL Perfil

1013/04/2023

Exemplo: Widgets do UOL Perfil

13/04/2023 12

Também pode ser instalado via NPM

$ npm install qunit

ou se preferir

$ npm install -g qunit

13/04/2023 13

Estrutura dos testes

ArquivosEstrutura dos testes

1413/04/2023

ConfiguraçãoEstrutura dos testes

1513/04/2023

module()Agrupa casos de teste relacionados em módulo. Ajuda na

organização.

ConfiguraçãoEstrutura dos testes

1613/04/2023

test()Define um caso de teste.

AssertionsEstrutura dos testes

1713/04/2023

equal(), notEqual, ok(), strictEqual(), notStrictEqual(), etc…

Asserções/Afirmações que serão utilizadas para testar a funcionalidade. Descreve como a funcionalidade deve se

comportar.

CheckpointEstrutura dos testes

1813/04/2023

ComplementandoEstrutura dos testes

1913/04/2023

Escrevendo mais casos de teste

CheckpointEstrutura dos testes

2013/04/2023

ComplementandoEstrutura dos testes

2113/04/2023

Criando mais módulos

CheckpointEstrutura dos testes

2213/04/2023

Exemplo de erroEstrutura dos testes

2313/04/2023

Mais assertsEstrutura dos testes

2413/04/2023

strictEqual()

Verifica se o valor e tipo são iguais.

strictEqual(0, false, “Vai falhar!");equal(0,false, “Vai passar!");

strictEqual(10,”10”, “Também var falhar!");strictEqual(10,”10”, “Vai falhar miseravelmente!");

Como comparar com “===“ ou “!==“

Mais assertsEstrutura dos testes

2513/04/2023

deepEqual()

Mais assertsEstrutura dos testes

2613/04/2023

Falar de setup/teardown, deepEqual, assyncTest

13/04/2023 27

Integrando o QUnit

Integrando o QUnit

• Existem diversas maneiras de integração com o QUnit

• Escolha a melhor maneira de integração, baseado nas ferramentas e características de seu projeto

2813/04/2023

Jenkins Grunt PhantomJS Qunit Notifier

. . .

JenkinsIntegrando o QUnit

2913/04/2023

PhantomJSIntegrando o QUnit

3013/04/2023

Qunit NotifierIntegrando o QUnit

3113/04/2023

Referências

QUnit: http://qunitjs.com

Github: https://github.com/jquery/qunit

Documentação: http://api.qunitjs.com

Plugins: http://qunitjs.com/plugins

Cookbook: http://qunitjs.com/cookbook

3213/04/2023

Av. Brig. Faria Lima, 1.384, 4º andarCEP 01452-002 . São Paulo/SP

Telefone: 11 3914.9559 www.uol.com.br

13/04/2023 33

Obrigado ;-)Equipe de Concepção & Interface de Produtos – P&D