1. TDD

TDD ์ฃผ์˜์‚ฌํ•ญ ํ…Œ์ŠคํŠธ ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•œ๋‹ค๊ณ  TDD๊ฐ€ ์•„๋‹Œ TDD Cycle์— ๋”ฐ๋ผ ํ…Œ์ŠคํŠธ ์ฝ”๋“œ ์ž‘์„ฑ, ๋กœ์ง ๊ตฌํ˜„, ๋ฆฌํŒฉํ„ฐ๋ง์„ ์ˆœํ™˜ํ•˜๋Š” ๊ณผ์ •์„ ์—„๊ฒฉํ•˜๊ฒŒ ์ง€์ผœ ๊ฐœ๋ฐœํ•ด์•ผ TDD๋ผ ํ•  ์ˆ˜ ์žˆ๋‹ค.

Keyword

  • TDD๋ž€

  • Jest

  • Describe - Context - It ํŒจํ„ด

  • ๋‹จ์œ„ ํ…Œ์ŠคํŠธ๋ž€


1. TDD๋ž€?

ํ…Œ์ŠคํŠธ ์ฝ”๋“œ๋ฅผ ๋จผ์ € ์ž‘์„ฑํ•˜๋Š” ๋ฐฉ์‹, ๊ตฌํ˜„๋ณด๋‹ค ์ธํ„ฐํŽ˜์ด์Šค์™€ ์ŠคํŽ™์„ ๋จผ์ € ์ •์˜ํ•˜์—ฌ ๊ฐœ๋ฐœ์„ ์ง„ํ–‰ํ•˜๋Š” ๋ฐฉ์‹์ด๋‹ค.

์ธํ„ฐํŽ˜์ด์Šค

ํ…Œ์ŠคํŠธํ•˜๋ ค๋Š” ๋Œ€์ƒ(๋ชจ๋“ˆ, ํ•จ์ˆ˜, ํด๋ž˜์Šค, ์‹œ์Šคํ…œ ๋“ฑ)๊ณผ ์ƒํ˜ธ์ž‘์šฉํ•˜๊ธฐ ์œ„ํ•œ ๋ฐฉ๋ฒ•๊ณผ ๊ทœ์น™์„ ์ •์˜

  • ์ž…๋ ฅ๊ฐ’ ๋ฐ ์ถœ๋ ฅ๊ฐ’ ์ •์˜

  • ํ•จ์ˆ˜ ํ˜ธ์ถœ ๋ฐฉ๋ฒ•

  • ์˜ˆ์™ธ ์ฒ˜๋ฆฌ ๋“ฑ

์ŠคํŽ™

ํ…Œ์ŠคํŠธ ๋Œ€์ƒ์ด ์–ด๋–ป๊ฒŒ ๋™์ž‘ํ•ด์•ผ ํ•˜๋Š”์ง€์— ๋Œ€ํ•œ ๊ธฐ๋Œ€๋˜๋Š” ๋™์ž‘

TDD Cycle

  1. Red โ†’ ์‹คํŒจํ•˜๋Š” ํ…Œ์ŠคํŠธ ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑ. ์ธํ„ฐํŽ˜์ด์Šค์™€ ์ŠคํŽ™์— ์ง‘์ค‘ํ•œ๋‹ค.

  2. Green โ†’ ์žฌ๋นจ๋ฆฌ ํ…Œ์ŠคํŠธ๋ฅผ ํ†ต๊ณผ์‹œํ‚จ๋‹ค. ์˜ฌ๋ฐ”๋ฅธ ๋ฐฉ๋ฒ•์ด ์•„๋‹ˆ์–ด๋„ ๊ดœ์ฐฎ๋‹ค.

  3. Refactor โ†’ ๋ฆฌํŒฉํ„ฐ๋ง์„ ํ†ตํ•ด ์ฝ”๋“œ๋ฅผ ์˜ฌ๋ฐ”๋ฅด๊ฒŒ ๋งŒ๋“ ๋‹ค. TDD์—์„œ ๊ฐ€์žฅ ์ค‘์š”ํ•œ ๋ถ€๋ถ„์ด์ง€๋งŒ, ๊ฐ„๊ณผ๋  ๋•Œ๊ฐ€ ๋งŽ๋‹ค.

Red ๋‹จ๊ณ„

์‹คํŒจํ•˜๋Š” ์ฝ”๋“œ๋ฅผ ๋น ๋ฅด๊ฒŒ ์ž‘์„ฑํ•˜๊ธฐ ์œ„ํ•ด, ์ž‘์€ ๋‹จ์œ„, ๋‹จ๊ณ„๋ฅผ ์ฐพ๋Š”๋‹ค. ์ด ๊ณผ์ •์—์„œ ์•Œ๊ฒŒ๋œ ๊ฒƒ, ๋ฐฐ์šด ๊ฒƒ์— ๋Œ€ํ•œ ํ”ผ๋“œ๋ฐฑ์„ ์–ป๋Š” ๊ฒŒ ์–ด๋ ต์ง€๋งŒ ์ค‘์š”ํ•˜๋‹ค. Green๋‹จ๊ณ„์˜ ํ†ต๊ณผํ•˜๋Š” ํ…Œ์ŠคํŠธ ์ฝ”๋“œ ์ž‘์„ฑ์ด ์–ด๋ ต๋‹ค๋ฉด ์ด ๋‹จ๊ณ„์—์„œ ๋” ์ž‘์€, ๋” ์‰ฌ์šด ๋ฌธ์ œ๋ฅผ ์ •์˜ํ•œ๋‹ค.

Refactor ๋‹จ๊ณ„

์˜๋„๋ฅผ ๋“œ๋Ÿฌ๋‚ด๊ณ  ์ค‘๋ณต์„ ์ฐพ์•„ ์ œ๊ฑฐํ•˜๋Š” ์—ฐ์Šต์„ ํ•ด์•ผํ•œ๋‹ค. ํ…Œ์ŠคํŠธ ์ผ€์ด์Šค ์ •์˜ ๋ฐฉ๋ฒ•


2. Jest

Facebook์—์„œ ๋งŒ๋“  JS, TS ํ…Œ์ŠคํŠธ ํ”„๋ ˆ์ž„์›Œํฌ, React Testing libarary์™€ ํ•จ๊ป˜ ํ…Œ์ŠคํŠธ ๋Ÿฌ๋„ˆ๋กœ์„œ ์‚ฌ์šฉํ•œ๋‹ค.

  1. test ํ•จ์ˆ˜๋กœ ๊ฐœ๋ณ„ ํ…Œ์ŠคํŠธ๋ฅผ ๋‚˜์—ด

  2. BDD(ํ–‰์œ„ ์ฃผ๋„ ๊ฐœ๋ฐœ) ์Šคํƒ€์ผ๋กœ ์ฃผ์ฒด(๋Œ€์ƒ) - ํ–‰์œ„ ์ค‘์‹ฌ์œผ๋กœ ํ…Œ์ŠคํŠธ๋ฅผ ์กฐ์ง

๊ฐœ๋ณ„ ํ…Œ์ŠคํŠธ

function add(x: number, y: number): number {
    return 1 + 2;
}

test('add', () => {
  expect(add(1, 2)).toBe(3);
});

BDD ์Šคํƒ€์ผ

describe - it (์ฃผ์ฒด - ํ–‰์œ„) ์ค‘์‹ฌ์œผ๋กœ ํ…Œ์ŠคํŠธ๋ฅผ ์กฐ์งํ™”ํ•˜๋Š” ๋ฐฉ์‹ ~๋Š” ~์ด๋‹ค or ~ํ•œ๋‹ค.

์ฃผ์˜โ—๏ธ ํ–‰์œ„๋ฅผ ๋ช…์‹œํ•  ๋•Œ ~๋œ๋‹ค ๊ฐ™์€ ์ˆ˜๋™ํ˜• ํ‘œํ˜„์€ ์ ํ•ฉํ•˜์ง€ ์•Š๋‹ค.

function add(x: number, y: number): number {
    return 1 + 2;
}

describe('add', () => {
  it('returns sum of two numbers', () => {
    expect(add(1, 2)).toBe(3);
  });
});

3. Describe - Context - It ํŒจํ„ด

ํ…Œ์ŠคํŠธ ์Šคํฌ๋ฆฝํŠธ๋ฅผ ๊ตฌ์„ฑํ•˜๋Š”๋ฐ ๋„์›€์ด ๋˜๋Š” ํ…Œ์ŠคํŠธ ์ฝ”๋“œ ๊ตฌ์„ฑ ํŒจํ„ด

  • Describe - ์„ค๋ช…ํ•  ํ…Œ์ŠคํŠธ ๋Œ€์ƒ์„ ๋ช…์‹œํ•œ๋‹ค.

  • Context - ํ…Œ์ŠคํŠธ ๋Œ€์ƒ์ด ๋†“์ธ ์ƒํ™ฉ์„ ์„ค๋ช…ํ•œ๋‹ค.

  • It - ํ…Œ์ŠคํŠธ ๋Œ€์ƒ์˜ ํ–‰๋™์„ ์„ค๋ช…ํ•œ๋‹ค.

ํ•œ๊ตญ์–ด๋กœ ํ…Œ์ŠคํŠธ ์Šคํฌ๋ฆฝํŠธ ๊ตฌ์„ฑํ•˜๊ธฐ

  • Describe - ํ…Œ์ŠคํŠธ ๋Œ€์ƒ์„ ๋ช…์‚ฌ๋กœ ์ž‘์„ฑํ•œ๋‹ค. ~๋Š”, ~(์ด)๊ฐ€

  • Context๋Š” - ~์ธ ๊ฒฝ์šฐ, ~ํ•  ๋•Œ, ๋งŒ์•ฝ ~ ํ•˜๋‹ค๋ฉด ๊ณผ ๊ฐ™์ด ์ƒํ™ฉ ๋˜๋Š” ์กฐ๊ฑด์„ ๊ธฐ์ˆ ํ•œ๋‹ค.

  • it - ๋ช…์‚ฌ๋กœ ์ž‘์„ฑํ•œ ํ…Œ์ŠคํŠธ ๋Œ€์ƒ์˜ ํ–‰๋™์„ ์ž‘์„ฑํ•œ๋‹ค.

    • ํ…Œ์ŠคํŠธ ๋Œ€์ƒ์˜ ํ–‰๋™์€ ~์ด๋‹ค, ~ํ•œ๋‹ค, ~๋ฅผ ๊ฐ–๋Š”๋‹ค ๊ฐ€ ์ ์ ˆํ•œ๋‹ค.

    • ~๋œ๋‹ค ๊ฐ™์€ ์ˆ˜๋™ํ˜• ํ‘œํ˜„์€ ์ข‹์ง€ ์•Š๋‹ค.

describe('add', () => {
  context('์ธ์ž๊ฐ€ ์—†์„ ๊ฒฝ์šฐ', () => {
    it('0์„ ๋ฐ˜ํ™˜ํ•œ๋‹ค', () => {
    expect(add()).toBe(0);
    });
  });

  context('์ธ์ž๊ฐ€ ํ•˜๋‚˜์ผ ๊ฒฝ์šฐ', () => {
    it('์ธ์ž์™€ ๊ฐ™์€๊ฐ’์„ ๋ฐ˜ํ™˜ํ•œ๋‹ค', () => {
    expect(add(1)).toBe(1);
    });
  })

  context('์ธ์ž๊ฐ€ ๋‘๊ฐœ์ผ ๊ฒฝ์šฐ', () => {
    it('๋‘ ์ˆ˜๋ฅผ ๋”ํ•œ ๊ฐ’์„ ๋ฐ˜ํ™˜ํ•œ๋‹ค', () => {
    expect(add(1, 2)).toBe(3);
    });
  })
});

4. ๋‹จ์œ„ ํ…Œ์ŠคํŠธ๋ž€?

๋‹จ์œ„ ํ…Œ์ŠคํŠธ(Unit Test)๋Š” ์ปดํ“จํ„ฐ ํ”„๋กœ๊ทธ๋ž˜๋ฐ์—์„œ ํŠน์ • ๋ชจ๋“ˆ์ด ์˜๋„๋œ ๋Œ€๋กœ ์ •ํ™•ํžˆ ๋™์ž‘ํ•˜๋Š”์ง€ ๊ฒ€์ฆํ•˜๋Š” ์ ˆ์ฐจ๋‹ค. ์ฆ‰, ๋ชจ๋“  ํ•จ์ˆ˜์™€ ๋ฉ”์†Œ๋“œ์— ํ…Œ์ŠคํŠธ ์ผ€์ด์Šค๋ฅผ ์ž‘์„ฑํ•˜๋Š” ์ ˆ์ฐจ๋ฅผ ๋งํ•œ๋‹ค.

๋‹จ์œ„ ํ…Œ์ŠคํŠธ์˜ ๋ชฉ์ 

  1. ์ฝ”๋“œ๊ฐ€ ์˜๋„ํ•œ ๋Œ€๋กœ ๋™์ž‘ํ•˜๋Š”์ง€ ๊ฒ€์ฆ

  2. ๋ฒ„๊ทธ๋ฅผ ์กฐ๊ธฐ์— ๊ฐ์ง€ํ•ด ์‹ ์†ํ•œ ๋ฌธ์ œ ํ•ด๊ฒฐ

  3. ์ฝ”๋“œ ๋ณ€๊ฒฝ์œผ๋กœ ์ธํ•œ ์‚ฌ์ด๋“œ ์ดํŽ™ํŠธ ์˜ˆ๋ฐฉ

  4. ์š”๊ตฌ์‚ฌํ•ญ ๋ณ€๊ฒฝ, ๋ฆฌํŒฉํ† ๋ง ์‹œ ์œ ์—ฐํ•˜๊ณ  ์•ˆ์ •์ ์ธ ๋Œ€์‘ ๊ฐ€๋Šฅ

Last updated