A TDD a Test-driven development rövidítése, magyarul Tesztvezérelt fejlesztés. A tesztelés és a fejlesztést kis iterációkban egymás után végezzük.
Adott egy projekt:
app01/ |-src/ | |-app.js | |-index.html | `-style.css |-.gitignore |-bs-config.json `-package.json
Az app.js és a style.css egy-egy üres fájl.
<!DOCTYPE html> <html lang="hu"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>doc</title> <link rel="stylesheet" href="bootstrap.css"> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <h1>doc</h1> </div> <script src="bootstrap.js"></script> <script src="app.js"></script> </body> </html>
node_modules/
{ "server": [ "src", "node_modules/bootstrap/dist/css", "node_modules/bootstrap/dist/js" ], "port": 8000 }
{ "name": "app10", "version": "1.0.0", "description": "", "main": "app.js", "scripts": { "test": "jasmine", "start": "lite-server" }, "keywords": [], "author": "", "license": "ISC", "devDependencies": { "jasmine": "^4.1.0", "lite-server": "^2.6.1" }, "dependencies": { "bootstrap": "^5.1.3" }, "type": "module" }
Telepítsük a Jasmine-t:
npm install jasmine
Készítsük fel a projektet a Jasmine használatára:
npx jamine init
A program írását a teszt elkészítésével kezdjük.
Írjunk meg tesztet:
import { calcTriangle } from '../src/triangle.js';
Éppen csak annyi kódot írunk, hogy a teszt hibára fusson. Mivel nem létezik a ../src/triangle.js, ezért a teszt hibára fut.
Írjuk meg a kódot, olyan szinten, hogy ne fusson hibára a teszt:
export var calcTriangle = () =>{}
Refaktoráljunk:
import { calcArea } from '../src/triangle.js'; describe('Háromszög számítások', () => { it('A calcArea függvény létezik', () => { expect(calcArea).not.toBeUndefined(); }); });
export var calcArea = () =>{}
A teszt futtatása:
npm test > app10@1.0.0 test > jasmine Randomized with seed 96701 Started . 1 spec, 0 failures Finished in 0.018 seconds Randomized with seed 96701 (jasmine --random=true --seed=96701)
Követeljük meg, hogy a calcArea() függvény fogadjon két paramétert:
import { calcArea } from '../src/triangle.js'; describe('Háromszg számítások', () => { it('A calcArea függvény létezik', () => { expect(calcArea).not.toBeUndefined(); }); it('A calcArea 30, 35 param. 525.-t adjon vissza', () => { let result = calcArea(30, 35); expect(result).toEqual(525.); }); });
Fejlesszük a kódot annyira, hogy a függvény fogadja a kódot.
export var calcArea = () =>{return 525.}
Nézzük meg, hogy tudunk-e rafaktorálni. Mivel nem, folytatjuk.
npm test > app10@1.0.0 test > jasmine Randomized with seed 18381 Started .. 2 specs, 0 failures Finished in 0.022 seconds Randomized with seed 18381 (jasmine --random=true --seed=18381)
Fejlesszük a tesztet:
it('A calcArea 40, 45 param. 900.-t adjon vissza', () => { let result = calcArea(40, 45); expect(result).toEqual(900.); });
A teljeskód:
import { calcArea } from '../src/triangle.js'; describe('Háromszg számítások', () => { it('A calcArea függvény létezik', () => { expect(calcArea).not.toBeUndefined(); }); it('A calcArea 30, 35 param. 525.-t adjon vissza', () => { let result = calcArea(30, 35); expect(result).toEqual(525.); }); it('A calcArea 40, 45 param. 900.-t adjon vissza', () => { let result = calcArea(40, 45); expect(result).toEqual(900.); }); });
Írjunk annyi kódot, hogy teljesítse a tesztet.
export var calcArea = (base, height) =>{ return base * height / 2; }
Fejlesszük a tesztet:
it('A calcArea kivételt dob 0 inputra', ()=> { expect(()=> calcArea(0, 35) ) .toThrow(new Error('Hiba! Az alap nem lehet kisebb mint 1')); });
import { calcArea } from '../src/triangle.js'; describe('Háromszög számítások', () => { it('A calcArea függvény létezik', () => { expect(calcArea).not.toBeUndefined(); }); it('A calcArea 30, 35 param. 525.-t adjon vissza', () => { let result = calcArea(30, 35); expect(result).toEqual(525.); }); it('A calcArea 40, 45 param. 900.-t adjon vissza', () => { let result = calcArea(40, 45); expect(result).toEqual(900.); }); it('A calcArea kivételt dob 0 inputra', ()=> { expect(()=> calcArea(0, 35) ) .toThrow(new Error('Hiba! Az alap nem lehet kisebb mint 1')); }); });
export var calcArea = (base, height) =>{ if (base<1) { throw new Error('Hiba! Az alap nem lehet kisebb mint 1'); } return base * height / 2; }
Refaktoráljuk a kódokat:
export var calcArea = (base, height) =>{ if (base<1 || height <1) { throw new Error('Hiba! A paraméter nem megfelelő'); } return base * height / 2; }
import { calcArea } from '../src/triangle.js'; describe('Háromszög calcArea függvény\n', () => { it('A calcArea függvény létezik', () => { expect(calcArea).not.toBeUndefined(); }); it('A 30, 35 inputra 525.-t ad vissza', () => { let result = calcArea(30, 35); expect(result).toEqual(525.); }); it('A 40, 45 inputra 900.-t ad vissza', () => { let result = calcArea(40, 45); expect(result).toEqual(900.); }); it('Kivételt dob 0 inputra', ()=> { expect(()=> calcArea(0, 35) ) .toThrow(new Error('Hiba! A paraméter nem megfelelő')); }); });
A teszt futtatása:
npm test > app10@1.0.0 test > jasmine Randomized with seed 95608 Started .... 4 specs, 0 failures Finished in 0.02 seconds Randomized with seed 95608 (jasmine --random=true --seed=95608)