the-zero ν μ€νΈ μ½λλ₯Ό μμ±νλ©°
the-zero ν μ€νΈ μ½λλ₯Ό μμ±νλ©°
Nov 26, 2023
λ€μ΄κ°λ©°
the-zero λ°±μλλ₯Ό λ΄λΉνλ©΄μ μμ±νκ² λ ν μ€νΈ μ½λμ λν΄ κ³΅μ νλ μκ°μ κ°μ Έλ³΄λ € ν©λλ€.
ν μ€νΈ μ½λλ₯Ό μμ±νκ² λ μ΄μ
ν μ€νΈ μ½λλ₯Ό μμ±νκ² λ μ΄μ λ μλ λ κ°μ§ λλ¬Έμ λλ€.
- the-zero μ ν리μΌμ΄μ μ μ λ’°μ±
- μ΄ μ½λλ₯Ό λ³΄κ² λ λ―Έλμ κ·Έλ£Ήμκ³Ό λ―Έλμ λλ₯Ό μν΄μ
μ λ’°μ±
- μ λμνλ μ ν리μΌμ΄μ μ λ§λ€μλ€.
- μΌμ μ μ«κΈ°λλΌ λ§μμ λ€μ§ μλ μ½λλ₯Ό μμ νκ³ μΆμ§λ§ μ λμνλ μ ν리μΌμ΄μ μ΄ κ³ μ₯λ κΉ κ±±μ νλ©° 리ν©ν°λ§μ 미룬λ€.
- κΈνκ² λ€μ λ²μ κΈ°λ₯ μΆκ°, μμ μ μν΄ μ½λλ₯Ό μΆκ°νλ€.
- κΈ°μ‘΄ μ½λμ μλ‘μ΄ κΈ°λ₯μ νλ μ½λκ° μ½νκ³ μ€ν€λ©° 볡μ‘ν΄μ§λ€.
- κΈ°μ‘΄ κΈ°λ₯κ³Ό μλ‘μ΄ κΈ°λ₯μ΄ μ λμνλμ§ ν μ€νΈνλ€.
- κΈ°μ‘΄ κΈ°λ₯μμ μ€λ₯κ° λ°μνλ€. μλ‘μ΄ κΈ°λ₯ μ½λλ₯Ό μμ νλ€.
- μλ‘μ΄ κΈ°λ₯μμ μ€λ₯κ° λ°μνλ€. κΈ°μ‘΄ κΈ°λ₯ μ½λλ₯Ό μμ νλ€.
- κΈ°μ‘΄ κΈ°λ₯, μλ‘μ΄ κΈ°λ₯μ μλ²½ν κ³ μ³€μ§λ§ μκ°μ΄ λ무 λ§μ΄ μ§λ¬κ³ μ½λλ₯Ό 보λ λ μλ§μ§μ°½μ΄ λμ΄λ²λ Έλ€.
μμ κ°μ κ²½μ°λ μ€λ¬΄μμ μλΉν λ§μ΄ μ νκ² λ©λλ€. ν μ€νΈ μ½λλ₯Ό μμ±νλ©΄ μ ν리μΌμ΄μ μ μ λ’°μ±μ λν μ΅μνμ μμ μ₯μΉλ₯Ό ν보ν μ μμ΅λλ€.
μ¬μ΄λ μ΄ννΈ μ΅μν, κΈ°λ₯ μΆκ°, μμ , 리ν©ν°λ§μ λν μ΅μνμ μμ μ₯μΉ ν보λ₯Ό ν΅ν΄ ν μ€νΈ μ½λλ μ ν리μΌμ΄μ μ λ’°μ±μ λν νΌλλ°±μ λΉ λ₯΄κ² μ»μμΌλ‘μ¨(μ±κ³΅ νΉμ μ€ν¨), μ½λ 리ν©ν°λ§λ λ μ κ·Ήμ μ΄κ² λ©λλ€. κ·Έλ¦¬κ³ μ΄λ¬ν κ²°κ³Όλ μ ν리μΌμ΄μ μ μ λ’°μ±μ λνκ² λ©λλ€.
μ½λλ₯Ό 보κ²λ λ―Έλμ κ·Έλ£Ήμκ³Ό λ―Έλμ λλ₯Ό μν΄μ
- ν¨μ νλνλ, κΈ°λ₯ νλνλμ μΌμΌμ΄ μ£Όμμ λ¬ νμ μμ΄ κΉλνκ³ μ΄ν΄νκΈ° μ’μ μ½λ
- μ μ§μ¬μ§ ν μ€νΈ μ½λ
μ λ κ°μ§κ° κ°μΆ°μ§λ€λ©΄ λ―Έλμ κ·Έλ£Ήμ νΉμ λ―Έλμ λ΄κ° μ΄λ€ κΈ°λ₯μ νλ μ½λμΈμ§ μ½κ² μ μ μλλ‘ λμμ€λλ€.
ν μ€νΈ μ½λλ₯Ό μμ±νλ€ λ³΄λ©΄ ν¨μκ° μλΉν μκ² μͺΌκ°μ ΈμΌ νκ³ , νλμ κΈ°λ₯λ§ ν΄μΌ νλ€λ μ¬μ€μ μκ² λ©λλ€. κ·Έλ¦¬κ³ μ΄λ° μ½λλ λ€λ₯Έ μ¬λμ΄ μ΄ν΄νκΈ° μ¬μ΄ μ½λλ‘ λ°μ νκ² λ©λλ€.
μλ²½νμ§ μλλΌλ μ½λμ λν΄ μ κ²½ μ°κ³ κ³ λ―Όνλ λ Έλ ₯ μμ²΄κ° λ―Έλμ λ³ΈμΈ νΉμ λ€λ₯Έ μ¬λμ΄ μ½λλ₯Ό μ΄ν΄νλλ° μΆ©λΆν λμμ μ€ μ μμ΅λλ€.
ν μ€νΈ μ½λλ? ν μ€νΈ μ½λλ₯Ό μμ±ν΄μΌ νλ μ΄μ
ν μ€νΈ μ½λμ λν μ μ λ° κ΄λ ¨ λ΄μ©μ κ²μνλ©΄ μ’μ λ΄μ©μ΄ λ§μ΄ λμ΅λλ€.
μ λ Kent C. Doddsμ Static vs Unit vs Integration vs E2E Testing for Frontend Appsμ κΈμ μ°Έκ³ νμμ΅λλ€.
static-vs-unit-vs-integration-vs-e2e-tests
μ»μ κ²
- μ¬κ³ μ νμ₯ μ λ ν μ€νΈλ₯Ό νκΈ° μν΄μλ ν¨μλ νλμ κΈ°λ₯μ νλλ‘ ν΄μΌ ν©λλ€. ν μ€νΈ μ½λλ₯Ό μμ±νλ€ λ³΄λ©΄ μ΄λ»κ² νλ©΄ μ’μμ§ κ³ λ―Όνκ² λ§λλλ° μ΄λ° κ³ λ―Όμ ν μ μλ νκ²½μ΄ λ§λ€μ΄μ§λ μμ²΄κ° μ₯μ μ λλ€.
- λ²κ·Έλ₯Ό λ°κ²¬νκ³ μ¬μ΄λ μ΄ννΈ μμ΄ λΉ λ₯΄κ² μμ ν μ μμ΅λλ€. ν μ€νΈ μ½λκ° λͺ¨λ μ ν리μΌμ΄μ μ λ²κ·Έλ₯Ό 컀λ²νμ§λ λͺ»ν©λλ€. νμ§λ§ ν μ€νΈ μ½λλ₯Ό μμ±νκ² λλ©΄ μ ν리μΌμ΄μ μ ν μ€νΈ 컀λ²λ¦¬μ§κ° λμμ§κ² λκ³ μ ν리μΌμ΄μ μ μ λ’°μ±μ λν μ μμ΅λλ€.
- μ ν리μΌμ΄μ μ λν μ λ’°μ±μ΄ μκΈ° λλ¬Έμ λ€μν μλλ₯Ό ν΄λ³Ό μ μμ΅λλ€.(리ν©ν°λ§, λ μ’μ μμ΄λμ΄ λ‘μ§) ν μ€νΈ μ½λλ λ΄κ° μμ μ κ°ν λΆλΆμ λν νΌλλ°±(μ±κ³΅, μ€ν¨)μ λΉ λ₯΄κ² νμΈν μ μκΈ° λλ¬Έμ μ΄λ€ λΆλΆμμ μ½λκ° μλͺ»λμλμ§ λΉ λ₯΄κ² μΊμΉν μ μμ΅λλ€.
κ³ λ €ν΄μΌ ν κ²

Static vs Unit vs Integration vs E2E Testing for Frontend Appsμμλ ν μ€νΈ μ½λλ₯Ό μμ±ν λ κ³ λ €ν΄μΌ ν κ²λ€μ ν μ€νΈ νΌλΌλ―Έλ κ·Έλ¦Όμ ν΅ν΄ μ€λͺ ν©λλ€.
νΈλ μ΄λ μ€ν(trade-off): μλ²½ν κ²μ μλ€. μμν κΌΌκΌΌνκ² νμΈνΈλ₯Ό μΉ νλ©΄μ(νμͺ½μΌλ‘ νΈν₯λμ§ μμ μ μ ν λΉμ¨μ ν μ€νΈ μ½λ) μμ±λλ₯Ό λμ¬μΌ ν©λλ€.
- λΉμ©: μ κ·Έλ¦Όμμ μ μ μλ―μ΄ E2Eμμ μλΉν λ§μ λΉμ©μ΄ λ λ€λ κ²μ μ μ μμ΅λλ€. μ€μ λ‘ cypress μ½λλ₯Ό μμ±ν λ μκ°μ΄ κ½€ λ§μ΄ κ±Έλ ΈμΌλ©° νλ©΄λ¨μ μ¦μ μμ μΌλ‘ μΈν΄ Selectorλ κ°μ΄ μμ ν΄μΌ νλ λ²κ±°λ‘μμ΄ μ‘΄μ¬νμ΅λλ€. νμ§λ§ μμ±λ μ ν리μΌμ΄μ μ ν μ€νΈνλ κ²μ΄λ―λ‘ ν μ€νΈ κ²°κ³Όμ λν μ λ’°μ±μ νμ€νλ€κ³ ν©λλ€.
- μκ°, μλ: jest(unit, integration ν μ€νΈ)λ³΄λ€ cypress(e2e)λ₯Ό ν μ€νΈνκΈ° μν μ½λ μμ±μ μκ°μ λ§μ΄ μ°κ² λ©λλ€. λν ν μ€νΈλ₯Ό μ€νν λ e2e ν μ€νΈλ μ€μ μ ν리μΌμ΄μ μ ꡬλ ν ν μ€νΈ νλ―λ‘ unit ν μ€νΈ λ³΄λ€ μλλ λλ €μ§κ² λ©λλ€.
- λΉμ©κ³Ό μκ°, μλμ trade-off: μΌλ°μ μΌλ‘ λ§μ μ¬λλ€μ ν μ€νΈ νΌλΌλ―Έλμ μΈκΈλ κ² μ²λΌ λΉμ©κ³Ό μλμ trade-offμ λν΄ λ§μ΄ μ΄μΌκΈ° ν©λλ€. νμ§λ§ μ΄ trade-offλ§ μλ€λ©΄ ν μ€ν νΌλΌλ―Έλλ₯Ό κ³ λ €ν λ unit testλ‘λ§ 100% μμ±ν΄μΌ ν©λλ€. λ¬Όλ‘ μ΄λ κ² νλ©΄ μλκ³ ν μ€νΈκ° μννΈμ¨μ΄ μ¬μ© λ°©μκ³Ό μ μ¬ν μλ‘ λ λ§μ μ λ’°, μμ κ°μ μ»μ μ μκΈ° λλ¬Έμ μΆ©λΆν κ³ λ €νμ¬ λ³΅ν©μ μΌλ‘ μμ±λμ΄μΌ ν©λλ€.
λ§μΉλ©°
κ°μΈμ μΌλ‘ ν μ€νΈ μ½λλ₯Ό μμ±νκ² λ μ΄μ νλκ° λ μλλ°μ, λ°λ‘ μ μ ν μ€νΈ λ₯λ ₯μ μ λ’°ν μ μμ΄μμ λλ€.
μ΄λ€ κΈ°λ₯μ λ€ λ§λ€μκ³ ν μ€νΈλ₯Ό μλ²½νκ² νλ€κ³ μκ°νμ§λ§ λ§μ λ§μ μ¬λλ€μ΄ μ¬μ©νκ² λκ±°λ μκ°μ΄ μ’ μ§λμ λ―Έμ² μ²΄ν¬νμ§ λͺ»ν λ²κ·Έλ€μ΄ λ°κ²¬λλ κ²½μ°λ₯Ό λ§μ΄ κ²½ννμ΅λλ€.
μ ν¬μ κ°μ κ²½νμ΄ μμΌμλ€λ©΄ νμ¬ μ§ννκ³ κ³μλ νλ‘μ νΈμ ν μ€νΈ μ½λλ₯Ό λμ ν΄λ³΄μλ©΄ μ’μ κ² κ°μ΅λλ€.
μ°Έκ³ λ¬Έμ