{"id":16767,"date":"2026-03-27T15:50:31","date_gmt":"2026-03-27T06:50:31","guid":{"rendered":"http:\/\/www.gisdeveloper.co.kr\/?p=16767"},"modified":"2026-03-27T16:03:38","modified_gmt":"2026-03-27T07:03:38","slug":"playwright%eb%a5%bc-%ec%9d%b4%ec%9a%a9%ed%95%9c-%ec%9b%b9%ec%95%b1-%ed%85%8c%ec%8a%a4%ed%8a%b8","status":"publish","type":"post","link":"http:\/\/www.gisdeveloper.co.kr\/?p=16767","title":{"rendered":"PlayWright\ub97c \uc774\uc6a9\ud55c \uc6f9\uc571 \ud14c\uc2a4\ud2b8"},"content":{"rendered":"<p>\ud50c\ub808\uc774\ub77c\uc774\ud2b8\ub294 \uc6f9\uc571\uc5d0 \ub300\ud55c \ud14c\uc2a4\ud2b8 \uc790\ub3d9\ud654 \ub77c\uc774\ube0c\ub7ec\ub9ac\ub85c JS \ucf54\ub4dc(\ub610\ub294 TS)\ub85c \ud14c\uc2a4\ud2b8\ub97c \uc791\uc131\ud560 \uc218 \uc788\ub2e4. \ubc14\uc774\ube0c \ucf54\ub529 \uc2dc \uae30\ub2a5\uc5d0 \ub300\ud55c \ud14c\uc2a4\ud2b8\ub97c AI \ud1b5\ud574 \ud558\uace0\uc790\ud560\ub54c \ub9e4\uc6b0 \uc720\uc6a9\ud55c\ub370, \uc6f9\ube0c\ub77c\uc6b0\uc800\uc758 \ud2b9\uc815 \ubc84\ud2bc\uc744 AI\uac00 \ud074\ub9ad\ud558\uace0 \uadf8 \uacb0\uacfc\uac00 \uae30\ub300\ud55c \uac83\uc640 \uac19\uc740\uc9c0\uc5d0 \ub300\ud55c \uc778\ud130\ub809\ud2f0\ube0c\ud55c \ud589\ub3d9 \ud14c\uc2a4\ud2b8\ub3c4 \uac00\ub2a5\ud558\ub2e4. \uc6b0\uc640, \uba87\ub2ec \uc804\uae4c\uc9c0\ub9cc \ud574\ub3c4 \uc774\ub7f0\uac74 \uc0ac\ub78c\uc758 \uc601\uc5ed\uc774\ub77c \uc0dd\uac01\ud588\ub2e4. \ud558\ub098\uc529 \ud558\ub098\uc529 \uc778\uac04\uc758 \ub9cc\uc6a9\uc744 AI\ub294 \ubc15\uc0b4\ub0b4\uace0 \uc788\ub2e4. \uacb8\uc190 \uacb8\uc190&#8230;<\/p>\n<p>\ud50c\ub808\uc774\ub77c\uc774\ud2b8\uc758 \ubaa9\uc801\uc774 \ud2b9\uc815 \uc6f9\uc571\uc5d0 \ub300\ud55c \ud14c\uc2a4\ud2b8\uc5d0 \uc788\ub2e4. \uc989, \ud14c\uc2a4\ud2b8\ub97c \uc704\ud55c \ub3c5\ub9bd\ub41c \ud504\ub85c\uc81d\ud2b8\ub97c \uad6c\uc131\ud560 \uc218 \uc788\ub2e4. \uba85\ub839\uc740 \ub2e4\uc74c\uacfc \uac19\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"bash\">\r\nnpm init playwright@latest\r\n<\/pre>\n<p>\uc704\uc758 \uba85\ub839\uc774 \uc2e4\ud589\ub418\uba74 \uc778\uac04\uc740 \ub2e4\uc74c\uacfc \uac19\uc740 \ub0b4\uc6a9\uc744 \uc785\ub825\ud574\uc57c \ud55c\ub2e4. (\uc74c.. AI\ub97c \uc5d0\uc774\uc804\ud2b8\ub77c\uace0 \ubd80\ub978\ub2e4\uba74 \uc778\uac04\uc740 \uc5b4\ub5bb\uac8c \ubd88\ub7ec\uc57c \uad6c\ubd84\uc774 \ub420\uae4c? \uac1c\ubc1c\uc790\ub77c\uace0 \ud558\uae30\uc5d4 AI \uc5ed\uc2dc \ucf54\ub529\uc744 \uc791\uc131\ud558\ubbc0\ub85c \uac1c\ubc1c\uc790\uac00 \uc544\ub2cc\uac8c \uc544\ub2c8\ub2c8..)<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"bash\">\r\nInitializing project in '.'\r\n\u2714 Do you want to use TypeScript or JavaScript? \u00b7 TypeScript\r\n\u2714 Where to put your end-to-end tests? \u00b7 tests\r\n\u2714 Add a GitHub Actions workflow? (Y\/n) \u00b7 false\r\n\u2714 Install Playwright browsers (can be done manually via 'npx playwright install')? (Y\/n) \u00b7 true\r\n<\/pre>\n<p>\ud14c\uc2a4\ud2b8 \ud504\ub85c\uc81d\ud2b8\ub97c \uc704\ud55c \ud30c\uc77c\ub4e4\uc774 \uc790\ub3d9\uc73c\ub85c \uad6c\uc131\ub418\ub294\ub370, \uc5ec\uae30\uc11c \ud14c\uc2a4\ud2b8\ub97c \uc704\ud55c \ucf54\ub4dc \uc791\uc131\uc740 tests \ud3f4\ub354(\uc55e\uc11c \uc778\uac04\uc774 \uc785\ub825\ud55c \uac12)\uc5d0 example.spec.ts \ud30c\uc77c\uc774 \ubcf4\uc774\ub294\ub370, \uadf8\ub0e5 \uc774 \ud30c\uc77c\uc5d0 \ud14c\uc2a4\ud2b8 \ucf54\ub4dc\ub97c \uc785\ub825\ud558\uba74 \ub41c\ub2e4. \uc774\ubbf8 \ud14c\uc2a4\ud2b8\ub85c \uc798 \uc798\ub3d9\ud558\ub294 \ud14c\uc2a4\ud2b8 \ucf54\ub4dc\uac00 \uc788\ub294\ub370, \uadf8\uac74 \uc9c0\uc6b0\uace0 \ub2e4\uc74c\uacfc \uac19\uc740 \ucf54\ub4dc\ub97c \uc791\uc131\ud574 \ud14c\uc2a4\ud2b8\ud574 \ubcf4\uc558\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"ts\">\r\nimport { test, expect } from '@playwright\/test';\r\nimport { chromium } from '@playwright\/test';\r\n\r\ntest('login', async () => {\r\n  const browser = await chromium.launch({\r\n    headless: false,\r\n    args: [\r\n      '--enable-unsafe-webgpu',\r\n      '--enable-features=Vulkan'\r\n    ]\r\n  });\r\n\r\n  const context = await browser.newContext();\r\n  const page = await context.newPage();\r\n\r\n  await page.goto('https:\/\/www.hyyyydai-3d.com');\r\n\r\n  await page.fill('.user-id input', 'gizmo');  \r\n  await page.fill('.user-pw input', '*********');\r\n\r\n  await page.locator('.user-id input').press('Tab');\r\n\r\n  await page.click('.btn-login');\r\n\r\n  await expect(page.getByText('\uacf5\uc9c0\uc0ac\ud56d')).toBeVisible();\r\n});\r\n<\/pre>\n<p>\uc704\uc758 \ud14c\uc2a4\ud2b8\ub294 \ub531 1\uac1c\uc778\ub370, \uc8fc\uc5b4\uc9c4 url\uc5d0 \ub4e4\uc5b4\uac00\uc11c id\uc640 \uc554\ud638\ub97c \uc790\ub3d9\uc73c\ub85c \ucc44\uc6b0\uace0 \ub85c\uadf8\uc778 \ubc84\ud2bc\uc744 \ud074\ub9ad\ud574\uc11c &#8216;\uacf5\uc9c0\uc0ac\ud56d&#8217;\uc774\ub77c\ub294 \ud14d\uc2a4\ud2b8\uac00 \ubcf4\uc774\uba74 \ud14c\uc2a4\ud2b8 \uc131\uacf5\uc774\ub77c\ub294 \uac83\uc774\ub2e4.<\/p>\n<p>\ub0b4\uac00 \ud14c\uc2a4\ud2b8\ud574\uc57c\ud560 \uc6f9 \ud398\uc774\uc9c0\uac00 3D \uadf8\ub798\ud53d\uc778\uc9c0\ub77c WebGPU\uc5d0 \ub300\ud55c \ud65c\uc131\ud654 \uc5c6\uc774\ub294 \ud14c\uc2a4\ud2b8\uc5d0 \uc2e4\ud328\ud568\uc73c\ub85c, \uc704\uc758 \ucf54\ub4dc\uc5d0\ub294 WebGPU\uc5d0 \ub300\ud55c \ud65c\uc131\ud654 \ucf54\ub4dc\uac00 \uc788\uace0 \ud14c\uc2a4\ud2b8\uac00 \uc798\ub418\ub294\uac83\uc744 \ud655\uc778\ud560 \uc218 \uc788\uc5c8\ub2e4. \uc2e4\uc81c \ud14c\uc2a4\ud2b8 \uc2e4\ud589\uc740 \ub2e4\uc74c\uacfc \uac19\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"bash\">\r\nnpx playwright test\r\n<\/pre>\n<p>\ud14c\uc2a4\ud2b8\ub97c \uc704\ud55c \uc804\uc6a9 \uc6f9\ube0c\ub77c\uc6b0\uc800\ub97c \ubcf4\uba74\uc11c \ud14c\uc2a4\ud2b8\uac00 \uc9c4\ud589\ub418\ub294 \uac83\uc744 \uc0b4\ud3b4\ubcf4\uace0 \uc2f6\uc740 \uaf3c\uaf3c\uc774\ub77c\uba74 (\ub300\uc2e0 \uc0ac\ub294\uac8c \uace0\ub2ec\ud504\uaca0\uc9c0.. \ub098\ucc98\ub7fc \u315c_\u315c) \ub2e4\uc74c\uacfc \uac19\uc740 \ubc29\uc2dd\uc758 \ud14c\uc2a4\ud2b8 \uc2e4\ud589\ub3c4 \uac00\ub2a5\ud558\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"bash\">\r\nnpx playwright test --ui\r\n<\/pre>\n<p>\uc774 \uae00\uc740 \ud50c\ub808\uc774\ub77c\uc774\ud2b8\ub97c \ucc98\uc74c \uc0ac\uc6a9\ud558\ub294 \uc778\uac04\uc744 \uc704\ud55c \uac00\uc774\ub4dc\uc77c\ubfd0\uc774\ub2e4. \ubcf4\ub2e4 \uc0c1\uc138\ud55c \ubc29\ubc95\uc740 AI\uc5d0\uac8c \ubb3c\uc5b4\ubcf4\uace0 \uac00\uc774\ub4dc \ubc1b\uc73c\ub77c.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\ud50c\ub808\uc774\ub77c\uc774\ud2b8\ub294 \uc6f9\uc571\uc5d0 \ub300\ud55c \ud14c\uc2a4\ud2b8 \uc790\ub3d9\ud654 \ub77c\uc774\ube0c\ub7ec\ub9ac\ub85c JS \ucf54\ub4dc(\ub610\ub294 TS)\ub85c \ud14c\uc2a4\ud2b8\ub97c \uc791\uc131\ud560 \uc218 \uc788\ub2e4. \ubc14\uc774\ube0c \ucf54\ub529 \uc2dc \uae30\ub2a5\uc5d0 \ub300\ud55c \ud14c\uc2a4\ud2b8\ub97c AI \ud1b5\ud574 \ud558\uace0\uc790\ud560\ub54c \ub9e4\uc6b0 \uc720\uc6a9\ud55c\ub370, \uc6f9\ube0c\ub77c\uc6b0\uc800\uc758 \ud2b9\uc815 \ubc84\ud2bc\uc744 AI\uac00 \ud074\ub9ad\ud558\uace0 \uadf8 \uacb0\uacfc\uac00 \uae30\ub300\ud55c \uac83\uc640 \uac19\uc740\uc9c0\uc5d0 \ub300\ud55c \uc778\ud130\ub809\ud2f0\ube0c\ud55c \ud589\ub3d9 \ud14c\uc2a4\ud2b8\ub3c4 \uac00\ub2a5\ud558\ub2e4. \uc6b0\uc640, \uba87\ub2ec \uc804\uae4c\uc9c0\ub9cc \ud574\ub3c4 \uc774\ub7f0\uac74 \uc0ac\ub78c\uc758 \uc601\uc5ed\uc774\ub77c \uc0dd\uac01\ud588\ub2e4. \ud558\ub098\uc529 \ud558\ub098\uc529 \uc778\uac04\uc758 \ub9cc\uc6a9\uc744 AI\ub294 \ubc15\uc0b4\ub0b4\uace0 \uc788\ub2e4. \uacb8\uc190 &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/www.gisdeveloper.co.kr\/?p=16767\" class=\"more-link\">\ub354 \ubcf4\uae30<span class=\"screen-reader-text\"> &#8220;PlayWright\ub97c \uc774\uc6a9\ud55c \uc6f9\uc571 \ud14c\uc2a4\ud2b8&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-16767","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/16767","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=16767"}],"version-history":[{"count":13,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/16767\/revisions"}],"predecessor-version":[{"id":16780,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/16767\/revisions\/16780"}],"wp:attachment":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=16767"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=16767"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=16767"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}