4.Playwright

E2E(End to End) Test

E2E(End-to-End) ํ…Œ์ŠคํŠธ๋Š” ์ „์ฒด ์‹œ์Šคํ…œ ๋˜๋Š” ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ํ๋ฆ„์„ ์ฒ˜์Œ๋ถ€ํ„ฐ ๋๊นŒ์ง€ ํ‰๊ฐ€ํ•˜๋Š” ์†Œํ”„ํŠธ์›จ์–ด ํ…Œ์ŠคํŠธ์˜ ํ•œ ์œ ํ˜•์ด๋‹ค. ์‹ค์ œ ์‹œ๋‚˜๋ฆฌ์˜ค์—์„œ ์‹œ์Šคํ…œ์˜ ๋™์ž‘๊ณผ ์„ฑ๋Šฅ์„ ๊ฒ€์ฆํ•˜๊ธฐ ์œ„ํ•ด ์ˆ˜ํ–‰๋œ๋‹ค. E2E ํ…Œ์ŠคํŠธ์˜ ๋ชฉํ‘œ๋Š” ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ ๋ชจ๋“  ๊ฐœ๋ณ„ ๊ตฌ์„ฑ ์š”์†Œ๊ฐ€ ์›ํ™œํ•˜๊ฒŒ ํ•จ๊ป˜ ์ž‘๋™ํ•˜๊ณ  ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์ด ๋น„์ฆˆ๋‹ˆ์Šค ์š”๊ตฌ ์‚ฌํ•ญ์„ ์ถฉ์กฑํ•˜๋Š”์ง€ ํ™•์ธํ•˜๋Š” ๊ฒƒ์ด๋‹ค.

E2E ํ…Œ์ŠคํŠธ๋Š” ์ผ๋ฐ˜์ ์œผ๋กœ ๋ผ์ด๋ธŒ ์‹œ์Šคํ…œ์—์„œ ์ˆ˜ํ–‰๋˜๋ฉฐ ์—ฌ๋Ÿฌ ์‹œ์Šคํ…œ ๋˜๋Š” ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์ด ํฌํ•จ๋  ์ˆ˜ ์žˆ๋‹ค. ์‹œ์Šคํ…œ์—์„œ ์‚ฌ์šฉ์ž์˜ ํ–‰๋™์„ ์‹œ๋ฎฌ๋ ˆ์ด์…˜ํ•˜๊ณ  ์‹œ์Šคํ…œ์ด ์˜ˆ์ƒ๋Œ€๋กœ ์ž‘๋™ํ•˜๋Š”์ง€ ํ™•์ธํ•œ๋‹ค.

E2E ํ…Œ์ŠคํŠธ๋Š” ์ˆ˜๋™์œผ๋กœ ์ˆ˜ํ–‰ํ•˜๊ฑฐ๋‚˜ ์ž๋™ํ™”๋œ ํ…Œ์ŠคํŠธ ๋„๊ตฌ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋‹ค. ์ˆ˜๋™ E2E ํ…Œ์ŠคํŠธ์—์„œ๋Š” ํ…Œ์Šคํ„ฐ๊ฐ€ ์‹œ์Šคํ…œ์˜ ๋ชจ๋“  ๋‹จ๊ณ„๋ฅผ ์ˆ˜๋™์œผ๋กœ ์ˆ˜ํ–‰ํ•˜์—ฌ ์‚ฌ์šฉ์ž์˜ ํ–‰๋™์„ ์‹œ๋ฎฌ๋ ˆ์ด์…˜ํ•œ๋‹ค. ์ด ํ”„๋กœ์„ธ์Šค๋Š” ์‹œ๊ฐ„์ด ๋งŽ์ด ์†Œ์š”๋  ์ˆ˜ ์žˆ์œผ๋ฉฐ ์ธ์  ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ•˜๊ธฐ ์‰ฝ๋‹ค. ๋ฐ˜๋ฉด์— ์ž๋™ํ™”๋œ E2E ํ…Œ์ŠคํŠธ๋Š” ๋„๊ตฌ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์‚ฌ์šฉ์ž ํ–‰๋™์„ ์‹œ๋ฎฌ๋ ˆ์ด์…˜ํ•˜๊ณ  ํ…Œ์ŠคํŠธ๋ฅผ ์ž๋™์œผ๋กœ ์ˆ˜ํ–‰ํ•œ๋‹ค. ์ด ์ ‘๊ทผ ๋ฐฉ์‹์€ ๋” ๋น ๋ฅด๊ณ  ์•ˆ์ •์ ์ด๋ฉฐ ๋™์ผํ•œ ๊ฒฐ๊ณผ๋ฅผ ๋ฐ˜๋ณต์ ์œผ๋กœ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋‹ค.

E2E ํ…Œ์ŠคํŠธ๋Š” ์†Œํ”„ํŠธ์›จ์–ด ๊ฐœ๋ฐœ ์ˆ˜๋ช… ์ฃผ๊ธฐ์—์„œ ๋งค์šฐ ์ค‘์š”ํ•œ ๋ถ€๋ถ„์ด๋‹ค. ํ†ตํ•ฉ ๋ฌธ์ œ ๋ฐ ์„ฑ๋Šฅ ๋ฌธ์ œ์™€ ๊ฐ™์ด ์‹ค์ œ ์‹œ๋‚˜๋ฆฌ์˜ค์—์„œ๋งŒ ๋ฐœ๊ฒฌํ•  ์ˆ˜ ์žˆ๋Š” ๋ฌธ์ œ๋ฅผ ์‹๋ณ„ํ•˜๋Š” ๋ฐ ๋„์›€์ด ๋œ๋‹ค. ๋˜ํ•œ ์‹œ์Šคํ…œ์ด ๋น„์ฆˆ๋‹ˆ์Šค ์š”๊ตฌ ์‚ฌํ•ญ์„ ์ถฉ์กฑํ•˜๊ณ  ์‚ฌ์šฉ์ž ๊ด€์ ์—์„œ ์˜ˆ์ƒ๋Œ€๋กœ ์ž‘๋™ํ•œ๋‹ค๋Š” ํ™•์‹ ์„ ์ œ๊ณตํ•œ๋‹ค.

Headless Chrome

ํ—ค๋“œ๋ฆฌ์Šค ํฌ๋กฌ์€ ๊ฐœ๋ฐœ์ž๊ฐ€ ํ—ค๋“œ๋ฆฌ์Šค ํ™˜๊ฒฝ, ์ฆ‰ ์‚ฌ์šฉ์ž ์ธํ„ฐํŽ˜์ด์Šค๋‚˜ GUI ์—†์ด ๊ตฌ๊ธ€ ํฌ๋กฌ ๋ธŒ๋ผ์šฐ์ €๋ฅผ ์‹คํ–‰ํ•  ์ˆ˜ ์žˆ๋Š” ๋„๊ตฌ๋‹ค. ๊ฐœ๋ฐœ์ž๋Š” ๋ธŒ๋ผ์šฐ์ €์™€ ์ˆ˜๋™์œผ๋กœ ์ƒํ˜ธ ์ž‘์šฉํ•  ํ•„์š” ์—†์ด ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๋ฐฉ์‹์œผ๋กœ ์ž๋™ํ™”๋œ ํ…Œ์ŠคํŠธ, ์›น ์Šคํฌ๋ž˜ํ•‘ ๋ฐ ๊ธฐํƒ€ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋‹ค.

ํ—ค๋“œ๋ฆฌ์Šค ํฌ๋กฌ์€ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ, CSS, HTML5 ์ง€์› ๋“ฑ ์ผ๋ฐ˜ ํฌ๋กฌ ๋ธŒ๋ผ์šฐ์ €์™€ ๋™์ผํ•œ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•œ๋‹ค. ํ•˜์ง€๋งŒ ๋ฐฑ๊ทธ๋ผ์šด๋“œ ๋ชจ๋“œ์—์„œ ์ž‘๋™ํ•˜๋ฉฐ JavaScript, Python, Ruby ๋“ฑ ๋‹ค์–‘ํ•œ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ œ์–ดํ•  ์ˆ˜ ์žˆ๋‹ค.

ํ—ค๋“œ๋ฆฌ์Šค ํฌ๋กฌ์„ ์‚ฌ์šฉํ•˜๋ฉด ๋” ๋น ๋ฅด๊ณ  ํšจ์œจ์ ์ธ ํ…Œ์ŠคํŠธ, ํ–ฅ์ƒ๋œ ํ™•์žฅ์„ฑ ๋ฐ ์•ˆ์ •์„ฑ ๋“ฑ์˜ ์ด์ ์ด ์žˆ๋‹ค. ๋ฆฌ๋ˆ…์Šค ์„œ๋ฒ„, ๋„์ปค ์ปจํ…Œ์ด๋„ˆ, ํด๋ผ์šฐ๋“œ ํ”Œ๋žซํผ ๋“ฑ ๋‹ค์–‘ํ•œ ํ™˜๊ฒฝ์—์„œ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ํ…Œ์ŠคํŠธํ•˜๋Š” ๋ฐ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค.

ํ—ค๋“œ๋ฆฌ์Šค ํฌ๋กฌ์˜ ์ธ๊ธฐ ์žˆ๋Š” ์‚ฌ์šฉ ์‚ฌ๋ก€ ์ค‘ ํ•˜๋‚˜๋Š” ์ž๋™ํ™”๋œ ํ…Œ์ŠคํŠธ๋‹ค. ๊ฐœ๋ฐœ์ž๋Š” Puppeteer ๋˜๋Š” Selenium WebDriver์™€ ๊ฐ™์€ ๋„๊ตฌ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์›น ํŽ˜์ด์ง€ ํƒ์ƒ‰, ์–‘์‹ ์ž‘์„ฑ, ๋ฒ„ํŠผ ํด๋ฆญ ๋“ฑ ๋ธŒ๋ผ์šฐ์ €์™€ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๋ฐฉ์‹์œผ๋กœ ์ƒํ˜ธ ์ž‘์šฉํ•˜๋Š” ์Šคํฌ๋ฆฝํŠธ๋ฅผ ์ž‘์„ฑํ•  ์ˆ˜ ์žˆ๋‹ค. ์ด๋Ÿฌํ•œ ์Šคํฌ๋ฆฝํŠธ๋Š” ์ง€์†์  ํ†ตํ•ฉ ํ™˜๊ฒฝ์—์„œ ์‹คํ–‰ํ•˜๊ฑฐ๋‚˜ ๋Œ€๊ทœ๋ชจ ํ…Œ์ŠคํŠธ ์Šค์œ„ํŠธ์˜ ์ผ๋ถ€๋กœ ์‹คํ–‰ํ•  ์ˆ˜ ์žˆ์œผ๋ฏ€๋กœ ๊ฐœ๋ฐœ์ž๊ฐ€ ๊ฐœ๋ฐœ ํ”„๋กœ์„ธ์Šค ์ดˆ๊ธฐ์— ๋ฌธ์ œ๋ฅผ ํŒŒ์•…ํ•  ์ˆ˜ ์žˆ๋‹ค.

ํ—ค๋“œ๋ฆฌ์Šค ํฌ๋กฌ์˜ ๋˜ ๋‹ค๋ฅธ ์‚ฌ์šฉ ์‚ฌ๋ก€๋Š” ์›น ์Šคํฌ๋ž˜ํ•‘๋‹ค. ๊ฐœ๋ฐœ์ž๋Š” Cheerio ๋˜๋Š” BeautifulSoup๊ณผ ๊ฐ™์€ ๋„๊ตฌ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์›น ํŽ˜์ด์ง€์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ์ถ”์ถœํ•˜์—ฌ ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค๋‚˜ ํŒŒ์ผ์— ์ €์žฅํ•  ์ˆ˜ ์žˆ๋‹ค. ํ—ค๋“œ๋ฆฌ์Šค ํฌ๋กฌ์€ ๋™์  ์ฝ˜ํ…์ธ ๋ฅผ ๋กœ๋“œํ•˜๊ณ  JavaScript๋ฅผ ์‹คํ–‰ํ•˜๋ฉฐ DOM์„ ์กฐ์ž‘ํ•  ์ˆ˜ ์žˆ๋Š” ๋ฐฉ๋ฒ•์„ ์ œ๊ณตํ•˜๋ฏ€๋กœ ๊ฐœ๋ฐœ์ž๋Š” ๊ธฐ์กด ์›น ์Šคํฌ๋ž˜ํ•‘ ๊ธฐ์ˆ ๋กœ๋Š” ์•ก์„ธ์Šคํ•  ์ˆ˜ ์—†๋Š” ๋ฐ์ดํ„ฐ๋ฅผ ์ถ”์ถœํ•  ์ˆ˜ ์žˆ๋‹ค.

Puppeteer

Puppeteer๋Š” ํ—ค๋“œ๋ฆฌ์Šค ํฌ๋กฌ ๋˜๋Š” ํฌ๋กฌ์„ ์ œ์–ดํ•˜๊ธฐ ์œ„ํ•œ ์ƒ์œ„ ์ˆ˜์ค€์˜ API๋ฅผ ์ œ๊ณตํ•˜๋Š” Google์—์„œ ๊ฐœ๋ฐœํ•œ Node.js ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์ด๋‹ค. ์ด๋ฅผ ํ†ตํ•ด ๊ฐœ๋ฐœ์ž๋Š” ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๋ฐฉ์‹์œผ๋กœ ์›น ํŽ˜์ด์ง€์™€ ์ƒํ˜ธ ์ž‘์šฉํ•˜๊ณ , ์‚ฌ์šฉ์ž ์ƒํ˜ธ์ž‘์šฉ์„ ์ž๋™ํ™”ํ•˜๊ณ , ์‚ฌ์šฉ์ž ์ธํ„ฐํŽ˜์ด์Šค ์—†์ด๋„ ๋ธŒ๋ผ์šฐ์ € ํ…Œ์ŠคํŠธ, ์›น ์Šคํฌ๋ž˜ํ•‘ ๋ฐ ๊ธฐํƒ€ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋‹ค.

Puppeteer๋Š” ๊ฐœ๋ฐœ์ž๊ฐ€ ์›นํŽ˜์ด์ง€ ํƒ์ƒ‰, ์Šคํฌ๋ฆฐ์ƒท ์ฐ๊ธฐ, PDF ์ƒ์„ฑ, ์‚ฌ์šฉ์ž ์ž…๋ ฅ ์‹œ๋ฎฌ๋ ˆ์ด์…˜, ์›นํŽ˜์ด์ง€์—์„œ ๋ฐ์ดํ„ฐ ์ถ”์ถœ ๋“ฑ ํ—ค๋“œ๋ฆฌ์Šค ํฌ๋กฌ์„ ์ œ์–ดํ•˜๊ณ  ์กฐ์ž‘ํ•  ์ˆ˜ ์žˆ๋Š” ์ผ๋ จ์˜ API๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

Puppeteer์˜ ์ฃผ์š” ๊ธฐ๋Šฅ

  1. ํ—ค๋“œ๋ฆฌ์Šค ์‹คํ–‰: Puppeteer๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ํ—ค๋“œ๋ฆฌ์Šค ๋ชจ๋“œ๋กœ Chrome์„ ์‹คํ–‰ํ•  ์ˆ˜ ์žˆ์œผ๋ฏ€๋กœ GUI ์—†์ด๋„ ์ž๋™ํ™”๋œ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋‹ค. ๋”ฐ๋ผ์„œ ์›น ์Šคํฌ๋ž˜ํ•‘, ํ…Œ์ŠคํŠธ, ์›น ์ƒํ˜ธ ์ž‘์šฉ ์ž๋™ํ™”์™€ ๊ฐ™์€ ์ž‘์—…์— ์ด์ƒ์ ์ด๋‹ค.

  2. ๋ธŒ๋ผ์šฐ์ €์— ๋Œ€ํ•œ ์™„์ „ํ•œ ์ œ์–ด: Puppeteer๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ๋ธŒ๋ผ์šฐ์ €๋ฅผ ์™„์ „ํžˆ ์ œ์–ดํ•  ์ˆ˜ ์žˆ์œผ๋ฏ€๋กœ ์ˆ˜๋™์œผ๋กœ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ฒ˜๋Ÿผ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๋ฐฉ์‹์œผ๋กœ ๋ธŒ๋ผ์šฐ์ €์™€ ์ƒํ˜ธ ์ž‘์šฉํ•  ์ˆ˜ ์žˆ๋‹ค.

  3. ๊ณ ๊ธ‰ API: Puppeteer๋Š” ์‚ฌ์šฉํ•˜๊ธฐ ์‰ฝ๊ณ  ๊ธฐ๋ณธ Chrome ๊ฐœ๋ฐœ์ž๋„๊ตฌ ํ”„๋กœํ† ์ฝœ ์ž‘์—…์˜ ๋ณต์žก์„ฑ์„ ์ถ”์ƒํ™”ํ•œ ์ƒ์œ„ ์ˆ˜์ค€ API๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

  4. ํ˜ธํ™˜์„ฑ: Puppeteer๋Š” Windows, macOS, Linux๋ฅผ ํฌํ•จํ•œ ๋ชจ๋“  ์ฃผ์š” ์šด์˜์ฒด์ œ์™€ ํ˜ธํ™˜๋œ๋‹ค.

  5. ๋””๋ฒ„๊น… ๊ธฐ๋Šฅ: Puppeteer๋Š” ์Šคํฌ๋ฆฐ์ƒท ๋ฐ PDF ์ƒ์„ฑ์„ ํฌํ•จํ•œ ๋‹ค์–‘ํ•œ ๋””๋ฒ„๊น… ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•˜์—ฌ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ ๋ฌธ์ œ๋ฅผ ์ง„๋‹จํ•˜๋Š” ๋ฐ ๋„์›€์„ ์ค€๋‹ค.

Puppeteer์˜ ์ผ๋ฐ˜์ ์ธ ์‚ฌ์šฉ ์‚ฌ๋ก€

  1. ์ž๋™ํ™”๋œ ํ…Œ์ŠคํŠธ: Puppeteer๋Š” ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์— ๋Œ€ํ•œ ์ž๋™ํ™”๋œ ํ…Œ์ŠคํŠธ๋ฅผ ์ž‘์„ฑํ•˜๋Š” ๋ฐ ์ด์ƒ์ ์ด๋‹ค. ์›น ํŽ˜์ด์ง€์™€ ์ƒํ˜ธ ์ž‘์šฉํ•˜๊ณ , ์‚ฌ์šฉ์ž ์ž…๋ ฅ์„ ์‹œ๋ฎฌ๋ ˆ์ด์…˜ํ•˜๊ณ , ๋””๋ฒ„๊น…์— ๋„์›€์ด ๋˜๋Š” ์Šคํฌ๋ฆฐ์ƒท์„ ์บก์ฒ˜ํ•˜๊ธฐ ์œ„ํ•œ API๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

  2. ์›น ์Šคํฌ๋ž˜ํ•‘: Puppeteer๋Š” ์›น์‚ฌ์ดํŠธ์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ์Šคํฌ๋ž˜ํ•‘ํ•˜๋Š” ๋ฐ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค. ์›น ํŽ˜์ด์ง€๋กœ ์ด๋™ํ•˜๊ณ , DOM์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ์ถ”์ถœํ•˜๊ณ , ํŒŒ์ผ์ด๋‚˜ ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค์— ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•˜๊ธฐ ์œ„ํ•œ API๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

  3. ์ž๋™ํ™”๋œ UI ํ…Œ์ŠคํŠธ: Puppeteer๋Š” ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์— ๋Œ€ํ•œ ์ž๋™ํ™”๋œ UI ํ…Œ์ŠคํŠธ๋ฅผ ์ˆ˜ํ–‰ํ•˜๋Š” ๋ฐ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค. ๋ฒ„ํŠผ ํด๋ฆญ ๋ฐ ์–‘์‹ ์ž‘์„ฑ๊ณผ ๊ฐ™์€ ์‚ฌ์šฉ์ž ์ƒํ˜ธ ์ž‘์šฉ์„ ์‹œ๋ฎฌ๋ ˆ์ด์…˜ํ•˜๊ธฐ ์œ„ํ•œ API๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

Playwright

Playwright๋Š” ์—ฌ๋Ÿฌ ๋ธŒ๋ผ์šฐ์ €์—์„œ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ์ž๋™ํ™”ํ•˜๊ณ  ํ…Œ์ŠคํŠธํ•˜๊ธฐ ์œ„ํ•œ ์ƒ์œ„ ์ˆ˜์ค€ API๋ฅผ ์ œ๊ณตํ•˜๋Š” Microsoft์—์„œ ๊ฐœ๋ฐœํ•œ ์˜คํ”ˆ ์†Œ์Šค Node.js ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์ด๋‹ค. ์ด ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋Š” Chromium, Firefox, WebKit ๊ธฐ๋ฐ˜ ๋ธŒ๋ผ์šฐ์ €(Safari ๋ฐ Edge)๋ฅผ ์ง€์›ํ•œ๋‹ค. Playwright๋Š” ๊ธฐ์กด ํ…Œ์ŠคํŠธ ํ”„๋ ˆ์ž„์›Œํฌ์— ๋น„ํ•ด ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๋” ์•ˆ์ •์ ์ด๊ณ  ๋น ๋ฅด๊ฒŒ ํ…Œ์ŠคํŠธํ•  ์ˆ˜ ์žˆ๋Š” ๋ฐฉ๋ฒ•์„ ์ œ๊ณตํ•˜๋„๋ก ์„ค๊ณ„๋˜์—ˆ๋‹ค.

Playwright๋Š” ๊ฐœ๋ฐœ์ž๊ฐ€ ๋ธŒ๋ผ์šฐ์ € ์ž๋™ํ™”, ์›น ์Šคํฌ๋ž˜ํ•‘ ๋ฐ ํ…Œ์ŠคํŠธ์™€ ๊ฐ™์€ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋Š” ์ผ๋ จ์˜ API๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

Playwright์˜ ์ฃผ์š” ๊ธฐ๋Šฅ

  1. ํฌ๋กœ์Šค ๋ธŒ๋ผ์šฐ์ € ํ…Œ์ŠคํŠธ: Playwright๋Š” ํฌ๋กฌ, ํŒŒ์ด์–ดํญ์Šค, ์›นํ‚ท ๊ธฐ๋ฐ˜ ๋ธŒ๋ผ์šฐ์ € ๋“ฑ ์—ฌ๋Ÿฌ ๋ธŒ๋ผ์šฐ์ €๋ฅผ ์ง€์›ํ•˜๋ฏ€๋กœ ์—ฌ๋Ÿฌ ํ”Œ๋žซํผ์—์„œ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ํ…Œ์ŠคํŠธํ•  ์ˆ˜ ์žˆ๋‹ค.

  2. ์†๋„: Playwright๋Š” ํ…Œ์ŠคํŠธ ์‹คํ–‰ ์†๋„๋ฅผ ๋†’์ผ ์ˆ˜ ์žˆ๋Š” ๋ณ‘๋ ฌ ์ฒ˜๋ฆฌ ๋ฐ ์Šค๋งˆํŠธ ๋Œ€๊ธฐ ๋ฉ”์ปค๋‹ˆ์ฆ˜์ด ๋‚ด์žฅ๋˜์–ด ์žˆ์–ด ๊ธฐ์กด ํ…Œ์ŠคํŠธ ํ”„๋ ˆ์ž„์›Œํฌ๋ณด๋‹ค ๋” ๋น ๋ฅด๊ฒŒ ์„ค๊ณ„๋˜์—ˆ๋‹ค.

  3. ์‹ ๋ขฐ์„ฑ: Playwright๋Š” ํ…Œ์ŠคํŠธ ์‹คํŒจ ์‹œ ์ž๋™ ์žฌ์‹œ๋„, ์ž๋™ ์˜ค๋ฅ˜ ๊ฐ์ง€ ๋ฐ ๋””๋ฒ„๊น… ๊ธฐ๋Šฅ๊ณผ ๊ฐ™์€ ๊ธฐ๋Šฅ์„ ํ†ตํ•ด ์•ˆ์ •์„ฑ์„ ์—ผ๋‘์— ๋‘๊ณ  ์„ค๊ณ„๋˜์—ˆ๋‹ค.

  4. ํ•˜์ด๋ ˆ๋ฒจ API: Playwright๋Š” ์‚ฌ์šฉํ•˜๊ธฐ ์‰ฝ๊ณ  ๊ธฐ๋ณธ ๋ธŒ๋ผ์šฐ์ € ๊ฐœ๋ฐœ์ž ๋„๊ตฌ ํ”„๋กœํ† ์ฝœ ์ž‘์—…์˜ ๋ณต์žก์„ฑ์„ ์ถ”์ƒํ™”ํ•œ ํ•˜์ด๋ ˆ๋ฒจ API๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

  5. ํ—ค๋”ฉ ๋ฐ ํ—ค๋“œ๋ฆฌ์Šค ๋ชจ๋“œ: Playwright๋Š” ํ—ค๋”ฉ ๋ชจ๋“œ์™€ ํ—ค๋“œ๋ฆฌ์Šค ๋ชจ๋“œ๋ฅผ ๋ชจ๋‘ ์ง€์›ํ•˜๋ฏ€๋กœ ์‚ฌ์šฉ์ž ์ธํ„ฐํŽ˜์ด์Šค๋ฅผ ์‚ฌ์šฉํ•˜๊ฑฐ๋‚˜ ์‚ฌ์šฉํ•˜์ง€ ์•Š๊ณ  ํ…Œ์ŠคํŠธ๋ฅผ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋‹ค.

Playwright์˜ ์ผ๋ฐ˜์ ์ธ ์‚ฌ์šฉ ์‚ฌ๋ก€

  1. ์—”๋“œํˆฌ์—”๋“œ ํ…Œ์ŠคํŠธ: Playwright๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์—ฌ๋Ÿฌ ๋ธŒ๋ผ์šฐ์ €์—์„œ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์— ๋Œ€ํ•œ ์—”๋“œํˆฌ์—”๋“œ ํ…Œ์ŠคํŠธ๋ฅผ ์ž‘์„ฑํ•˜์—ฌ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์ด ์—ฌ๋Ÿฌ ํ”Œ๋žซํผ์—์„œ ์˜ˆ์ƒ๋Œ€๋กœ ์ž‘๋™ํ•˜๋Š”์ง€ ํ™•์ธํ•  ์ˆ˜ ์žˆ๋‹ค.

  2. ์›น ์Šคํฌ๋ž˜ํ•‘: Playwright๋Š” ์—ฌ๋Ÿฌ ๋ธŒ๋ผ์šฐ์ €๋ฅผ ์ง€์›ํ•˜์—ฌ ์›น ์‚ฌ์ดํŠธ์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ์Šคํฌ๋ž˜ํ•‘ํ•˜๋Š” ๋ฐ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ๊ธฐ์กด ์Šคํฌ๋ž˜ํ•‘ ๋„๊ตฌ๋กœ๋Š” ์Šคํฌ๋ž˜ํ•‘ํ•˜๊ธฐ ์–ด๋ ค์šด ์‚ฌ์ดํŠธ์—์„œ๋„ ๋ฐ์ดํ„ฐ๋ฅผ ์‰ฝ๊ฒŒ ์Šคํฌ๋ž˜ํ•‘ํ•  ์ˆ˜ ์žˆ๋‹ค.

  3. ์ž๋™ํ™”๋œ UI ํ…Œ์ŠคํŠธ: Playwright๋Š” ํ—ค๋“œ๋ฆฌ์Šค ๋ชจ๋“œ์™€ ํ—ค๋”ฉ ๋ชจ๋“œ๋ฅผ ์ง€์›ํ•˜์—ฌ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ UI ํ…Œ์ŠคํŠธ๋ฅผ ์ž๋™ํ™”ํ•˜๋Š” ๋ฐ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ์‚ฌ์šฉ์ž ์ธํ„ฐํŽ˜์ด์Šค๋ฅผ ๋” ์‰ฝ๊ฒŒ ํ…Œ์ŠคํŠธํ•  ์ˆ˜ ์žˆ๋‹ค.

CodeceptJS

CodeceptJS๋Š” WebDriverIO, Puppeteer, Playwright์™€ ๊ฐ™์€ ์ธ๊ธฐ ์žˆ๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ๊ธฐ๋ฐ˜์œผ๋กœ ๊ตฌ์ถ•๋œ Node.js์šฉ ์ตœ์‹  ์—”๋“œํˆฌ์—”๋“œ ํ…Œ์ŠคํŠธ ํ”„๋ ˆ์ž„์›Œํฌ๋‹ค. ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์— ๋Œ€ํ•œ ์ž๋™ํ™”๋œ ํ…Œ์ŠคํŠธ๋ฅผ ์ƒ์„ฑํ•˜๋Š” ํ”„๋กœ์„ธ์Šค๋ฅผ ๊ฐ„์†Œํ™”ํ•˜๊ณ  ๋Šฅ๋ฅ ํ™”ํ•˜๋„๋ก ์„ค๊ณ„๋˜์—ˆ๋‹ค. CodeceptJS๋Š” ๊ฐ„๋‹จํ•˜๊ณ  ๊ฐ•๋ ฅํ•œ ๊ตฌ๋ฌธ์„ ์ œ๊ณตํ•˜๋ฏ€๋กœ ๊ฐœ๋ฐœ์ž๋Š” ์ฝ๊ณ  ์ดํ•ดํ•˜๊ธฐ ์‰ฌ์šด ์ž์—ฐ์–ด๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ํ…Œ์ŠคํŠธ๋ฅผ ์ž‘์„ฑํ•  ์ˆ˜ ์žˆ๋‹ค.

CodeceptJS์˜ ์ฃผ์š” ๊ธฐ๋Šฅ

  1. ์‰ฌ์šด ์‚ฌ์šฉ: CodeceptJS๋Š” ํ…Œ์ŠคํŠธ๋ฅผ ์‰ฝ๊ฒŒ ์ž‘์„ฑํ•˜๊ณ  ์œ ์ง€ ๊ด€๋ฆฌํ•  ์ˆ˜ ์žˆ๋Š” ๊ฐ„๋‹จํ•˜๊ณ  ๊ฐ•๋ ฅํ•œ ๊ตฌ๋ฌธ์œผ๋กœ ์‚ฌ์šฉ๊ณผ ํ•™์Šต์ด ์‰ฝ๋‹ค.

  2. ์—ฌ๋Ÿฌ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ ์ง€์›: CodeceptJS๋Š” WebDriverIO, Puppeteer, Playwright์™€ ๊ฐ™์€ ์—ฌ๋Ÿฌ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์ง€์›ํ•˜๋ฏ€๋กœ ๋‹ค์–‘ํ•œ ์œ ํ˜•์˜ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์— ๋Œ€ํ•œ ํ…Œ์ŠคํŠธ๋ฅผ ์‰ฝ๊ฒŒ ์ž‘์„ฑํ•  ์ˆ˜ ์žˆ๋‹ค.

  3. ์ธ๊ธฐ ๋„๊ตฌ์™€ ํ†ตํ•ฉ: CodeceptJS๋Š” Mocha, Chai, TypeScript์™€ ๊ฐ™์€ ์ธ๊ธฐ ๋„๊ตฌ์™€ ํ†ตํ•ฉ๋˜์–ด ๊ธฐ์กด ๊ฐœ๋ฐœ ์›Œํฌํ”Œ๋กœ์— ํ…Œ์ŠคํŠธ๋ฅผ ์‰ฝ๊ฒŒ ํ†ตํ•ฉํ•  ์ˆ˜ ์žˆ๋‹ค.

  4. ๋นŒํŠธ์ธ ํ—ฌํผ: CodeceptJS๋Š” ์–‘์‹๊ณผ์˜ ์ƒํ˜ธ ์ž‘์šฉ, ๋ฒ„ํŠผ ํด๋ฆญ, ํŽ˜์ด์ง€ ๊ฐ„ ํƒ์ƒ‰๊ณผ ๊ฐ™์€ ์ž‘์—…์„ ๊ฐ„์†Œํ™”ํ•˜๋Š” ๋‹ค์–‘ํ•œ ๊ธฐ๋ณธ ์ œ๊ณต ํ—ฌํผ๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

  5. ๋ณ‘๋ ฌ ์‹คํ–‰: CodeceptJS๋Š” ํ…Œ์ŠคํŠธ์˜ ๋ณ‘๋ ฌ ์‹คํ–‰์„ ์ง€์›ํ•˜๋ฏ€๋กœ ํ…Œ์ŠคํŠธ๋ฅผ ๋” ๋น ๋ฅด๊ณ  ํšจ์œจ์ ์œผ๋กœ ์‹คํ–‰ํ•  ์ˆ˜ ์žˆ๋‹ค.

  6. ๊ฐ•๋ ฅํ•œ ๋ณด๊ณ : CodeceptJS๋Š” ์Šคํฌ๋ฆฐ์ƒท๊ณผ ์ž์„ธํ•œ ์˜ค๋ฅ˜ ๋ฉ”์‹œ์ง€๋ฅผ ํฌํ•จํ•˜์—ฌ ํ…Œ์ŠคํŠธ ์ƒํƒœ๋ฅผ ์‰ฝ๊ฒŒ ์ถ”์ ํ•  ์ˆ˜ ์žˆ๋Š” ๊ฐ•๋ ฅํ•œ ๋ณด๊ณ  ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•œ๋‹ค.

CodeceptJS์˜ ์ผ๋ฐ˜์ ์ธ ์‚ฌ์šฉ ์‚ฌ๋ก€

  1. ์—”๋“œํˆฌ์—”๋“œ ํ…Œ์ŠคํŠธ: CodeceptJS๋Š” ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ ์—”๋“œํˆฌ์—”๋“œ ํ…Œ์ŠคํŠธ๋ฅผ ์œ„ํ•ด ์„ค๊ณ„๋˜์–ด ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์ด ๋‹ค์–‘ํ•œ ๋ธŒ๋ผ์šฐ์ €์™€ ํ”Œ๋žซํผ์—์„œ ์˜ˆ์ƒ๋Œ€๋กœ ์ž‘๋™ํ•˜๋Š”์ง€ ํ™•์ธํ•  ์ˆ˜ ์žˆ๋‹ค.

  2. ์ž๋™ํ™”๋œ UI ํ…Œ์ŠคํŠธ: CodeceptJS๋Š” ์–‘์‹ ์ œ์ถœ, ๋ฒ„ํŠผ ํด๋ฆญ, ํƒ์ƒ‰๊ณผ ๊ฐ™์€ UI ํ…Œ์ŠคํŠธ ์ž‘์—…์„ ์‰ฝ๊ฒŒ ์ž๋™ํ™”ํ•  ์ˆ˜ ์žˆ๋Š” ๋‹ค์–‘ํ•œ ๋นŒํŠธ์ธ ํ—ฌํผ๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

  3. ํ†ตํ•ฉ ํ…Œ์ŠคํŠธ: ํ†ตํ•ฉ ํ…Œ์ŠคํŠธ์— CodeceptJS๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ ์—ฌ๋Ÿฌ ๊ตฌ์„ฑ ์š”์†Œ ๊ฐ„์˜ ์ƒํ˜ธ ์ž‘์šฉ์„ ํ…Œ์ŠคํŠธํ•  ์ˆ˜ ์žˆ๋‹ค.

  4. API ํ…Œ์ŠคํŠธ: CodeceptJS๋Š” SuperTest์™€ ๊ฐ™์€ ์ธ๊ธฐ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์ง€์›ํ•˜์—ฌ API ํ…Œ์ŠคํŠธ์—๋„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค.

Last updated