jest tutorial javascript unit testing using jest framework
V tomto tutoriáli Jest sa dozvieme o rôznych funkciách Jest, Jest Matchers a o tom, ako používať rámec Jest na testovanie jednotiek JavaScriptu:
youtube na mp3 dlhšie ako 30 minút
Jest je rámec na testovanie Javascriptov, ktorý vytvoril Facebook.
Je primárne navrhnutý pre aplikácie založené na React (ktorý tiež vytvára Facebook), ale dá sa použiť na napísanie automatizačných scenárov pre akékoľvek kódové bázy založené na Javascript.
V tomto tutoriáli na testovanie Jest sa dozvieme o rôznych funkciách Jestu, jeho porovnávačoch a uvidíme, ako môžeme Jest použiť s príkladom typu end to end. Preskúmame tiež pokrytie kódu pomocou Jest.
Zoznam tutoriálov v tejto sérii JEST
Výukový program č. 1: Výukový program Jest - Testovanie jednotky JavaScript pomocou Jest Framework
Výukový program č. 2: Ako testovať reakcie aplikácií pomocou Jest Framework
Výukový program č. 3: Konfigurácia Jest a ladenie testov Jest
Čo sa dozviete:
- Začíname s testovaním Jest
- Jest Framework pre testovanie jednotiek JavaScriptu
- K dispozícii sú Matchers
- Jest Hooks - nastavenie a demontáž
- Záver
Začíname s testovaním Jest
Niektoré z výhod / funkcií Jestu sú uvedené nižšie:
- Vyžaduje sa nulová konfigurácia.
- Rýchlo: Testy Jest prebiehajú paralelne - to zase výrazne skracuje čas vykonania testu.
- Zabudované pokrytie kódu: Jest podporuje pokrytie kódom už po vybalení z krabice - je to veľmi užitočná metrika pre všetky doručovacie kanály založené na CI a celkovú účinnosť testov projektu.
- Izolované a karanténne testy: Každý test Jest beží vo svojom vlastnom pieskovisku, čo zaručuje, že žiadne dva testy sa nemôžu vzájomne ovplyvňovať alebo ovplyvňovať.
- Výkonná podpora simulácie: Testy Jest podporujú všetky typy zosmiešňovania - či už sú to posmechy funkčné, zosmiešňovanie časovačom alebo zosmiešňovanie jednotlivých volaní API.
- Podpora testovania snímok: Testovanie snímok je relevantné z hľadiska Reagovať. Jest podporuje snímanie snímky testovanej reakčnej súčasti - to je možné overiť skutočným výstupom súčasti. To veľmi pomáha pri overovaní správania komponentu.
Jest Framework pre testovanie jednotiek JavaScriptu
V tejto časti uvidíme príklad typu end-to-end na písanie testov pomocou rámca JEST pre jednoduchú funkciu Javascript. Najprv sa pozrime, ako nainštalovať rámec JEST do nášho projektu
Inštalácia IS
Jest je jednoducho uzlový balík a dá sa nainštalovať pomocou ktoréhokoľvek uzlového správcu balíkov. Príklad, npm alebo priadza.
Pozrime sa na niektoré príklady príkazov, ktoré možno použiť na inštaláciu balíka Jest.
yarn add --dev jest
npm install --save-dev jest
Na globálnu inštaláciu modulu Jest môžete jednoducho použiť príznak ‘-g’ spolu s príkazom npm. Toto vám umožní používať príkazy Jest priamo bez konfigurácie súboru balíka pre testy npm.
npm install -g jest
Používanie Jest v projekte založenom na uzloch
Ak chcete použiť Jest v projekte založenom na uzloch, jednoducho pomocou príkazov z vyššie uvedenej sekcie nainštalujte balíček uzlov pre Jest.
Podľa nasledujúcich krokov vytvorte projekt uzla od začiatku a potom doň nainštalujte Jest.
# 1) Vytvorte priečinok / adresár s názvom ako názvom projektu, napríklad , myFirstNodeProject
#dva) Teraz pomocou terminálu alebo príkazového riadku prejdite na projekt vytvorený v predchádzajúcom kroku a pomocou nasledujúceho príkazu vykonajte skript npm init.
npm init
# 3) Po vykonaní vyššie uvedeného príkazu sa zobrazí výzva na zadanie rôznych otázok / parametrov.
Napríklad , názov projektu, verzie atď. Jednoducho stlačte kláves Enter (a potvrďte predvolené hodnoty). Po dokončení sa zobrazí súbor package.json vytvorený vo vašom projekte. Toto je povinný konfiguračný súbor pre akýkoľvek projekt založený na uzloch
# 4) Teraz vykonajte príkaz na inštaláciu balíka Jest do novovytvoreného projektu pomocou príkazu nižšie.
npm install --save-dev jest
Týmto sa nainštaluje modul Jest (rovnako ako jeho závislosti).
# 5) Teraz máme pripravený projekt uzla s väzbami Jest. Nakonfigurujme testovací skript npm tak, aby spustil testy Jest, tj. Keď sa vykoná príkaz „npm test“, mal by skript spustiť všetky testy založené na architektúre Jest.
Ak to chcete urobiť, aktualizujte súbor package.json a pridajte časť so skriptmi, ako je uvedené nižšie.
'scripts': { 'test': 'jest' }
Výsledný súbor package.json bude vyzerať, ako je uvedené nižšie.
{ 'name': 'jest-e2e', 'version': '1.0.0', 'description': '', 'main': 'index.js', 'scripts': { 'test': 'jest' }, 'author': '', 'license': 'ISC', 'dependencies': { 'jest': '^25.1.0' } }
Písanie testov na funkciu Javascript
V tejto časti vytvoríme jednoduchý funkčný kód Javascript na sčítanie, odčítanie a násobenie 2 čísel a napíšeme preň zodpovedajúce testy založené na Jest.
Najprv sa pozrime, ako vyzerá kód pre našu testovanú aplikáciu (alebo funkciu).
# 1) V projekte uzlov vytvorenom v predchádzajúcej časti vytvorte súbor js s názvom calculator.js s obsahom, ako je uvedené nižšie
const mathOperations = { sum: function(a,b) { return a + b; }, diff: function(a,b) { return a - b; }, product: function(a,b) { return a * b } } module.exports = mathOperations
#dva) Teraz vytvorte testovací súbor v rovnakom priečinku pre tieto testy s názvom calculator.test.js - toto je konvencia očakávaná rámcom Jest na vyhľadanie všetkých súborov, ktoré obsahujú testy založené na Jest. Importujeme aj testovanú funkciu, aby sme mohli v teste spustiť kód.
Takto by vyzeral súbor iba s deklaráciou import / vyžadovať.
const mathOperations = require('./calculator');
# 3) Poďme si teraz zapísať testy pre rôzne metódy do hlavného súboru, tj. Súčet, rozdiel a súčin.
Testy Jest nasledujú po testoch štýlu BDD, pričom každá testovacia sada má jeden hlavný blok popisu a môže mať viac testovacích blokov. Upozorňujeme tiež, že testy môžu mať vnorené aj bloky na popis.
Poďme napísať test na pridanie dvoch čísel a overiť očakávané výsledky. Budeme dodávať čísla ako 1 a 2 a očakávame výstup ako 3.
describe('Calculator tests', () => { test('adding 1 + 2 should return 3', () => { expect(mathOperations.sum(1, 2)).toBe(3); }); })
Prečítajte si nižšie uvedené body pri vyššie uvedenom teste:
do) Blok description je vonkajším popisom testovacej sady, t. J. Predstavuje generický kontajner pre všetky testy, ktoré pre tento kalkulátor v tomto súbore napíšeme.
b) Ďalej máme individuálny testovací blok - predstavuje to jeden test. Reťazec v úvodzovkách predstavuje názov testu.
c) Pozrite si kód v bloku expect - „expect“ nie je nič iné ako tvrdenie. Príkaz volá metódu súčtu v testovanej funkcii so vstupmi 1 a 2 a očakáva, že výstup bude 3.
Môžeme to tiež prepísať jednoduchším spôsobom, aby sme tomu lepšie porozumeli.
Pozri nižšie, teraz sme oddelili volanie funkcie a tvrdenie ako 2 samostatné príkazy, aby bola stručnejšia.
describe('Calculator tests', () => { test('adding 1 + 2 should return 3', () => { // arrange and act var result = mathOperations.sum(1,2) // assert expect(result).toBe(3); }); })
d) Ak chcete spustiť tento test, jednoducho spustite príkaz „ skúška nad morom ”V termináli alebo príkazovom riadku na mieste projektu.
Uvidíte výstup, ako je uvedené nižšie.
top 5 hostiteľských systémov detekcie vniknutia
# 4) Skúsme ešte nejaké testy.
do) Najskôr napíšeme zlyhávajúci test a uvidíme, aký výstup dostaneme. Poďme zmeniť výsledok na nesprávnu hodnotu v rovnakom teste, ktorý sme napísali v poslednej časti. Zistite, ako vyzerá test.
describe('Calculator tests', () => { test('adding 1 + 2 should return 10', () => { // arrange and act var result = mathOperations.sum(1,2) // assert expect(result).toBe(10); }); })
Tu očakávame, že súčet 1 a 2 vráti 10, čo je nesprávne.
Skúsme to vykonať a uvidíme, čo dostaneme.
Môžete vidieť podrobný výstup, keď je test neúspešný, t. J. Čo sa skutočne vrátilo a čo sa očakávalo a ktorý riadok spôsobil chybu v testovanej funkcii atď.
b) Poďme si napísať viac testov pre ďalšie funkcie, tj. Rozdiel a produkt.
Testovací súbor so všetkými testami bude vyzerať nasledovne.
const mathOperations = require('./calculator'); describe('Calculator tests', () => { test('adding 1 + 2 should return 3', () => { // arrange and act var result = mathOperations.sum(1,2) // assert expect(result).toBe(3); }); test('subtracting 2 from 10 should return 8', () => { // arrange and act var result = mathOperations.diff(10,2) // assert expect(result).toBe(8); }); test('multiplying 2 and 8 should return 16', () => { // arrange and act var result = mathOperations.product(2,8) // assert expect(result).toBe(16); }); })
Keď sa vykonajú vyššie uvedené testy, vygeneruje sa výstup uvedený nižšie.
Videonávod: Čo je vtip
K dispozícii sú Matchers
Vtipy Jest používajú na zaistenie podmienky porovnávače. Jest používa zápalky z očakávaného Api. Možno očakávať odkaz na dokument API tu.
Pozrime sa na niektoré z najbežnejšie používaných porovnávacích nástrojov spolu s testami Jest.
# 1) Rovnosť
Toto sú najčastejšie používané porovnávače. Používajú sa na kontrolu rovnosti alebo nerovnosti a väčšinou sa používajú na aritmetické operácie.
Pozrime sa na niektoré príklady nižšie:
Tu sme napísali 2 porovnávače používajúce toBe a not.toBe, ktoré sú analogické k rovným a nie rovným.
test('equality matchers', () => { expect(2*2).toBe(4); expect(4-2).not.toBe(1); })
# 2) Pravdivosť
Tu uvidíme porovnávače pre hodnoty null, falsy a truthy, t.j. falošné a pravdivé hodnoty. Je dôležité poznamenať, že všetko, čo nie je logicky pravdivé, je falošné.
Napríklad, číslo 0, null, prázdny reťazec, NaN sú všetky príklady falošného w.r.t Javascript.
test('truthy operators', () => { var name='Software testing help' var n = null expect(n).toBeNull() expect(name).not.toBeNull // name has a valid value expect(name).toBeTruthy() //fail - as null is non success expect(n).toBeTruthy() // pass - null treated as false or negative expect(n).toBeFalsy() // 0 - treated as false expect(0).toBeFalsy() })
# 3) Porovnávače čísel
Tieto porovnávače je možné použiť na bežné aritmetické operácie.
Napríklad, greaterThan, lessThan, greaterThanOrEqual atď.
V ďalších príkladoch nájdete ďalšie podrobnosti
test('numeric operators', () => { var num1 = 100; var num2 = -20; var num3 = 0; // greater than expect(num1).toBeGreaterThan(10) // less than or equal expect(num2).toBeLessThanOrEqual(0) // greater than or equal expect(num3).toBeGreaterThanOrEqual(0) })
# 4) Porovnávače reťazcov
Mnohokrát potrebujeme reťazce, ktoré zodpovedajú regulárnemu výrazu ako tvrdenie v teste jednotky. Jest poskytuje zhody pre reťazce, ktoré sa majú porovnávať s regulárnym výrazom.
test('string matchers',() => { var string1 = 'software testing help - a great resource for testers' // test for success match expect(string1).toMatch(/test/); // test for failure match expect(string1).not.toMatch(/abc/) })
Výukový program s videom: K dispozícii sú porovnávače
Jest Hooks - nastavenie a demontáž
Rovnako ako všetky ostatné rámce na testovanie jednotiek založené na xUnit, aj rámec Jest poskytuje háčiky pre metódy nastavenia a vyčistenia. Tieto metódy pripájania sa vykonávajú pred a po každom teste v testovacom balíku alebo pred a po vykonaní testSuite.
Celkovo sú k dispozícii 4 háčiky, ktoré sa dajú použiť.
- beforeEach a afterEach: Tieto háky sa vykonávajú pred a po každom teste v testovacej sade.
- beforeAll a afterAll: Tieto háky sa pre každú testovaciu sadu vykonajú iba raz. tj. ak má testovacia sada 10 testov, tieto háky sa vykonajú iba raz za každé vykonanie testu.
Pozrime sa na príklad: Tieto háky pridáme k rovnakému testovaciemu príkladu pridania 2 čísel.
Na ilustráciu nastavíme vstupy pred každým háčikom. Testovací súbor by vyzeral s testovacími háčikmi, ako je uvedené nižšie.
describe('Calculator tests', () => { var input1 = 0 var input2 = 0 beforeAll(() => { console.log('beforeAll called'); }); afterAll(() => { console.log('afterAll called'); }); beforeEach(() => { console.log('beforeEach called'); input1 = 1; input2 = 2; }); afterEach(() => { console.log('afterEach called'); }); test('adding 1 + 2 should return 3', () => { // arrange and act var result = mathOperations.sum(input1,input2) // assert expect(result).toBe(3); }); })
tipy a triky
# 1) Správy z príkazového riadku sú dobré, ale nie príliš čitateľné. K dispozícii sú knižnice / moduly na generovanie protokolov o testoch založených na HTML pre testy Jest. Dá sa to dosiahnuť tak, ako je uvedené nižšie.
najlepší bezplatný firewall pre Windows XP
- Pridajte balíček uzlov pre jest-html-reporter pomocou nižšie uvedeného príkazu.
npm install --save-dev jest-html-reporter
- Teraz pridajte konfiguráciu Jest pre reportéra do súboru package.json projektu uzla.
'jest': { 'reporters': [ 'default', [ './node_modules/jest-html-reporter', { 'pageTitle': 'Test Report' } ] ] }
- Po nakonfigurovaní teraz vykonajte testy pomocou „ skúška nad morom ”Príkaz.
- Ak je nastavenie úspešné, mali by ste vidieť, ako sa v adresári projektu vytvára správa založená na html.
# 2) Vytvorenie správy o pokrytí kódu: Pokrytie kódu je jednou z najdôležitejších metrík z pohľadu jednotkového testovania. V podstate meria, aké percento výpisov / pobočiek je pokrytých pre testovanú aplikáciu.
Jest poskytuje podporu pre pokrytie kódom po vybalení z krabice. Ak chcete získať správu o spravodajstve Jest, Existuje konfigurácia je potrebné pridať do balíček.json spis.
Pridajte konfiguráciu, ako je uvedené nižšie:
'jest': { 'collectCoverage':true }
Po dokončení tejto konfigurácie skúste spustiť testy pomocou príkazu „Test nad hladinou mora“ a môžete pozrite si podrobnosti pokrytia kódu priamo pod výsledkami vykonania testu, ako je uvedené nižšie.
Výukový program Video: Pokrytie Jest a generovanie prehľadov HTML
Záver
V tomto tutoriáli Jest sme si prešli základy rámca Jest. Naučili sme sa, ako nainštalovať rámec Jest, a videli sme, ako sa dá použiť na testovanie jednoduchých súborov Javascript.
Preskúmali sme tiež rôzne typy porovnávačov podporovaných Jestom a pokryli sme aj reportérov HTML a správy o pokrytí kódu.
Odporúčané čítanie
- Konfigurácia Jest a ladenie testov Jest
- Ako testovať reakcie aplikácií pomocou Jest Framework
- Ako nastaviť testovací rámec Node.js: Výukový program Node.js
- Výukový program TestNG: Úvod do rámca TestNG
- Ukážkový projekt testovania front-endových jednotiek pomocou KARMA a JASMINE
- Výukový program Mockito: Rámec Mockito pre simuláciu pri testovaní jednotiek
- Písanie testov jednotiek s programom Spock Framework
- Výukový program JUnit pre začiatočníkov - Čo je to Testovanie JUnit