Skip to content

Jest & React Testing Library

yoycode edited this page Jul 27, 2023 · 5 revisions

JDesignSystem์—์„œ๋Š” Jest์™€ React Testing Library๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๊ธฐ๋Šฅ ์ค‘์‹ฌ์˜ ํ…Œ์ŠคํŠธ ์ผ€์ด์Šค๋ฅผ ์ž‘์„ฑํ•˜๊ณ , ์‚ฌ์šฉ์ž์—๊ฒŒ ์•ˆ์ •์ ์ธ ์‚ฌ์šฉ์„ฑ์„ ์ œ๊ณตํ•˜์˜€์Šต๋‹ˆ๋‹ค.

์™œ Jest์™€ React Testing Library ์ธ๊ฐ€์š”?

  1. Jest
    Jest๋Š” ๋งค์šฐ ๋น ๋ฅด๊ณ  ์•ˆ์ •์ ์ธ ํ…Œ์ŠคํŠธ ํ™˜๊ฒฝ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. Jest๋Š” ์Šค๋ƒ…์ƒท ํ…Œ์ŠคํŒ…, ๋น„๋™๊ธฐ ํ…Œ์ŠคํŒ… ๋“ฑ ๋‹ค์–‘ํ•œ ํ…Œ์ŠคํŒ… ๊ธฐ๋Šฅ์„ ์ง€์›ํ•˜๋ฉฐ, ๊ฐ„ํŽธํ•œ ์„ค์ •๊ณผ ํ•จ๊ป˜ ํ™•์žฅ์„ฑ ๋˜ํ•œ ๋†’์Šต๋‹ˆ๋‹ค.

  2. React Testing Library
    React Testing Library๋Š” ์‚ฌ์šฉ์ž ๊ฒฝํ—˜ ์ค‘์‹ฌ์˜ ํ…Œ์ŠคํŠธ๋ฅผ ๋„์™€์ฃผ๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์ž…๋‹ˆ๋‹ค. ์ด ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด, ์ปดํฌ๋„ŒํŠธ์˜ ์ƒํƒœ๊ฐ€ ์•„๋‹Œ ์‚ฌ์šฉ์ž์˜ ๊ด€์ ์—์„œ์˜ ๋™์ž‘์„ ํ…Œ์ŠคํŠธํ•  ์ˆ˜ ์žˆ์–ด, ์‹ค์ œ ์‚ฌ์šฉ ์‹œ๋‚˜๋ฆฌ์˜ค์— ๋” ๊ฐ€๊นŒ์šด ํ…Œ์ŠคํŠธ๋ฅผ ์ž‘์„ฑํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Jest์™€ React Testing Library๋ฅผ ํ•จ๊ป˜ ์‚ฌ์šฉํ•จ์œผ๋กœ์จ ํ”„๋กœ์ ํŠธ์˜ ํ…Œ์ŠคํŠธ๋ฅผ ํšจ๊ณผ์ ์œผ๋กœ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

ํ…Œ์ŠคํŠธ ๋‚ด์šฉ

JDesignSystem์€ ๊ตฌํ˜„๋ณด๋‹ค๋Š” ์‹ค์ œ ๊ธฐ๋Šฅ์— ์ง‘์ค‘ํ•˜์—ฌ ํ…Œ์ŠคํŠธ ์ผ€์ด์Šค๋ฅผ ์ž‘์„ฑํ•˜์˜€์Šต๋‹ˆ๋‹ค. ์ฝ”๋“œ์˜ ๊ตฌํ˜„ ๋ฐฉ์‹์€ ์–ธ์ œ๋“ ์ง€ ์ฝ”๋“œ ํ’ˆ์งˆ ๊ฐœ์„ ์„ ์œ„ํ•ด ๋น„๊ต์  ์‰ฝ๊ฒŒ ๋ณ€๊ฒฝ๋  ์ˆ˜ ์žˆ์ง€๋งŒ, ์ปดํฌ๋„ŒํŠธ์˜ ๊ธฐ๋Šฅ ์ž์ฒด๋Š” ์‰ฝ๊ฒŒ ๋ณ€๊ฒฝ๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์ด ์ ์„ ๊ณ ๋ คํ•˜์—ฌ, ์ €ํฌ๋Š” ๋ณ€ํ™”์— ๊ฐ•ํ•˜๊ณ  ์ง€์†๊ฐ€๋Šฅํ•œ ํ…Œ์ŠคํŠธ ์ผ€์ด์Šค ์ž‘์„ฑ์„ ๋ชฉํ‘œ๋กœ ํ•˜์˜€์Šต๋‹ˆ๋‹ค.

Clone this wiki locally