{"id":92802,"date":"2025-01-13T16:43:04","date_gmt":"2025-01-13T13:13:04","guid":{"rendered":"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/"},"modified":"2025-01-13T16:43:04","modified_gmt":"2025-01-13T13:13:04","slug":"%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3","status":"publish","type":"post","link":"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/","title":{"rendered":"\u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u0628\u0627 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0648 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a"},"content":{"rendered":"<div data-article-id=\"2203206\" id=\"article-body\">\n<p><img decoding=\"async\" src=\"https:\/\/media2.dev.to\/dynamic\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fscrapfly.io%2Fblog%2Fcontent%2Fimages%2Fweb-scraping-with-playwright-and-javascript_banner_light.svg\" alt=\"\u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u0628\u0627 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0648 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a\" loading=\"lazy\" width=\"1910\" height=\"1000\" title=\"\"><\/p>\n<p>\u062e\u0631\u0627\u0634 \u0648\u0628 \u067e\u062a\u0627\u0646\u0633\u06cc\u0644 \u0627\u0633\u062a\u062e\u0631\u0627\u062c \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0627\u0631\u0632\u0634\u0645\u0646\u062f \u0627\u0632 \u0648\u0628 \u0633\u0627\u06cc\u062a \u0647\u0627 \u0631\u0627 \u0628\u0627\u0632 \u0645\u06cc \u06a9\u0646\u062f \u0648 Playwright \u06cc\u06a9 \u062a\u063a\u06cc\u06cc\u0631 \u062f\u0647\u0646\u062f\u0647 \u0628\u0627\u0632\u06cc \u0628\u0631\u0627\u06cc \u062e\u0648\u062f\u06a9\u0627\u0631\u0633\u0627\u0632\u06cc \u0627\u06cc\u0646 \u0641\u0631\u0622\u06cc\u0646\u062f \u0627\u0633\u062a. Playwright \u0628\u0627 \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0627\u0632 \u0686\u0646\u062f\u06cc\u0646 \u0645\u062d\u06cc\u0637 \u0645\u0627\u0646\u0646\u062f Node.js\u060c Deno\u060c \u0648 Bun\u060c \u0627\u0633\u06a9\u0631\u0627\u067e\u06cc\u0646\u06af \u0648\u0628 \u0631\u0627 \u0628\u0631\u0627\u06cc \u0645\u0628\u062a\u062f\u06cc\u0627\u0646 \u0648 \u0628\u0631\u0627\u06cc \u062d\u0631\u0641\u0647 \u0627\u06cc \u0647\u0627 \u0642\u062f\u0631\u062a\u0645\u0646\u062f \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u0648\u0628\u0644\u0627\u06af\u060c \u0646\u062d\u0648\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Playwright \u0628\u0631\u0627\u06cc \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u062f\u0631 \u0645\u062d\u06cc\u0637 \u0647\u0627\u06cc \u0645\u062e\u062a\u0644\u0641 \u0645\u0627\u0646\u0646\u062f Node.js\u060c Deno \u0648 Bun \u0631\u0627 \u0628\u0631\u0631\u0633\u06cc \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_85 counter-hierarchy ez-toc-counter-rtl ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">\u0641\u0647\u0631\u0633\u062a \u0645\u0637\u0627\u0644\u0628<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D9%86%D9%85%D8%A7%DB%8C%D8%B4%D9%86%D8%A7%D9%85%D9%87_%D9%86%D9%88%DB%8C%D8%B3_%DA%86%DB%8C%D8%B3%D8%AA%D8%9F\" >\u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0686\u06cc\u0633\u062a\u061f<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D9%88%DB%8C%DA%98%DA%AF%DB%8C_%D9%87%D8%A7%DB%8C_%DA%A9%D9%84%DB%8C%D8%AF%DB%8C_%D9%86%D9%85%D8%A7%DB%8C%D8%B4%D9%86%D8%A7%D9%85%D9%87_%D9%86%D9%88%DB%8C%D8%B3\" >\u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u06a9\u0644\u06cc\u062f\u06cc \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%B1%D8%A7%D9%87_%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%DB%8C\" >\u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D9%86%DA%A9%D8%AA%D9%87_%D9%86%D9%85%D8%A7%DB%8C%D8%B4%D9%86%D8%A7%D9%85%D9%87_%D9%86%D9%88%DB%8C%D8%B3_%D8%AF%D8%B1_REPL\" >\u0646\u06a9\u062a\u0647: \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u062f\u0631 REPL<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#Nodejs\" >Node.js<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%AF%D9%86%D9%88\" >\u062f\u0646\u0648<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D9%86%D8%A7%D9%86\" >\u0646\u0627\u0646<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D9%85%D8%A8%D8%A7%D9%86%DB%8C\" >\u0645\u0628\u0627\u0646\u06cc<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D9%86%D8%A7%D9%88%D8%A8%D8%B1%DB%8C_%D9%88_%D8%A7%D9%86%D8%AA%D8%B8%D8%A7%D8%B1\" >\u0646\u0627\u0648\u0628\u0631\u06cc \u0648 \u0627\u0646\u062a\u0638\u0627\u0631<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%AA%D8%AC%D8%B2%DB%8C%D9%87_%D8%AF%D8%A7%D8%AF%D9%87_%D9%87%D8%A7\" >\u062a\u062c\u0632\u06cc\u0647 \u062f\u0627\u062f\u0647 \u0647\u0627<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%B1%D9%88%DB%8C_%D8%AF%DA%A9%D9%85%D9%87_%D9%87%D8%A7_%D9%88_%D9%88%D8%B1%D9%88%D8%AF%DB%8C_%D9%85%D8%AA%D9%86_%DA%A9%D9%84%DB%8C%DA%A9_%DA%A9%D9%86%DB%8C%D8%AF\" >\u0631\u0648\u06cc \u062f\u06a9\u0645\u0647 \u0647\u0627 \u0648 \u0648\u0631\u0648\u062f\u06cc \u0645\u062a\u0646 \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u06cc\u062f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D9%BE%DB%8C%D9%85%D8%A7%DB%8C%D8%B4_%D9%88_%D8%B5%D9%81%D8%AD%D9%87_%D8%A8%D9%86%D8%AF%DB%8C_%D8%A8%DB%8C_%D9%86%D9%87%D8%A7%DB%8C%D8%AA\" >\u067e\u06cc\u0645\u0627\u06cc\u0634 \u0648 \u0635\u0641\u062d\u0647 \u0628\u0646\u062f\u06cc \u0628\u06cc \u0646\u0647\u0627\u06cc\u062a<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%AA%D9%88%D8%A7%D8%A8%D8%B9_%D9%BE%DB%8C%D8%B4%D8%B1%D9%81%D8%AA%D9%87\" >\u062a\u0648\u0627\u0628\u0639 \u067e\u06cc\u0634\u0631\u0641\u062a\u0647<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%A7%D8%B1%D8%B2%DB%8C%D8%A7%D8%A8%DB%8C_%D8%AC%D8%A7%D9%88%D8%A7_%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA\" >\u0627\u0631\u0632\u06cc\u0627\u0628\u06cc \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%B1%D9%87%DA%AF%DB%8C%D8%B1%DB%8C_%D8%AF%D8%B1%D8%AE%D9%88%D8%A7%D8%B3%D8%AA_%D9%88_%D9%BE%D8%A7%D8%B3%D8%AE\" >\u0631\u0647\u06af\u06cc\u0631\u06cc \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0648 \u067e\u0627\u0633\u062e<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D9%85%D8%B3%D8%AF%D9%88%D8%AF_%DA%A9%D8%B1%D8%AF%D9%86_%D9%85%D9%86%D8%A7%D8%A8%D8%B9\" >\u0645\u0633\u062f\u0648\u062f \u06a9\u0631\u062f\u0646 \u0645\u0646\u0627\u0628\u0639<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%A7%D8%AC%D8%AA%D9%86%D8%A7%D8%A8_%D8%A7%D8%B2_%D9%85%D8%B3%D8%AF%D9%88%D8%AF_%DA%A9%D8%B1%D8%AF%D9%86\" >\u0627\u062c\u062a\u0646\u0627\u0628 \u0627\u0632 \u0645\u0633\u062f\u0648\u062f \u06a9\u0631\u062f\u0646<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%AC%D8%A7%DB%8C%DA%AF%D8%B2%DB%8C%D9%86_ScrapFly\" >\u062c\u0627\u06cc\u06af\u0632\u06cc\u0646 ScrapFly<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-19\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%B3%D9%88%D8%A7%D9%84%D8%A7%D8%AA_%D9%85%D8%AA%D8%AF%D8%A7%D9%88%D9%84\" >\u0633\u0648\u0627\u0644\u0627\u062a \u0645\u062a\u062f\u0627\u0648\u0644<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-20\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%DA%86%DA%AF%D9%88%D9%86%D9%87_%D8%A7%D8%B2_%D9%BE%D8%B1%D9%88%DA%A9%D8%B3%DB%8C_%D8%A8%D8%A7_Playwright_%D8%AF%D8%B1_%D8%AC%D8%A7%D9%88%D8%A7_%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA_%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D9%87_%DA%A9%D9%86%DB%8C%D9%85%D8%9F\" >\u0686\u06af\u0648\u0646\u0647 \u0627\u0632 \u067e\u0631\u0648\u06a9\u0633\u06cc \u0628\u0627 Playwright \u062f\u0631 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645\u061f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-21\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%DA%86%DA%AF%D9%88%D9%86%D9%87_%D9%85%DB%8C_%D8%AA%D9%88%D8%A7%D9%86%D9%85_%D8%A7%D8%B2_%D9%BE%D8%B1%D9%88%DA%A9%D8%B3%DB%8C_%D8%A8%D8%A7_%D9%86%D9%85%D8%A7%DB%8C%D8%B4%D9%86%D8%A7%D9%85%D9%87_%D9%86%D9%88%DB%8C%D8%B3_%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D9%87_%DA%A9%D9%86%D9%85%D8%9F\" >\u0686\u06af\u0648\u0646\u0647 \u0645\u06cc \u062a\u0648\u0627\u0646\u0645 \u0627\u0632 \u067e\u0631\u0648\u06a9\u0633\u06cc \u0628\u0627 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u0645\u061f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-22\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%DA%A9%D8%AF%D8%A7%D9%85_%D9%85%D8%B1%D9%88%D8%B1%DA%AF%D8%B1_Headless_%D8%A8%D8%B1%D8%A7%DB%8C_Scraping_%D9%86%D9%85%D8%A7%DB%8C%D8%B4%D9%86%D8%A7%D9%85%D9%87_%D9%86%D9%88%DB%8C%D8%B3_%D8%AC%D8%A7%D9%88%D8%A7_%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA_%D8%A8%D9%87%D8%AA%D8%B1%DB%8C%D9%86_%D8%A7%D8%B3%D8%AA%D8%9F\" >\u06a9\u062f\u0627\u0645 \u0645\u0631\u0648\u0631\u06af\u0631 Headless \u0628\u0631\u0627\u06cc Scraping \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0628\u0647\u062a\u0631\u06cc\u0646 \u0627\u0633\u062a\u061f<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-23\" href=\"https:\/\/nabfollower.com\/blog\/%d8%ae%d8%b1%d8%a7%d8%b4-%d8%af%d8%a7%d8%af%d9%86-%d9%88%d8%a8-%d8%a8%d8%a7-%d9%86%d9%85%d8%a7%db%8c%d8%b4%d9%86%d8%a7%d9%85%d9%87-%d9%86%d9%88%db%8c%d8%b3-%d9%88-%d8%ac%d8%a7%d9%88%d8%a7-%d8%a7%d8%b3\/#%D8%AE%D9%84%D8%A7%D8%B5%D9%87\" >\u062e\u0644\u0627\u0635\u0647<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"%D9%86%D9%85%D8%A7%DB%8C%D8%B4%D9%86%D8%A7%D9%85%D9%87_%D9%86%D9%88%DB%8C%D8%B3_%DA%86%DB%8C%D8%B3%D8%AA%D8%9F\"><\/span>\n<p>  \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0686\u06cc\u0633\u062a\u061f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Playwright \u0627\u0628\u0632\u0627\u0631 \u0642\u062f\u0631\u062a\u0645\u0646\u062f\u06cc \u0627\u0633\u062a \u06a9\u0647 \u062a\u0648\u0633\u0637 \u0645\u0627\u06cc\u06a9\u0631\u0648\u0633\u0627\u0641\u062a \u0628\u0631\u0627\u06cc \u062e\u0648\u062f\u06a9\u0627\u0631\u0633\u0627\u0632\u06cc \u0627\u0642\u062f\u0627\u0645\u0627\u062a \u0645\u0631\u0648\u0631\u06af\u0631 \u062f\u0631 \u0645\u0631\u0648\u0631\u06af\u0631\u0647\u0627\u06cc \u0645\u062e\u062a\u0644\u0641 \u0645\u0627\u0646\u0646\u062f Chromium\u060c Firefox \u0648 WebKit \u062a\u0648\u0633\u0639\u0647 \u06cc\u0627\u0641\u062a\u0647 \u0627\u0633\u062a. \u0627\u06cc\u0646 \u0628\u0647 \u062a\u0648\u0633\u0639\u0647 \u062f\u0647\u0646\u062f\u06af\u0627\u0646 \u0627\u062c\u0627\u0632\u0647 \u0645\u06cc \u062f\u0647\u062f \u062a\u0627 \u0628\u0647 \u0635\u0648\u0631\u062a \u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc \u0628\u0627 \u0635\u0641\u062d\u0627\u062a \u0648\u0628 \u062a\u0639\u0627\u0645\u0644 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u0646\u062f \u0648 \u0622\u0646 \u0631\u0627 \u0628\u0647 \u06af\u0632\u06cc\u0646\u0647 \u0627\u06cc \u0627\u06cc\u062f\u0647 \u0622\u0644 \u0628\u0631\u0627\u06cc \u06a9\u0627\u0631\u0647\u0627\u06cc \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u062a\u0628\u062f\u06cc\u0644 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D9%88%DB%8C%DA%98%DA%AF%DB%8C_%D9%87%D8%A7%DB%8C_%DA%A9%D9%84%DB%8C%D8%AF%DB%8C_%D9%86%D9%85%D8%A7%DB%8C%D8%B4%D9%86%D8%A7%D9%85%D9%87_%D9%86%D9%88%DB%8C%D8%B3\"><\/span>\n<p>  \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u06a9\u0644\u06cc\u062f\u06cc \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u062f\u0627\u0631\u0627\u06cc \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0627\u062a\u0648\u0645\u0627\u0633\u06cc\u0648\u0646 \u0645\u0631\u0648\u0631\u06af\u0631 \u0631\u0627 \u06cc\u06a9\u067e\u0627\u0631\u0686\u0647 \u0648 \u06a9\u0627\u0631\u0622\u0645\u062f \u0645\u06cc \u06a9\u0646\u062f. \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0646\u06af\u0627\u0647\u06cc \u062f\u0642\u06cc\u0642 \u062a\u0631 \u0628\u0647 \u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u0628\u0631\u062c\u0633\u062a\u0647 \u0622\u0646 \u062f\u0627\u0631\u06cc\u0645:<\/p>\n<ul>\n<li>  <strong>\u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0627\u0632 \u0645\u0631\u0648\u0631\u06af\u0631\u0647\u0627\u06cc \u0645\u062a\u0642\u0627\u0628\u0644:<\/strong> \u06a9\u0631\u0648\u0645\u06cc\u0648\u0645\u060c \u0641\u0627\u06cc\u0631\u0641\u0627\u06a9\u0633\u060c \u0648 WebKit \u0631\u0627 \u0628\u0631\u0627\u06cc \u0633\u0627\u0632\u06af\u0627\u0631\u06cc \u06cc\u06a9\u067e\u0627\u0631\u0686\u0647 \u062f\u0631 \u0647\u0645\u0647 \u067e\u0644\u062a\u0641\u0631\u0645\u200c\u0647\u0627\u060c \u062e\u0648\u062f\u06a9\u0627\u0631 \u0645\u06cc\u200c\u06a9\u0646\u062f.<\/li>\n<li>  <strong>\u062d\u0627\u0644\u062a \u0647\u0627\u06cc \u0628\u062f\u0648\u0646 \u0633\u0631 \u0648 \u0633\u0631:<\/strong> \u062d\u0627\u0644\u062a \u0647\u062f\u0644\u0633 \u0633\u0631\u06cc\u0639 \u0648 \u0627\u0634\u06a9\u0627\u0644 \u0632\u062f\u0627\u06cc\u06cc \u0628\u0635\u0631\u06cc \u0631\u0627 \u062f\u0631 \u062d\u0627\u0644\u062a headful \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc \u062f\u0647\u062f.<\/li>\n<li>  <strong>\u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0686\u0646\u062f \u0632\u0628\u0627\u0646\u0647:<\/strong> \u06a9\u062a\u0627\u0628\u062e\u0627\u0646\u0647 \u0647\u0627\u06cc\u06cc \u0628\u0631\u0627\u06cc \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a\u060c \u067e\u0627\u06cc\u062a\u0648\u0646\u060c \u062c\u0627\u0648\u0627 \u0648 \u062f\u0627\u062a \u0646\u062a \u0641\u0631\u0627\u0647\u0645 \u0645\u06cc \u06a9\u0646\u062f.<\/li>\n<li>  <strong>\u0631\u0647\u06af\u06cc\u0631\u06cc \u0634\u0628\u06a9\u0647:<\/strong> \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0647\u0627 \u0648 \u067e\u0627\u0633\u062e \u0647\u0627 \u0631\u0627 \u0628\u0631\u0627\u06cc \u06a9\u0646\u062a\u0631\u0644 \u067e\u06cc\u0634\u0631\u0641\u062a\u0647 \u0628\u0627\u0632\u0631\u0633\u06cc\u060c \u0627\u0635\u0644\u0627\u062d \u06cc\u0627 \u0645\u0633\u062f\u0648\u062f \u0645\u06cc \u06a9\u0646\u062f.<\/li>\n<li>  <strong>\u0627\u0633\u06a9\u0631\u06cc\u0646 \u0634\u0627\u062a \u0647\u0627 \u0648 \u0641\u06cc\u0644\u0645 \u0647\u0627:<\/strong> \u062a\u0635\u0627\u0648\u06cc\u0631\u06cc \u0627\u0632 \u062c\u0644\u0633\u0627\u062a \u0645\u0631\u0648\u0631\u06af\u0631 \u0631\u0627 \u0628\u0631\u0627\u06cc \u0627\u0634\u06a9\u0627\u0644 \u0632\u062f\u0627\u06cc\u06cc \u0648 \u0645\u0633\u062a\u0646\u062f\u0633\u0627\u0632\u06cc \u0645\u06cc \u06af\u06cc\u0631\u062f.<\/li>\n<li>  <strong>\u0627\u062a\u0648\u0645\u0627\u0633\u06cc\u0648\u0646 \u0627\u0645\u0646:<\/strong> \u0627\u0632 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u067e\u0631\u0648\u06a9\u0633\u06cc\u060c \u0630\u062e\u06cc\u0631\u0647 \u0633\u0627\u0632\u06cc \u0627\u06cc\u0645\u0646 \u0648 \u0645\u062f\u06cc\u0631\u06cc\u062a CAPTCHA \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0645\u06cc \u06a9\u0646\u062f.<\/li>\n<\/ul>\n<p>Playwright \u0628\u0627 \u0645\u062c\u0645\u0648\u0639\u0647 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc \u06af\u0633\u062a\u0631\u062f\u0647 \u0648 \u0637\u0631\u0627\u062d\u06cc \u0642\u0648\u06cc \u062e\u0648\u062f\u060c \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0627\u0628\u0632\u0627\u0631\u06cc \u0647\u0645\u0647 \u06a9\u0627\u0631\u0647 \u0648 \u0645\u0646\u0627\u0633\u0628 \u0628\u0631\u0627\u06cc \u062a\u0648\u0633\u0639\u0647\u200c\u062f\u0647\u0646\u062f\u06af\u0627\u0646 \u0628\u0631\u0627\u06cc \u062e\u0648\u062f\u06a9\u0627\u0631\u0633\u0627\u0632\u06cc \u0645\u0631\u0648\u0631\u06af\u0631\u0647\u0627 \u0648 \u0631\u0633\u06cc\u062f\u06af\u06cc \u0628\u0647 \u0646\u06cc\u0627\u0632\u0647\u0627\u06cc \u067e\u06cc\u0686\u06cc\u062f\u0647 \u0648\u0628\u200c\u0633\u0627\u06cc\u062a \u06cc\u0627 \u062a\u0633\u062a \u0645\u0648\u0631\u062f \u062a\u0648\u062c\u0647 \u0642\u0631\u0627\u0631 \u0645\u06cc\u200c\u06af\u06cc\u0631\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%B1%D8%A7%D9%87_%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%DB%8C\"><\/span>\n<p>  \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0634\u0631\u0648\u0639 \u06a9\u0627\u0631 \u0628\u0627 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0633\u0627\u062f\u0647 \u0627\u0633\u062a. \u0642\u0628\u0644 \u0627\u0632 \u063a\u0648\u0627\u0635\u06cc \u062f\u0631 \u0648\u0628 \u0627\u0633\u06a9\u0631\u067e\u06cc\u0646\u06af\u060c \u0628\u0627\u06cc\u062f \u0622\u0646 \u0631\u0627 \u062f\u0631 \u0645\u062d\u06cc\u0637 \u062a\u0648\u0633\u0639\u0647 \u062f\u0644\u062e\u0648\u0627\u0647 \u062e\u0648\u062f \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0646\u06cc\u062f. Playwright \u0627\u0632 \u0686\u0646\u062f\u06cc\u0646 \u0632\u0645\u0627\u0646 \u0627\u062c\u0631\u0627 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0645\u06cc \u06a9\u0646\u062f \u0648 \u0622\u0646 \u0631\u0627 \u0627\u0646\u0639\u0637\u0627\u0641 \u067e\u0630\u06cc\u0631 \u0648 \u0642\u0627\u0628\u0644 \u062f\u0633\u062a\u0631\u0633 \u0645\u06cc \u06a9\u0646\u062f. \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0646\u062d\u0648\u0647 \u062a\u0646\u0638\u06cc\u0645 \u0622\u0646 \u0628\u0631\u0627\u06cc <strong>Node.js<\/strong>\u060c <strong>\u062f\u0646\u0648<\/strong>\u060c \u0648 <strong>\u0646\u0627\u0646<\/strong>:<\/p>\n<p>NodeJS<\/p>\n<p>\u062f\u0646\u0648<\/p>\n<p>\u0646\u0627\u0646<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code><span class=\"c\"># Install Playwright using your favorite package manager, such as npm or Yarn.<\/span>\n<span class=\"c\"># This is the most common setup and works seamlessly with Node.js projects.<\/span>\nnpm <span class=\"nb\">install <\/span>playwright\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"c1\">\/\/ Deno allows you to import Playwright directly from the Deno registry.<\/span>\n<span class=\"c1\">\/\/ There's no need for additional installation steps, making setup quick and easy.<\/span>\n<span class=\"k\">import<\/span> <span class=\"o\">*<\/span> <span class=\"k\">as<\/span> <span class=\"nx\">playwright<\/span> <span class=\"k\">from<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/deno.land\/x\/playwright@1.22.1\/mod.ts<\/span><span class=\"dl\">\"<\/span><span class=\"p\">;<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code><span class=\"c\"># Bun, known for its performance and speed, also supports Playwright.<\/span>\n<span class=\"c\"># Use Bun\u2019s package manager to add it to your project effortlessly.<\/span>\nbun add playwright\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0628\u0627 \u062f\u0633\u062a\u0648\u0631\u0627\u062a \u0648\u0627\u0636\u062d \u0648 \u0633\u0631\u0631\u0627\u0633\u062a \u0645\u062a\u0646\u0627\u0633\u0628 \u0628\u0627 \u0647\u0631 \u0632\u0645\u0627\u0646 \u0627\u062c\u0631\u0627\u060c Playwright \u062a\u0636\u0645\u06cc\u0646 \u0645\u06cc\u200c\u06a9\u0646\u062f \u06a9\u0647 \u062a\u0648\u0633\u0639\u0647\u200c\u062f\u0647\u0646\u062f\u06af\u0627\u0646 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u0646\u062f \u0628\u062f\u0648\u0646 \u062f\u0631 \u0646\u0638\u0631 \u06af\u0631\u0641\u062a\u0646 \u0645\u062d\u06cc\u0637 \u0627\u0646\u062a\u062e\u0627\u0628\u06cc \u062e\u0648\u062f\u060c \u0628\u0647 \u0633\u0631\u0639\u062a \u0634\u0631\u0648\u0639 \u0628\u0647 \u06a9\u0627\u0631 \u06a9\u0646\u0646\u062f. \u0632\u0645\u0627\u0646 \u0627\u062c\u0631\u0627 \u062e\u0648\u062f \u0631\u0627 \u0627\u0646\u062a\u062e\u0627\u0628 \u06a9\u0646\u06cc\u062f\u060c \u0645\u0631\u0627\u062d\u0644 \u0628\u0627\u0644\u0627 \u0631\u0627 \u062f\u0646\u0628\u0627\u0644 \u06a9\u0646\u06cc\u062f \u0648 \u062f\u0631 \u06a9\u0645\u062a\u0631\u06cc\u0646 \u0632\u0645\u0627\u0646 \u0622\u0645\u0627\u062f\u0647 \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u062e\u0648\u0627\u0647\u06cc\u062f \u0628\u0648\u062f!<\/p>\n<p>\u062f\u0631 \u0645\u0631\u062d\u0644\u0647 \u0628\u0639\u062f\u060c \u0646\u062d\u0648\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Playwright \u0631\u0627 \u062f\u0631 \u0645\u062d\u06cc\u0637 REPL (\u062d\u0644\u0642\u0647 \u062e\u0648\u0627\u0646\u062f\u0646\u060c \u0627\u0631\u0632\u06cc\u0627\u0628\u06cc\u060c \u0686\u0627\u067e) \u0628\u0631\u0631\u0633\u06cc \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D9%86%DA%A9%D8%AA%D9%87_%D9%86%D9%85%D8%A7%DB%8C%D8%B4%D9%86%D8%A7%D9%85%D9%87_%D9%86%D9%88%DB%8C%D8%B3_%D8%AF%D8%B1_REPL\"><\/span>\n<p>  \u0646\u06a9\u062a\u0647: \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u062f\u0631 REPL<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0647\u0645\u0686\u0646\u06cc\u0646 \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u062f\u0631 \u0645\u062d\u06cc\u0637 REPL (\u062d\u0644\u0642\u0647 \u062e\u0648\u0627\u0646\u062f\u0646-\u0627\u0631\u0632\u06cc\u0627\u0628\u06cc-\u0686\u0627\u067e) \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0634\u0648\u062f \u06a9\u0647 \u0628\u0631\u0627\u06cc \u0622\u0632\u0645\u0627\u06cc\u0634 \u0633\u0631\u06cc\u0639 \u0639\u0627\u0644\u06cc \u0627\u0633\u062a. \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0646\u062d\u0648\u0647 \u062a\u0646\u0638\u06cc\u0645 \u0622\u0646 \u062f\u0631 \u0645\u062d\u06cc\u0637 \u0647\u0627\u06cc \u0645\u062e\u062a\u0644\u0641 \u0622\u0648\u0631\u062f\u0647 \u0634\u062f\u0647 \u0627\u0633\u062a:<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0627\u062c\u0631\u0627\u06cc Playwright \u062f\u0631 \u0645\u062d\u06cc\u0637 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a REPL \u062f\u0631 \u0632\u0645\u0627\u0646 \u0647\u0627\u06cc \u0645\u062e\u062a\u0644\u0641 \u0627\u062c\u0631\u0627 \u0645\u0627\u0646\u0646\u062f Node.js\u060c Deno \u0648 Bun\u060c \u0627\u06cc\u0646 \u0645\u0631\u0627\u062d\u0644 \u0631\u0627 \u062f\u0646\u0628\u0627\u0644 \u06a9\u0646\u06cc\u062f:<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Nodejs\"><\/span>\n<p>  Node.js<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0628\u0631\u0627\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Playwright \u062f\u0631 \u0645\u062d\u06cc\u0637 Node.js\u060c \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0627\u0632 \u0642\u0627\u0628\u0644\u06cc\u062a\u200c\u0647\u0627\u06cc REPL (Read-Evaluate-Print Loop) \u0628\u0631\u0627\u06cc \u0622\u0632\u0645\u0627\u06cc\u0634 \u0633\u0631\u06cc\u0639 \u0648 \u0646\u0645\u0648\u0646\u0647\u200c\u0633\u0627\u0632\u06cc \u0627\u0648\u0644\u06cc\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f. \u0645\u0631\u0627\u062d\u0644 \u0632\u06cc\u0631 \u0631\u0627 \u062f\u0646\u0628\u0627\u0644 \u06a9\u0646\u06cc\u062f \u062a\u0627 Playwright \u0631\u0627 \u0628\u0647 \u0635\u0648\u0631\u062a \u062a\u0639\u0627\u0645\u0644\u06cc \u062a\u0646\u0638\u06cc\u0645 \u0648 \u06a9\u0627\u0648\u0634 \u06a9\u0646\u06cc\u062f:<\/p>\n<ol>\n<li>\n<p><strong>REPL \u0631\u0627 \u0628\u0627 \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0633\u0637\u062d \u0628\u0627\u0644\u0627\u06cc \u0627\u0646\u062a\u0638\u0627\u0631 \u0634\u0631\u0648\u0639 \u06a9\u0646\u06cc\u062f:<\/strong><\/p>\n<pre class=\"highlight shell\"><code><span class=\"nv\">$ <\/span>node <span class=\"nt\">--experimental-repl-await<\/span>\n<\/code><\/pre>\n<\/li>\n<li>\n<p><strong>\u062f\u0631 REPL:<\/strong><\/p>\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">chromium<\/span> <span class=\"p\">}<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">require<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">playwright<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">browser<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">chromium<\/span><span class=\"p\">.<\/span><span class=\"nf\">launch<\/span><span class=\"p\">({<\/span> <span class=\"na\">headless<\/span><span class=\"p\">:<\/span> <span class=\"kc\">false<\/span> <span class=\"p\">});<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">page<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">newPage<\/span><span class=\"p\">();<\/span>\n<span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">goto<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/twitch.tv<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n<\/code><\/pre>\n<\/li>\n<\/ol>\n<p>\u0627\u06cc\u0646 \u0642\u0637\u0639\u0647 \u06cc\u06a9 \u0645\u0631\u0648\u0631\u06af\u0631 Chromium \u0642\u0627\u0628\u0644 \u0645\u0634\u0627\u0647\u062f\u0647 \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u0645\u06cc \u06a9\u0646\u062f\u060c \u0635\u0641\u062d\u0647 \u0627\u0635\u0644\u06cc Twitch \u0631\u0627 \u0628\u0627\u0632 \u0645\u06cc \u06a9\u0646\u062f \u0648 \u0628\u0647 \u0634\u0645\u0627 \u0627\u0645\u06a9\u0627\u0646 \u0645\u06cc \u062f\u0647\u062f \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0647\u0627 \u0631\u0627 \u0628\u0647 \u0635\u0648\u0631\u062a \u062a\u0639\u0627\u0645\u0644\u06cc \u062f\u0631 \u06cc\u06a9 REPL \u0628\u062f\u0648\u0646 \u0641\u0627\u06cc\u0644 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u062c\u062f\u0627\u06af\u0627\u0646\u0647 \u0622\u0632\u0645\u0627\u06cc\u0634 \u0648 \u0627\u0634\u06a9\u0627\u0644 \u0632\u062f\u0627\u06cc\u06cc \u06a9\u0646\u06cc\u062f.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%AF%D9%86%D9%88\"><\/span>\n<p>  \u062f\u0646\u0648<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u062f\u0631 Deno\u060c \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0628\u0627 \u0648\u0627\u0631\u062f \u06a9\u0631\u062f\u0646 \u0645\u0633\u062a\u0642\u06cc\u0645 \u0627\u0632 \u0631\u062c\u06cc\u0633\u062a\u0631\u06cc Deno\u060c \u0627\u0632 Playwright \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f. REPL (\u062d\u0644\u0642\u0647 \u062e\u0648\u0627\u0646\u062f\u0646-\u0627\u0631\u0632\u06cc\u0627\u0628\u06cc-\u0686\u0627\u067e) \u0628\u0647 \u0634\u0645\u0627 \u0627\u0645\u06a9\u0627\u0646 \u0645\u06cc \u062f\u0647\u062f \u062f\u0633\u062a\u0648\u0631\u0627\u062a Playwright \u0631\u0627 \u0628\u0647 \u0635\u0648\u0631\u062a \u062a\u0639\u0627\u0645\u0644\u06cc \u0628\u0627 \u0645\u062c\u0648\u0632\u0647\u0627\u06cc \u0645\u0648\u0631\u062f \u0646\u06cc\u0627\u0632 \u0622\u0632\u0645\u0627\u06cc\u0634 \u0648 \u0627\u062c\u0631\u0627 \u06a9\u0646\u06cc\u062f. \u0628\u0631\u0627\u06cc \u0634\u0631\u0648\u0639 \u0645\u0631\u0627\u062d\u0644 \u0632\u06cc\u0631 \u0631\u0627 \u062f\u0646\u0628\u0627\u0644 \u06a9\u0646\u06cc\u062f:<\/p>\n<ol>\n<li>\n<p><strong>Deno REPL \u0631\u0627 \u0628\u0627 \u0645\u062c\u0648\u0632\u0647\u0627\u06cc \u0644\u0627\u0632\u0645 \u0634\u0631\u0648\u0639 \u06a9\u0646\u06cc\u062f:<\/strong><\/p>\n<pre class=\"highlight shell\"><code><span class=\"nv\">$ <\/span>deno repl <span class=\"nt\">--allow-net<\/span> <span class=\"nt\">--allow-env<\/span> <span class=\"nt\">--allow-run<\/span>\n<\/code><\/pre>\n<\/li>\n<li>\n<p><strong>\u062f\u0631 REPL:<\/strong><\/p>\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">chromium<\/span> <span class=\"p\">}<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"k\">import<\/span><span class=\"p\">(<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/deno.land\/x\/playwright@1.22.1\/mod.ts<\/span><span class=\"dl\">\"<\/span>\n<span class=\"p\">);<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">browser<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">chromium<\/span><span class=\"p\">.<\/span><span class=\"nf\">launch<\/span><span class=\"p\">({<\/span> <span class=\"na\">headless<\/span><span class=\"p\">:<\/span> <span class=\"kc\">false<\/span> <span class=\"p\">});<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">page<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">newPage<\/span><span class=\"p\">();<\/span>\n<span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">goto<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/twitch.tv<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n<\/code><\/pre>\n<p>\u062f\u0631 Deno\u060c \u0645\u062c\u0648\u0632\u0647\u0627\u06cc\u06cc \u0645\u0627\u0646\u0646\u062f <code>--allow-net<\/code>\u060c <code>--allow-env<\/code>\u060c \u0648 <code>--allow-run<\/code> \u0628\u0631\u0627\u06cc \u0639\u0645\u0644\u06a9\u0631\u062f \u0635\u062d\u06cc\u062d \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0636\u0631\u0648\u0631\u06cc \u0627\u0633\u062a.<\/p>\n<\/li>\n<\/ol>\n<h3><span class=\"ez-toc-section\" id=\"%D9%86%D8%A7%D9%86\"><\/span>\n<p>  \u0646\u0627\u0646<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Bun \u06cc\u06a9 \u0645\u062d\u06cc\u0637 \u0633\u0631\u06cc\u0639 \u0648 \u06a9\u0627\u0631\u0622\u0645\u062f \u0628\u0631\u0627\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Playwright \u0641\u0631\u0627\u0647\u0645 \u0645\u06cc \u06a9\u0646\u062f. \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 REPL (\u062d\u0644\u0642\u0647 \u062e\u0648\u0627\u0646\u062f\u0646-\u0627\u0631\u0632\u06cc\u0627\u0628\u06cc-\u0686\u0627\u067e)\u060c \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u0628\u0647 \u0633\u0631\u0639\u062a \u062f\u0633\u062a\u0648\u0631\u0627\u062a Playwright \u0631\u0627 \u0628\u0647 \u0635\u0648\u0631\u062a \u062a\u0639\u0627\u0645\u0644\u06cc \u0622\u0632\u0645\u0627\u06cc\u0634 \u0648 \u0627\u062c\u0631\u0627 \u06a9\u0646\u06cc\u062f. \u0628\u0631\u0627\u06cc \u0634\u0631\u0648\u0639 \u0645\u0631\u0627\u062d\u0644 \u0632\u06cc\u0631 \u0631\u0627 \u062f\u0646\u0628\u0627\u0644 \u06a9\u0646\u06cc\u062f:<\/p>\n<ol>\n<li>\n<p><strong>Bun REPL \u0631\u0627 \u0634\u0631\u0648\u0639 \u06a9\u0646\u06cc\u062f:<\/strong><\/p>\n<pre class=\"highlight shell\"><code><span class=\"nv\">$ <\/span>bun repl\n<\/code><\/pre>\n<\/li>\n<li>\n<p><strong>\u062f\u0631 REPL:<\/strong><\/p>\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">chromium<\/span> <span class=\"p\">}<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"k\">import<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">playwright<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">browser<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">chromium<\/span><span class=\"p\">.<\/span><span class=\"nf\">launch<\/span><span class=\"p\">({<\/span> <span class=\"na\">headless<\/span><span class=\"p\">:<\/span> <span class=\"kc\">false<\/span> <span class=\"p\">});<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">page<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">newPage<\/span><span class=\"p\">();<\/span>\n<span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">goto<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/twitch.tv<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n<\/code><\/pre>\n<\/li>\n<\/ol>\n<p>\u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Playwright \u062f\u0631 \u06cc\u06a9 \u0645\u062d\u06cc\u0637 REPL \u0628\u0647 \u0634\u0645\u0627 \u0627\u0645\u06a9\u0627\u0646 \u0645\u06cc \u062f\u0647\u062f \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0647\u0627\u06cc \u0627\u062a\u0648\u0645\u0627\u0633\u06cc\u0648\u0646 \u0631\u0627 \u0628\u0647 \u0635\u0648\u0631\u062a \u062a\u0639\u0627\u0645\u0644\u06cc \u062f\u0631 \u0632\u0645\u0627\u0646 \u0647\u0627\u06cc \u0645\u062e\u062a\u0644\u0641 \u0627\u062c\u0631\u0627 \u0645\u0627\u0646\u0646\u062f Node.js\u060c Deno\u060c \u0648 Bun \u0622\u0632\u0645\u0627\u06cc\u0634 \u0648 \u0622\u0632\u0645\u0627\u06cc\u0634 \u06a9\u0646\u06cc\u062f. \u0627\u06cc\u0646 \u0627\u0646\u0639\u0637\u0627\u0641 \u067e\u0630\u06cc\u0631\u06cc \u0622\u0646 \u0631\u0627 \u0628\u0647 \u06af\u0632\u06cc\u0646\u0647 \u0627\u06cc \u0639\u0627\u0644\u06cc \u0628\u0631\u0627\u06cc \u0646\u0645\u0648\u0646\u0647 \u0633\u0627\u0632\u06cc \u0633\u0631\u06cc\u0639 \u0648 \u0627\u0634\u06a9\u0627\u0644 \u0632\u062f\u0627\u06cc\u06cc \u062a\u0628\u062f\u06cc\u0644 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D9%85%D8%A8%D8%A7%D9%86%DB%8C\"><\/span>\n<p>  \u0645\u0628\u0627\u0646\u06cc<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0642\u0628\u0644 \u0627\u0632 \u067e\u0631\u062f\u0627\u062e\u062a\u0646 \u0628\u0647 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647\u200c\u0646\u0648\u06cc\u0633\u060c \u0628\u06cc\u0627\u06cc\u06cc\u062f \u0628\u0627 \u0631\u0627\u0647\u200c\u0627\u0646\u062f\u0627\u0632\u06cc \u06cc\u06a9 \u0645\u0631\u0648\u0631\u06af\u0631\u060c \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u0632\u0645\u06cc\u0646\u0647 \u062c\u062f\u06cc\u062f \u0648 \u0628\u0627\u0632 \u06a9\u0631\u062f\u0646 \u06cc\u06a9 \u0628\u0631\u06af\u0647 \u0645\u0631\u0648\u0631\u06af\u0631 (\u0628\u0647 \u0639\u0646\u0648\u0627\u0646 &#8220;\u0635\u0641\u062d\u0647&#8221;) \u0634\u0631\u0648\u0639 \u06a9\u0646\u06cc\u0645. \u0627\u06cc\u0646\u0647\u0627 \u0645\u0631\u0627\u062d\u0644 \u0627\u0633\u0627\u0633\u06cc \u0628\u0631\u0627\u06cc \u0647\u0631 \u06a9\u0627\u0631 \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u06cc\u0627 \u0627\u062a\u0648\u0645\u0627\u0633\u06cc\u0648\u0646 \u062f\u0631 Playwright \u0647\u0633\u062a\u0646\u062f.<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">chromium<\/span> <span class=\"p\">}<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">require<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">playwright<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n\n<span class=\"p\">(<\/span><span class=\"k\">async <\/span><span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">browser<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">chromium<\/span><span class=\"p\">.<\/span><span class=\"nf\">launch<\/span><span class=\"p\">({<\/span>\n    <span class=\"c1\">\/\/ Choose headless mode for speed or headful mode for debugging<\/span>\n    <span class=\"na\">headless<\/span><span class=\"p\">:<\/span> <span class=\"kc\">false<\/span><span class=\"p\">,<\/span>\n  <span class=\"p\">});<\/span>\n\n  <span class=\"c1\">\/\/ Create a new browser context with custom settings<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">context<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">newContext<\/span><span class=\"p\">({<\/span>\n    <span class=\"c1\">\/\/ Set viewport dimensions to match a common desktop resolution<\/span>\n    <span class=\"na\">viewport<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span> <span class=\"na\">width<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1920<\/span><span class=\"p\">,<\/span> <span class=\"na\">height<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1080<\/span> <span class=\"p\">},<\/span>\n  <span class=\"p\">});<\/span>\n\n  <span class=\"c1\">\/\/ Open a new page (tab) in the browser<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">page<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">context<\/span><span class=\"p\">.<\/span><span class=\"nf\">newPage<\/span><span class=\"p\">();<\/span>\n\n  <span class=\"c1\">\/\/ Now, we can use the page object for all our automation tasks<\/span>\n<span class=\"p\">})();<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0647\u0646\u06af\u0627\u0645\u06cc \u06a9\u0647 \u06cc\u06a9 \u0645\u0631\u0648\u0631\u06af\u0631 \u0648 \u0635\u0641\u062d\u0647 \u0622\u0645\u0627\u062f\u0647 \u06a9\u0631\u062f\u06cc\u0645\u060c \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc \u0627\u0635\u0644\u06cc Playwright \u0631\u0627 \u0628\u0631\u0631\u0633\u06cc \u06a9\u0646\u06cc\u0645\u060c \u06a9\u0647 \u0647\u0631 \u0686\u06cc\u0632\u06cc \u0631\u0627 \u06a9\u0647 \u0628\u0631\u0627\u06cc \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u06a9\u0627\u0631\u0622\u0645\u062f \u0646\u06cc\u0627\u0632 \u0627\u0633\u062a \u0631\u0627 \u067e\u0648\u0634\u0634 \u0645\u06cc\u200c\u062f\u0647\u062f:<\/p>\n<ul>\n<li>  <strong>\u0646\u0627\u0648\u0628\u0631\u06cc:<\/strong> \u06cc\u06a9 \u0635\u0641\u062d\u0647 \u0648\u0628 \u0631\u0627 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u06a9\u0646\u06cc\u062f <code>page.goto()<\/code>.<\/li>\n<li>  <strong>\u06a9\u0644\u06cc\u06a9 \u062f\u06a9\u0645\u0647:<\/strong> \u06a9\u0644\u06cc\u06a9 \u0631\u0648\u06cc \u062f\u06a9\u0645\u0647 \u0647\u0627 \u06cc\u0627 \u0644\u06cc\u0646\u06a9 \u0647\u0627 \u0631\u0627 \u0634\u0628\u06cc\u0647 \u0633\u0627\u0632\u06cc \u06a9\u0646\u06cc\u062f.<\/li>\n<li>  <strong>\u0648\u0631\u0648\u062f\u06cc \u0645\u062a\u0646:<\/strong> \u0645\u062a\u0646 \u0631\u0627 \u062f\u0631 \u0641\u0631\u0645 \u0647\u0627 \u06cc\u0627 \u062c\u0639\u0628\u0647 \u0647\u0627\u06cc \u062c\u0633\u062a\u062c\u0648 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f.<\/li>\n<li>  <strong>\u0627\u062c\u0631\u0627\u06cc \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a:<\/strong> \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0633\u0641\u0627\u0631\u0634\u06cc \u0631\u0627 \u062f\u0631 \u0635\u0641\u062d\u0647 \u0627\u062c\u0631\u0627 \u06a9\u0646\u06cc\u062f.<\/li>\n<li>  <strong>\u062f\u0631 \u0627\u0646\u062a\u0638\u0627\u0631 \u0645\u0637\u0627\u0644\u0628:<\/strong> \u0642\u0628\u0644 \u0627\u0632 \u062a\u0639\u0627\u0645\u0644\u060c \u0627\u0637\u0645\u06cc\u0646\u0627\u0646 \u062d\u0627\u0635\u0644 \u06a9\u0646\u06cc\u062f \u06a9\u0647 \u0639\u0646\u0627\u0635\u0631 \u0628\u0647 \u0637\u0648\u0631 \u06a9\u0627\u0645\u0644 \u0628\u0627\u0631\u06af\u0630\u0627\u0631\u06cc \u0634\u062f\u0647 \u0627\u0646\u062f.<\/li>\n<\/ul>\n<p>\u0628\u06cc\u0627\u06cc\u06cc\u062f \u0627\u0632 Playwright \u0628\u0631\u0627\u06cc \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0648\u06cc\u062f\u0626\u0648\u06cc\u06cc \u067e\u0648\u06cc\u0627 \u0627\u0632 \u0628\u062e\u0634 \u0647\u0646\u0631 Twitch \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645. \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0686\u06cc\u0632\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0645\u0627 \u0627\u0646\u062c\u0627\u0645 \u062e\u0648\u0627\u0647\u06cc\u0645 \u062f\u0627\u062f:<\/p>\n<ol>\n<li>  \u06cc\u06a9 \u0646\u0645\u0648\u0646\u0647 \u0645\u0631\u0648\u0631\u06af\u0631 \u0631\u0627 \u0634\u0631\u0648\u0639 \u06a9\u0646\u06cc\u062f\u060c \u06cc\u06a9 \u0632\u0645\u06cc\u0646\u0647 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f \u0648 \u06cc\u06a9 \u0635\u0641\u062d\u0647 \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f.<\/li>\n<li>  \u062d\u0631\u06a9\u062a \u0628\u0647 <code>https:\/\/twitch.tv\/directory\/game\/Art<\/code>.<\/li>\n<li>  \u0635\u0628\u0631 \u06a9\u0646\u06cc\u062f \u062a\u0627 \u0635\u0641\u062d\u0647 \u0628\u0647 \u0637\u0648\u0631 \u06a9\u0627\u0645\u0644 \u0644\u0648\u062f \u0634\u0648\u062f.<\/li>\n<li>  \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc \u067e\u0648\u06cc\u0627\u060c \u0645\u0627\u0646\u0646\u062f \u0639\u0646\u0627\u0648\u06cc\u0646 \u062c\u0631\u06cc\u0627\u0646\u060c \u062a\u0639\u062f\u0627\u062f \u0628\u06cc\u0646\u0646\u062f\u06af\u0627\u0646 \u0648 \u062c\u0632\u0626\u06cc\u0627\u062a \u0633\u0627\u0632\u0646\u062f\u0647 \u0631\u0627 \u062a\u062c\u0632\u06cc\u0647 \u0648 \u0627\u0633\u062a\u062e\u0631\u0627\u062c \u06a9\u0646\u06cc\u062f.<\/li>\n<\/ol>\n<p>\u0628\u06cc\u0627\u06cc\u06cc\u062f \u0622\u0646 \u0631\u0627 \u06af\u0627\u0645 \u0628\u0647 \u06af\u0627\u0645\u060c \u0628\u0627 \u0646\u0627\u0648\u0628\u0631\u06cc \u0648 \u0627\u0646\u062a\u0638\u0627\u0631 \u0634\u0631\u0648\u0639 \u06a9\u0646\u06cc\u0645.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D9%86%D8%A7%D9%88%D8%A8%D8%B1%DB%8C_%D9%88_%D8%A7%D9%86%D8%AA%D8%B8%D8%A7%D8%B1\"><\/span>\n<p>  \u0646\u0627\u0648\u0628\u0631\u06cc \u0648 \u0627\u0646\u062a\u0638\u0627\u0631<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0628\u0631\u0627\u06cc \u067e\u06cc\u0645\u0627\u06cc\u0634 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645 <code>page.goto()<\/code> \u0639\u0645\u0644\u06a9\u0631\u062f\u06cc \u06a9\u0647 \u0645\u0631\u0648\u0631\u06af\u0631 \u0631\u0627 \u0628\u0647 \u0647\u0631 URL \u0647\u062f\u0627\u06cc\u062a \u0645\u06cc \u06a9\u0646\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">chromium<\/span> <span class=\"p\">}<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">require<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">playwright<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n\n<span class=\"p\">(<\/span><span class=\"k\">async <\/span><span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">browser<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">chromium<\/span><span class=\"p\">.<\/span><span class=\"nf\">launch<\/span><span class=\"p\">({<\/span> <span class=\"na\">headless<\/span><span class=\"p\">:<\/span> <span class=\"kc\">false<\/span> <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">context<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">newContext<\/span><span class=\"p\">({<\/span>\n    <span class=\"na\">viewport<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span> <span class=\"na\">width<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1920<\/span><span class=\"p\">,<\/span> <span class=\"na\">height<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1080<\/span> <span class=\"p\">},<\/span>\n  <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">page<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">context<\/span><span class=\"p\">.<\/span><span class=\"nf\">newPage<\/span><span class=\"p\">();<\/span>\n\n  <span class=\"k\">try<\/span> <span class=\"p\">{<\/span>\n    <span class=\"c1\">\/\/ Navigate to the URL<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">goto<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/twitch.tv\/directory\/game\/Art<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n\n    <span class=\"kd\">const<\/span> <span class=\"nx\">content<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">content<\/span><span class=\"p\">();<\/span>\n\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"nx\">content<\/span><span class=\"p\">);<\/span>\n  <span class=\"p\">}<\/span> <span class=\"k\">catch <\/span><span class=\"p\">(<\/span><span class=\"nx\">error<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">error<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">An error occurred:<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"nx\">error<\/span><span class=\"p\">);<\/span>\n  <span class=\"p\">}<\/span> <span class=\"k\">finally<\/span> <span class=\"p\">{<\/span>\n    <span class=\"c1\">\/\/ Close the browser<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">close<\/span><span class=\"p\">();<\/span>\n  <span class=\"p\">}<\/span>\n<span class=\"p\">})();<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0628\u0627 \u0627\u06cc\u0646 \u062d\u0627\u0644\u060c \u0628\u0631\u0627\u06cc \u0648\u0628 \u0633\u0627\u06cc\u062a \u0647\u0627\u06cc \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0633\u0646\u06af\u06cc\u0646 \u0645\u0627\u0646\u0646\u062f twitch.tv \u0645\u0627 <code>page.content()<\/code> \u06a9\u062f \u0645\u0645\u06a9\u0646 \u0627\u0633\u062a \u0642\u0628\u0644 \u0627\u0632 \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u0647\u0645\u0647 \u0686\u06cc\u0632\u060c \u062f\u0627\u062f\u0647 \u0647\u0627 \u0631\u0627 \u067e\u06cc\u0634 \u0627\u0632 \u0645\u0648\u0639\u062f \u0628\u0627\u0632\u06af\u0631\u062f\u0627\u0646\u062f.<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0627\u0637\u0645\u06cc\u0646\u0627\u0646 \u0627\u0632 \u0627\u06cc\u0646\u06a9\u0647 \u0627\u06cc\u0646 \u0627\u062a\u0641\u0627\u0642 \u0646\u0645\u06cc \u0627\u0641\u062a\u062f\u060c \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u0645\u0646\u062a\u0638\u0631 \u0628\u0627\u0634\u06cc\u0645 \u062a\u0627 \u06cc\u06a9 \u0639\u0646\u0635\u0631 \u062e\u0627\u0635 \u062f\u0631 \u0635\u0641\u062d\u0647 \u0638\u0627\u0647\u0631 \u0634\u0648\u062f. \u0628\u0647 \u0639\u0628\u0627\u0631\u062a \u062f\u06cc\u06af\u0631\u060c \u0627\u06af\u0631 \u0644\u06cc\u0633\u062a \u0648\u06cc\u062f\u06cc\u0648\u0647\u0627 \u062f\u0631 \u0635\u0641\u062d\u0647 \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f\u060c \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0628\u0627 \u062e\u06cc\u0627\u0644 \u0631\u0627\u062d\u062a \u0641\u0631\u0636 \u06a9\u0646\u06cc\u0645 \u06a9\u0647 \u0635\u0641\u062d\u0647 \u0628\u0627\u0631\u06af\u0630\u0627\u0631\u06cc \u0634\u062f\u0647 \u0627\u0633\u062a:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">goto<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/twitch.tv\/directory\/game\/Art<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n<span class=\"c1\">\/\/ wait for first result to appear<\/span>\n<span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">waitForSelector<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">div[data-target=directory-first-item]<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n<span class=\"c1\">\/\/ retrieve final HTML content<\/span>\n<span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">content<\/span><span class=\"p\">());<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0631 \u0628\u0627\u0644\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0631\u062f\u06cc\u0645 <code>page.waitForSelector()<\/code> \u062a\u0627\u0628\u0639 \u0645\u0646\u062a\u0638\u0631 \u0645\u0627\u0646\u062f\u0646 \u0639\u0646\u0635\u0631\u06cc \u0627\u0633\u062a \u06a9\u0647 \u062a\u0648\u0633\u0637 \u0627\u0646\u062a\u062e\u0627\u0628\u06af\u0631 CSS \u0645\u0627 \u062f\u0631 \u0635\u0641\u062d\u0647 \u0638\u0627\u0647\u0631 \u0645\u06cc \u0634\u0648\u062f.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%AA%D8%AC%D8%B2%DB%8C%D9%87_%D8%AF%D8%A7%D8%AF%D9%87_%D9%87%D8%A7\"><\/span>\n<p>  \u062a\u062c\u0632\u06cc\u0647 \u062f\u0627\u062f\u0647 \u0647\u0627<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0627\u0632 \u0622\u0646\u062c\u0627\u06cc\u06cc \u06a9\u0647 Playwright \u0627\u0632 \u06cc\u06a9 \u0645\u0631\u0648\u0631\u06af\u0631 \u0648\u0628 \u0648\u0627\u0642\u0639\u06cc \u0628\u0627 \u0645\u062d\u06cc\u0637 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u06a9\u0646\u062f\u060c \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u0632 \u0642\u0627\u0628\u0644\u06cc\u062a \u062a\u062c\u0632\u06cc\u0647 HTML \u0645\u0631\u0648\u0631\u06af\u0631 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645. \u062f\u0631 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0627\u06cc\u0646 \u0627\u0632 \u0637\u0631\u06cc\u0642 \u0627\u062c\u0631\u0627 \u0645\u06cc \u0634\u0648\u062f <code>locators<\/code> \u0648\u06cc\u0698\u06af\u06cc:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"p\">(<\/span><span class=\"k\">async <\/span><span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">browser<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">chromium<\/span><span class=\"p\">.<\/span><span class=\"nf\">launch<\/span><span class=\"p\">({<\/span> <span class=\"na\">headless<\/span><span class=\"p\">:<\/span> <span class=\"kc\">false<\/span> <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">context<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">newContext<\/span><span class=\"p\">({<\/span>\n    <span class=\"na\">viewport<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span> <span class=\"na\">width<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1920<\/span><span class=\"p\">,<\/span> <span class=\"na\">height<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1080<\/span> <span class=\"p\">},<\/span>\n  <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">page<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">context<\/span><span class=\"p\">.<\/span><span class=\"nf\">newPage<\/span><span class=\"p\">();<\/span>\n\n  <span class=\"k\">try<\/span> <span class=\"p\">{<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">goto<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/twitch.tv\/directory\/game\/Art<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ Go to the URL<\/span>\n\n    <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">waitForSelector<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">div[data-target=\"directory-first-item\"]<\/span><span class=\"dl\">'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ Wait for the content to load<\/span>\n\n    <span class=\"c1\">\/\/ Locate all stream boxes<\/span>\n    <span class=\"kd\">const<\/span> <span class=\"nx\">streamBoxes<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span>\n      <span class=\"p\">.<\/span><span class=\"nf\">locator<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">\/\/div[contains(@class,\"tw-tower\")]\/div[@data-target]<\/span><span class=\"dl\">'<\/span><span class=\"p\">)<\/span>\n      <span class=\"p\">.<\/span><span class=\"nf\">elementHandles<\/span><span class=\"p\">();<\/span>\n\n    <span class=\"c1\">\/\/ Parse data from each stream box<\/span>\n    <span class=\"kd\">const<\/span> <span class=\"nx\">parsed<\/span> <span class=\"o\">=<\/span> <span class=\"p\">[];<\/span>\n    <span class=\"k\">for <\/span><span class=\"p\">(<\/span><span class=\"kd\">const<\/span> <span class=\"nx\">box<\/span> <span class=\"k\">of<\/span> <span class=\"nx\">streamBoxes<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">title<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">box<\/span><span class=\"p\">.<\/span><span class=\"nf\">$eval<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">h3<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"p\">(<\/span><span class=\"nx\">el<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">el<\/span><span class=\"p\">.<\/span><span class=\"nx\">innerText<\/span><span class=\"p\">);<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">url<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">box<\/span><span class=\"p\">.<\/span><span class=\"nf\">$eval<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">.tw-link<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"p\">(<\/span><span class=\"nx\">el<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">el<\/span><span class=\"p\">.<\/span><span class=\"nf\">getAttribute<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">href<\/span><span class=\"dl\">\"<\/span><span class=\"p\">));<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">username<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">box<\/span><span class=\"p\">.<\/span><span class=\"nf\">$eval<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">.tw-link<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"p\">(<\/span><span class=\"nx\">el<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">el<\/span><span class=\"p\">.<\/span><span class=\"nx\">innerText<\/span><span class=\"p\">);<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">viewers<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">box<\/span><span class=\"p\">.<\/span><span class=\"nf\">$eval<\/span><span class=\"p\">(<\/span>\n        <span class=\"dl\">\"<\/span><span class=\"s2\">.tw-media-card-stat<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n        <span class=\"p\">(<\/span><span class=\"nx\">el<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">el<\/span><span class=\"p\">.<\/span><span class=\"nx\">innerText<\/span>\n      <span class=\"p\">);<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">tagsElement<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">box<\/span><span class=\"p\">.<\/span><span class=\"nf\">$<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">.tw-tag<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n      <span class=\"c1\">\/\/ tags are not always present:<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">tags<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">tagsElement<\/span> <span class=\"p\">?<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">tagsElement<\/span><span class=\"p\">.<\/span><span class=\"nf\">innerText<\/span><span class=\"p\">()<\/span> <span class=\"p\">:<\/span> <span class=\"kc\">null<\/span><span class=\"p\">;<\/span>\n\n      <span class=\"nx\">parsed<\/span><span class=\"p\">.<\/span><span class=\"nf\">push<\/span><span class=\"p\">({<\/span>\n        <span class=\"nx\">title<\/span><span class=\"p\">,<\/span>\n        <span class=\"nx\">url<\/span><span class=\"p\">,<\/span>\n        <span class=\"nx\">username<\/span><span class=\"p\">,<\/span>\n        <span class=\"nx\">viewers<\/span><span class=\"p\">,<\/span>\n        <span class=\"nx\">tags<\/span><span class=\"p\">,<\/span>\n      <span class=\"p\">});<\/span>\n    <span class=\"p\">}<\/span>\n\n    <span class=\"k\">for <\/span><span class=\"p\">(<\/span><span class=\"kd\">const<\/span> <span class=\"nx\">video<\/span> <span class=\"k\">of<\/span> <span class=\"nx\">parsed<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n      <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"nx\">video<\/span><span class=\"p\">);<\/span>\n    <span class=\"p\">}<\/span>\n  <span class=\"p\">}<\/span> <span class=\"k\">catch <\/span><span class=\"p\">(<\/span><span class=\"nx\">error<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">error<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">An error occurred:<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"nx\">error<\/span><span class=\"p\">);<\/span>\n  <span class=\"p\">}<\/span> <span class=\"k\">finally<\/span> <span class=\"p\">{<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">close<\/span><span class=\"p\">();<\/span> <span class=\"c1\">\/\/ Close the browser<\/span>\n  <span class=\"p\">}<\/span>\n<span class=\"p\">})();<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062e\u0631\u0648\u062c\u06cc \u0646\u0645\u0648\u0646\u0647<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight json\"><code><span class=\"p\">[<\/span><span class=\"w\">\n<\/span><span class=\"p\">{<\/span><span class=\"w\">\n  <\/span><span class=\"err\">title:<\/span><span class=\"w\"> <\/span><span class=\"err\">'\u2716<\/span><span class=\"w\"> <\/span><span class=\"err\">first<\/span><span class=\"w\"> <\/span><span class=\"err\">stream<\/span><span class=\"w\"> <\/span><span class=\"err\">of<\/span><span class=\"w\"> <\/span><span class=\"err\">the<\/span><span class=\"w\"> <\/span><span class=\"err\">new<\/span><span class=\"w\"> <\/span><span class=\"err\">year<\/span><span class=\"w\"> <\/span><span class=\"err\">YIPPIE<\/span><span class=\"w\"> <\/span><span class=\"err\">(<\/span><span class=\"w\"> <\/span><span class=\"err\">\u2022\u0300\u1d17\u2022\u0301<\/span><span class=\"w\"> <\/span><span class=\"err\">)\u0648<\/span><span class=\"w\"> <\/span><span class=\"err\">\u0311<\/span><span class=\"w\"> <\/span><span class=\"err\">|<\/span><span class=\"w\"> <\/span><span class=\"err\">!kofi<\/span><span class=\"w\"> <\/span><span class=\"err\">!merch'<\/span><span class=\"p\">,<\/span><span class=\"w\">\n  <\/span><span class=\"err\">url:<\/span><span class=\"w\"> <\/span><span class=\"err\">'\/littlemisstina'<\/span><span class=\"p\">,<\/span><span class=\"w\">\n  <\/span><span class=\"err\">username:<\/span><span class=\"w\"> <\/span><span class=\"err\">'\u2716<\/span><span class=\"w\"> <\/span><span class=\"err\">first<\/span><span class=\"w\"> <\/span><span class=\"err\">stream<\/span><span class=\"w\"> <\/span><span class=\"err\">of<\/span><span class=\"w\"> <\/span><span class=\"err\">the<\/span><span class=\"w\"> <\/span><span class=\"err\">new<\/span><span class=\"w\"> <\/span><span class=\"err\">year<\/span><span class=\"w\"> <\/span><span class=\"err\">YIPPIE<\/span><span class=\"w\"> <\/span><span class=\"err\">(<\/span><span class=\"w\"> <\/span><span class=\"err\">\u2022\u0300\u1d17\u2022\u0301<\/span><span class=\"w\"> <\/span><span class=\"err\">)\u0648<\/span><span class=\"w\"> <\/span><span class=\"err\">\u0311<\/span><span class=\"w\"> <\/span><span class=\"err\">|<\/span><span class=\"w\"> <\/span><span class=\"err\">!kofi<\/span><span class=\"w\"> <\/span><span class=\"err\">!merch\\n'<\/span><span class=\"w\"> <\/span><span class=\"err\">+<\/span><span class=\"w\">\n    <\/span><span class=\"err\">'\\n'<\/span><span class=\"w\"> <\/span><span class=\"err\">+<\/span><span class=\"w\">\n    <\/span><span class=\"err\">'LittleMissTina'<\/span><span class=\"p\">,<\/span><span class=\"w\">\n  <\/span><span class=\"err\">viewers:<\/span><span class=\"w\"> <\/span><span class=\"err\">'<\/span><span class=\"mi\">751<\/span><span class=\"w\"> <\/span><span class=\"err\">viewers'<\/span><span class=\"p\">,<\/span><span class=\"w\">\n  <\/span><span class=\"err\">tags:<\/span><span class=\"w\"> <\/span><span class=\"err\">'ENVtuber'<\/span><span class=\"w\">\n<\/span><span class=\"p\">}<\/span><span class=\"w\">\n<\/span><span class=\"p\">{<\/span><span class=\"w\">\n  <\/span><span class=\"err\">title:<\/span><span class=\"w\"> <\/span><span class=\"err\">'\u2661<\/span><span class=\"w\"> <\/span><span class=\"err\">Short<\/span><span class=\"w\"> <\/span><span class=\"err\">early<\/span><span class=\"w\"> <\/span><span class=\"err\">stream<\/span><span class=\"w\"> <\/span><span class=\"err\">|<\/span><span class=\"w\"> <\/span><span class=\"err\">(<\/span><span class=\"w\"> <\/span><span class=\"err\">\u0361\u00b0<\/span><span class=\"w\"> <\/span><span class=\"err\">\u035c\u0296<\/span><span class=\"w\"> <\/span><span class=\"err\">\u0361\u00b0))|<\/span><span class=\"w\"> <\/span><span class=\"err\">!socials<\/span><span class=\"w\"> <\/span><span class=\"err\">!discord<\/span><span class=\"w\"> <\/span><span class=\"err\">!boosty<\/span><span class=\"w\"> <\/span><span class=\"err\">!domestika'<\/span><span class=\"p\">,<\/span><span class=\"w\">\n  <\/span><span class=\"err\">url:<\/span><span class=\"w\"> <\/span><span class=\"err\">'\/dzikawa'<\/span><span class=\"p\">,<\/span><span class=\"w\">\n  <\/span><span class=\"err\">username:<\/span><span class=\"w\"> <\/span><span class=\"err\">'\u2661<\/span><span class=\"w\"> <\/span><span class=\"err\">Short<\/span><span class=\"w\"> <\/span><span class=\"err\">early<\/span><span class=\"w\"> <\/span><span class=\"err\">stream<\/span><span class=\"w\"> <\/span><span class=\"err\">|<\/span><span class=\"w\"> <\/span><span class=\"err\">(<\/span><span class=\"w\"> <\/span><span class=\"err\">\u0361\u00b0<\/span><span class=\"w\"> <\/span><span class=\"err\">\u035c\u0296<\/span><span class=\"w\"> <\/span><span class=\"err\">\u0361\u00b0))|<\/span><span class=\"w\"> <\/span><span class=\"err\">!socials<\/span><span class=\"w\"> <\/span><span class=\"err\">!discord<\/span><span class=\"w\"> <\/span><span class=\"err\">!boosty<\/span><span class=\"w\"> <\/span><span class=\"err\">!domestika\\n'<\/span><span class=\"w\"> <\/span><span class=\"err\">+<\/span><span class=\"w\">\n    <\/span><span class=\"err\">'\\n'<\/span><span class=\"w\"> <\/span><span class=\"err\">+<\/span><span class=\"w\">\n    <\/span><span class=\"err\">'Dzikawa'<\/span><span class=\"p\">,<\/span><span class=\"w\">\n  <\/span><span class=\"err\">viewers:<\/span><span class=\"w\"> <\/span><span class=\"err\">'<\/span><span class=\"mi\">122<\/span><span class=\"w\"> <\/span><span class=\"err\">viewers'<\/span><span class=\"p\">,<\/span><span class=\"w\">\n  <\/span><span class=\"err\">tags:<\/span><span class=\"w\"> <\/span><span class=\"err\">'digital'<\/span><span class=\"w\">\n<\/span><span class=\"p\">}<\/span><span class=\"w\">\n    <\/span><span class=\"err\">...<\/span><span class=\"w\">\n  <\/span><span class=\"p\">]<\/span><span class=\"w\">\n<\/span><\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0631 \u06a9\u062f \u0628\u0627\u0644\u0627\u060c \u0647\u0631 \u0628\u0627\u06a9\u0633 \u0646\u062a\u06cc\u062c\u0647 \u0631\u0627 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u0646\u062a\u062e\u0627\u0628\u06af\u0631\u0647\u0627\u06cc XPath \u0627\u0646\u062a\u062e\u0627\u0628 \u06a9\u0631\u062f\u06cc\u0645 \u0648 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u0646\u062a\u062e\u0627\u0628\u06af\u0631\u0647\u0627\u06cc CSS\u060c \u062c\u0632\u0626\u06cc\u0627\u062a \u0631\u0627 \u0627\u0632 \u062f\u0631\u0648\u0646 \u0622\u0646 \u0627\u0633\u062a\u062e\u0631\u0627\u062c \u06a9\u0631\u062f\u06cc\u0645.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%B1%D9%88%DB%8C_%D8%AF%DA%A9%D9%85%D9%87_%D9%87%D8%A7_%D9%88_%D9%88%D8%B1%D9%88%D8%AF%DB%8C_%D9%85%D8%AA%D9%86_%DA%A9%D9%84%DB%8C%DA%A9_%DA%A9%D9%86%DB%8C%D8%AF\"><\/span>\n<p>  \u0631\u0648\u06cc \u062f\u06a9\u0645\u0647 \u0647\u0627 \u0648 \u0648\u0631\u0648\u062f\u06cc \u0645\u062a\u0646 \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u06cc\u062f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0628\u0631\u0627\u06cc \u06a9\u0627\u0648\u0634 \u06a9\u0644\u06cc\u06a9 \u0648 \u0648\u0631\u0648\u062f\u06cc \u0645\u062a\u0646\u060c \u0628\u06cc\u0627\u06cc\u06cc\u062f \u0627\u0633\u06a9\u0631\u0627\u067e\u0631 twitch.tv \u062e\u0648\u062f \u0631\u0627 \u0628\u0627 \u0642\u0627\u0628\u0644\u06cc\u062a \u062c\u0633\u062a\u062c\u0648 \u06af\u0633\u062a\u0631\u0634 \u062f\u0647\u06cc\u0645:<\/p>\n<ol>\n<li>  \u0645\u0627 \u0628\u0647 twitch.tv \u062e\u0648\u0627\u0647\u06cc\u0645 \u0631\u0641\u062a<\/li>\n<li>  \u06a9\u0627\u062f\u0631 \u062c\u0633\u062a\u062c\u0648 \u0631\u0627 \u0627\u0646\u062a\u062e\u0627\u0628 \u06a9\u0646\u06cc\u062f \u0648 \u06cc\u06a9 \u0639\u0628\u0627\u0631\u062a \u062c\u0633\u062a\u062c\u0648 \u0631\u0627 \u0648\u0627\u0631\u062f \u06a9\u0646\u06cc\u062f<\/li>\n<li>  \u0631\u0648\u06cc \u062f\u06a9\u0645\u0647 \u062c\u0633\u062a\u062c\u0648 \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u06cc\u062f \u06cc\u0627 Enter \u0631\u0627 \u0641\u0634\u0627\u0631 \u062f\u0647\u06cc\u062f<\/li>\n<li>  \u0635\u0628\u0631 \u06a9\u0646\u06cc\u062f \u062a\u0627 \u0645\u062d\u062a\u0648\u0627 \u0628\u0627\u0631\u06af\u0630\u0627\u0631\u06cc \u0634\u0648\u062f<\/li>\n<li>  \u0646\u062a\u0627\u06cc\u062c \u0631\u0627 \u062a\u062c\u0632\u06cc\u0647 \u06a9\u0646\u06cc\u062f<\/li>\n<\/ol>\n<p>\u062f\u0631 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0628\u0631\u0627\u06cc \u062a\u0639\u0627\u0645\u0644 \u0628\u0627 \u0645\u0624\u0644\u0641\u0647 \u0647\u0627\u06cc \u0648\u0628\u060c \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u0632 \u0647\u0645\u0627\u0646 \u0639\u0645\u0644\u06a9\u0631\u062f \u0645\u06a9\u0627\u0646 \u06cc\u0627\u0628 \u06a9\u0647 \u062f\u0631 \u062a\u062c\u0632\u06cc\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0631\u062f\u06cc\u0645 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"p\">(<\/span><span class=\"k\">async <\/span><span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">browser<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">chromium<\/span><span class=\"p\">.<\/span><span class=\"nf\">launch<\/span><span class=\"p\">({<\/span> <span class=\"na\">headless<\/span><span class=\"p\">:<\/span> <span class=\"kc\">false<\/span> <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">context<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">newContext<\/span><span class=\"p\">({<\/span>\n    <span class=\"na\">viewport<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span> <span class=\"na\">width<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1920<\/span><span class=\"p\">,<\/span> <span class=\"na\">height<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1080<\/span> <span class=\"p\">},<\/span>\n  <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">page<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">context<\/span><span class=\"p\">.<\/span><span class=\"nf\">newPage<\/span><span class=\"p\">();<\/span>\n\n  <span class=\"k\">try<\/span> <span class=\"p\">{<\/span>\n    <span class=\"c1\">\/\/ Go to the Twitch Art directory<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">goto<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/www.twitch.tv\/directory\/game\/Art<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n\n    <span class=\"c1\">\/\/ Find the search box and enter the query<\/span>\n    <span class=\"kd\">const<\/span> <span class=\"nx\">searchBox<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">locator<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">input[autocomplete=\"twitch-nav-search\"]<\/span><span class=\"dl\">'<\/span><span class=\"p\">);<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">searchBox<\/span><span class=\"p\">.<\/span><span class=\"nf\">type<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">Painting<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"p\">{<\/span> <span class=\"na\">delay<\/span><span class=\"p\">:<\/span> <span class=\"mi\">100<\/span> <span class=\"p\">});<\/span>\n\n    <span class=\"c1\">\/\/ Press Enter to submit the search<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">searchBox<\/span><span class=\"p\">.<\/span><span class=\"nf\">press<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">Enter<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n\n    <span class=\"c1\">\/\/ Alternatively, click the search button explicitly<\/span>\n    <span class=\"c1\">\/\/ const searchButton = page.locator('button[aria-label=\"Search Button\"]');<\/span>\n    <span class=\"c1\">\/\/ await searchButton.click();<\/span>\n\n    <span class=\"c1\">\/\/ Click on the \"Tagged Channels\" link<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">locator<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">.search-results .tw-link[href*=\"all\/tags\"]<\/span><span class=\"dl\">'<\/span><span class=\"p\">).<\/span><span class=\"nf\">click<\/span><span class=\"p\">();<\/span>\n\n    <span class=\"c1\">\/\/ Wait for the results to load<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">waitForSelector<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">div[data-target]<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n\n    <span class=\"c1\">\/\/ Parse the results<\/span>\n    <span class=\"kd\">const<\/span> <span class=\"nx\">parsed<\/span> <span class=\"o\">=<\/span> <span class=\"p\">[];<\/span>\n    <span class=\"kd\">const<\/span> <span class=\"nx\">streamBoxes<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span>\n      <span class=\"p\">.<\/span><span class=\"nf\">locator<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">\/\/div[contains(@class,\"tw-tower\")]\/div[@data-target]<\/span><span class=\"dl\">'<\/span><span class=\"p\">)<\/span>\n      <span class=\"p\">.<\/span><span class=\"nf\">elementHandles<\/span><span class=\"p\">();<\/span>\n\n    <span class=\"k\">for <\/span><span class=\"p\">(<\/span><span class=\"kd\">const<\/span> <span class=\"nx\">box<\/span> <span class=\"k\">of<\/span> <span class=\"nx\">streamBoxes<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">title<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">box<\/span><span class=\"p\">.<\/span><span class=\"nf\">$eval<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">h3<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"p\">(<\/span><span class=\"nx\">el<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">el<\/span><span class=\"p\">.<\/span><span class=\"nx\">innerText<\/span><span class=\"p\">.<\/span><span class=\"nf\">trim<\/span><span class=\"p\">());<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">url<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">box<\/span><span class=\"p\">.<\/span><span class=\"nf\">$eval<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">.tw-link<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"p\">(<\/span><span class=\"nx\">el<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">el<\/span><span class=\"p\">.<\/span><span class=\"nf\">getAttribute<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">href<\/span><span class=\"dl\">\"<\/span><span class=\"p\">));<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">username<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">box<\/span><span class=\"p\">.<\/span><span class=\"nf\">$eval<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">.tw-link<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"p\">(<\/span><span class=\"nx\">el<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">el<\/span><span class=\"p\">.<\/span><span class=\"nx\">innerText<\/span><span class=\"p\">.<\/span><span class=\"nf\">trim<\/span><span class=\"p\">());<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">viewers<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">box<\/span><span class=\"p\">.<\/span><span class=\"nf\">$eval<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">.tw-media-card-stat<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"p\">(<\/span><span class=\"nx\">el<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span>\n        <span class=\"nx\">el<\/span><span class=\"p\">.<\/span><span class=\"nx\">innerText<\/span><span class=\"p\">.<\/span><span class=\"nf\">trim<\/span><span class=\"p\">()<\/span>\n      <span class=\"p\">);<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">tagsElement<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">box<\/span><span class=\"p\">.<\/span><span class=\"nf\">$<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">.tw-tag<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n      <span class=\"kd\">const<\/span> <span class=\"nx\">tags<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">tagsElement<\/span> <span class=\"p\">?<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">tagsElement<\/span><span class=\"p\">.<\/span><span class=\"nf\">innerText<\/span><span class=\"p\">()<\/span> <span class=\"p\">:<\/span> <span class=\"kc\">null<\/span><span class=\"p\">;<\/span>\n\n      <span class=\"nx\">parsed<\/span><span class=\"p\">.<\/span><span class=\"nf\">push<\/span><span class=\"p\">({<\/span>\n        <span class=\"nx\">title<\/span><span class=\"p\">,<\/span>\n        <span class=\"nx\">url<\/span><span class=\"p\">,<\/span>\n        <span class=\"nx\">username<\/span><span class=\"p\">,<\/span>\n        <span class=\"nx\">viewers<\/span><span class=\"p\">,<\/span>\n        <span class=\"nx\">tags<\/span><span class=\"p\">,<\/span>\n      <span class=\"p\">});<\/span>\n    <span class=\"p\">}<\/span>\n\n    <span class=\"c1\">\/\/ Print the parsed data<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"nx\">parsed<\/span><span class=\"p\">);<\/span>\n  <span class=\"p\">}<\/span> <span class=\"k\">catch <\/span><span class=\"p\">(<\/span><span class=\"nx\">error<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">error<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">An error occurred:<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"nx\">error<\/span><span class=\"p\">);<\/span>\n  <span class=\"p\">}<\/span> <span class=\"k\">finally<\/span> <span class=\"p\">{<\/span>\n    <span class=\"c1\">\/\/ Close the browser<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">close<\/span><span class=\"p\">();<\/span>\n  <span class=\"p\">}<\/span>\n<span class=\"p\">})();<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062a\u0648\u062c\u0647: \u0645\u06a9\u0627\u0646 \u06cc\u0627\u0628 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647\u200c\u0646\u0648\u06cc\u0633 \u0627\u062c\u0627\u0632\u0647 \u0627\u0646\u062a\u062e\u0627\u0628\u200c\u06a9\u0646\u0646\u062f\u0647\u200c\u0647\u0627\u06cc\u06cc \u0631\u0627 \u0646\u0645\u06cc\u200c\u062f\u0647\u062f \u06a9\u0647 \u0686\u0646\u062f\u06cc\u0646 \u0645\u0642\u062f\u0627\u0631 \u0631\u0627 \u0628\u0647 \u0647\u0645\u0631\u0627\u0647 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u0646\u062f. \u0646\u0645\u06cc \u062f\u0627\u0646\u0633\u062a \u0631\u0648\u06cc \u06a9\u062f\u0627\u0645 \u06cc\u06a9 \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u062f. \u0628\u0647 \u0627\u06cc\u0646 \u0645\u0639\u0646\u06cc \u06a9\u0647 \u0627\u0646\u062a\u062e\u0627\u0628\u06af\u0631\u0647\u0627\u06cc \u0645\u0627 \u0628\u0627\u06cc\u062f \u0645\u0646\u062d\u0635\u0631 \u0628\u0647 \u06cc\u06a9 \u0639\u0646\u0635\u0631 \u0628\u0627\u0634\u0646\u062f \u06a9\u0647 \u0645\u06cc \u062e\u0648\u0627\u0647\u06cc\u0645 \u0628\u0627 \u0622\u0646 \u062a\u0639\u0627\u0645\u0644 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u0645.<\/p>\n<p>\u0645\u0627 \u0639\u0645\u0644\u06a9\u0631\u062f \u062c\u0633\u062a\u062c\u0648 \u0631\u0627 \u0628\u0647 \u06a9\u0627\u0631 \u0628\u0631\u062f\u06cc\u0645 \u0648 \u0635\u0641\u062d\u0647 \u0627\u0648\u0644 \u0646\u062a\u0627\u06cc\u062c \u0631\u0627 \u0627\u0633\u062a\u062e\u0631\u0627\u062c \u06a9\u0631\u062f\u06cc\u0645\u060c \u0627\u0645\u0627 \u0686\u06af\u0648\u0646\u0647 \u0628\u0642\u06cc\u0647 \u0635\u0641\u062d\u0627\u062a \u0631\u0627 \u062f\u0631\u06cc\u0627\u0641\u062a \u06a9\u0646\u06cc\u0645\u061f \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646 \u0645\u0627 \u0628\u0647 \u0642\u0627\u0628\u0644\u06cc\u062a \u0627\u0633\u06a9\u0631\u0648\u0644 \u0646\u06cc\u0627\u0632 \u062f\u0627\u0631\u06cc\u0645 &#8211; \u0628\u06cc\u0627\u06cc\u06cc\u062f \u0646\u06af\u0627\u0647\u06cc \u0628\u0647 \u0622\u0646 \u0628\u06cc\u0646\u062f\u0627\u0632\u06cc\u0645.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D9%BE%DB%8C%D9%85%D8%A7%DB%8C%D8%B4_%D9%88_%D8%B5%D9%81%D8%AD%D9%87_%D8%A8%D9%86%D8%AF%DB%8C_%D8%A8%DB%8C_%D9%86%D9%87%D8%A7%DB%8C%D8%AA\"><\/span>\n<p>  \u067e\u06cc\u0645\u0627\u06cc\u0634 \u0648 \u0635\u0641\u062d\u0647 \u0628\u0646\u062f\u06cc \u0628\u06cc \u0646\u0647\u0627\u06cc\u062a<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0628\u062e\u0634 \u0646\u062a\u0627\u06cc\u062c \u062c\u0631\u06cc\u0627\u0646 twitch.tv \u0627\u0632 \u0635\u0641\u062d\u0647\u200c\u0628\u0646\u062f\u06cc \u067e\u06cc\u0645\u0627\u06cc\u0634 \u0628\u06cc\u200c\u0646\u0647\u0627\u06cc\u062a \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc\u200c\u06a9\u0646\u062f. \u0628\u0631\u0627\u06cc \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u0628\u0642\u06cc\u0647 \u0646\u062a\u0627\u06cc\u062c \u062f\u0631 \u0627\u0633\u06a9\u0631\u0627\u067e\u0631 Playwright \u0645\u0627 \u0628\u0627\u06cc\u062f \u0628\u0647 \u0637\u0648\u0631 \u0645\u062f\u0627\u0648\u0645 \u0628\u0647 \u0622\u062e\u0631\u06cc\u0646 \u0646\u062a\u06cc\u062c\u0647 \u0642\u0627\u0628\u0644 \u0645\u0634\u0627\u0647\u062f\u0647 \u062f\u0631 \u0635\u0641\u062d\u0647 \u067e\u06cc\u0645\u0627\u06cc\u0634 \u06a9\u0646\u06cc\u0645 \u062a\u0627 \u0628\u0627\u0631\u06af\u0630\u0627\u0631\u06cc \u0635\u0641\u062d\u0627\u062a \u062c\u062f\u06cc\u062f \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u0645.<\/p>\n<p>\u0645\u0627 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u06cc\u0646 \u06a9\u0627\u0631 \u0631\u0627 \u0628\u0627 \u0627\u0633\u06a9\u0631\u0648\u0644 \u06a9\u0631\u062f\u0646 \u0628\u0647 \u067e\u0627\u06cc\u06cc\u0646 \u06a9\u0644 \u0635\u0641\u062d\u0647 \u0627\u0646\u062c\u0627\u0645 \u062f\u0647\u06cc\u0645\u060c \u0627\u0645\u0627 \u0647\u0645\u06cc\u0634\u0647 \u062f\u0631 \u0645\u0631\u0648\u0631\u06af\u0631\u0647\u0627\u06cc \u0628\u062f\u0648\u0646 \u0647\u062f \u06a9\u0627\u0631 \u0646\u0645\u06cc\u200c\u06a9\u0646\u062f. \u06cc\u06a9 \u0631\u0627\u0647 \u0628\u0647\u062a\u0631 \u0627\u06cc\u0646 \u0627\u0633\u062a \u06a9\u0647 \u0647\u0645\u0647 \u0639\u0646\u0627\u0635\u0631 \u0631\u0627 \u067e\u06cc\u062f\u0627 \u06a9\u0646\u06cc\u062f \u0648 \u0622\u062e\u0631\u06cc\u0646 \u0645\u0648\u0631\u062f \u0631\u0627 \u0628\u0647 \u0637\u0648\u0631 \u0635\u0631\u06cc\u062d \u062f\u0631 \u0645\u0639\u0631\u0636 \u062f\u06cc\u062f \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f.<\/p>\n<p>\u062f\u0631 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0627\u06cc\u0646 \u06a9\u0627\u0631 \u0631\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0645\u06a9\u0627\u0646 \u06cc\u0627\u0628 \u0648 <code>scrollIntoViewIfNeeded()<\/code> \u062a\u0627\u0628\u0639 \u0645\u0627 \u0628\u0647 \u067e\u06cc\u0645\u0627\u06cc\u0634 \u0622\u062e\u0631\u06cc\u0646 \u0646\u062a\u06cc\u062c\u0647 \u0628\u0631\u0627\u06cc \u0634\u0631\u0648\u0639 \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u0635\u0641\u062d\u0647 \u0628\u0639\u062f\u06cc \u0627\u062f\u0627\u0645\u0647 \u0645\u06cc \u062f\u0647\u06cc\u0645 \u062a\u0627 \u0632\u0645\u0627\u0646\u06cc \u06a9\u0647 \u0646\u062a\u0627\u06cc\u062c \u062c\u062f\u06cc\u062f\u06cc \u0638\u0627\u0647\u0631 \u0646\u0634\u0648\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"p\">(<\/span><span class=\"k\">async <\/span><span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">browser<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">chromium<\/span><span class=\"p\">.<\/span><span class=\"nf\">launch<\/span><span class=\"p\">({<\/span> <span class=\"na\">headless<\/span><span class=\"p\">:<\/span> <span class=\"kc\">false<\/span> <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">context<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">newContext<\/span><span class=\"p\">({<\/span> <span class=\"na\">viewport<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span> <span class=\"na\">width<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1920<\/span><span class=\"p\">,<\/span> <span class=\"na\">height<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1080<\/span> <span class=\"p\">}<\/span> <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">page<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">context<\/span><span class=\"p\">.<\/span><span class=\"nf\">newPage<\/span><span class=\"p\">();<\/span>\n\n  <span class=\"k\">try<\/span> <span class=\"p\">{<\/span>\n    <span class=\"c1\">\/\/ Go to the Twitch Art directory<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">goto<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">https:\/\/www.twitch.tv\/directory\/game\/Art<\/span><span class=\"dl\">'<\/span><span class=\"p\">);<\/span>\n\n    <span class=\"c1\">\/\/ Wait for the content to fully load<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">waitForSelector<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">div[data-target=\"directory-first-item\"]<\/span><span class=\"dl\">'<\/span><span class=\"p\">);<\/span>\n\n    <span class=\"c1\">\/\/ Loop scrolling until no more new elements are loaded<\/span>\n    <span class=\"kd\">let<\/span> <span class=\"nx\">streamBoxes<\/span><span class=\"p\">;<\/span>\n    <span class=\"k\">while <\/span><span class=\"p\">(<\/span><span class=\"kc\">true<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n      <span class=\"nx\">streamBoxes<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">locator<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">\/\/div[contains(@class,\"tw-tower\")]\/div[@data-target]<\/span><span class=\"dl\">'<\/span><span class=\"p\">).<\/span><span class=\"nf\">elementHandles<\/span><span class=\"p\">();<\/span>\n      <span class=\"k\">await<\/span> <span class=\"nx\">streamBoxes<\/span><span class=\"p\">[<\/span><span class=\"nx\">streamBoxes<\/span><span class=\"p\">.<\/span><span class=\"nx\">length<\/span> <span class=\"o\">-<\/span> <span class=\"mi\">1<\/span><span class=\"p\">].<\/span><span class=\"nf\">scrollIntoViewIfNeeded<\/span><span class=\"p\">();<\/span>\n\n      <span class=\"kd\">const<\/span> <span class=\"nx\">itemsOnPage<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">streamBoxes<\/span><span class=\"p\">.<\/span><span class=\"nx\">length<\/span><span class=\"p\">;<\/span>\n      <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">waitForTimeout<\/span><span class=\"p\">(<\/span><span class=\"mi\">2000<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ Wait for new items to load<\/span>\n\n      <span class=\"kd\">const<\/span> <span class=\"nx\">itemsOnPageAfterScroll<\/span> <span class=\"o\">=<\/span> <span class=\"p\">(<\/span><span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">locator<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">\/\/div[contains(@class,\"tw-tower\")]\/div[@data-target]<\/span><span class=\"dl\">'<\/span><span class=\"p\">).<\/span><span class=\"nf\">elementHandles<\/span><span class=\"p\">()).<\/span><span class=\"nx\">length<\/span><span class=\"p\">;<\/span>\n\n      <span class=\"k\">if <\/span><span class=\"p\">(<\/span><span class=\"nx\">itemsOnPageAfterScroll<\/span> <span class=\"o\">&gt;<\/span> <span class=\"nx\">itemsOnPage<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n        <span class=\"k\">continue<\/span><span class=\"p\">;<\/span> <span class=\"c1\">\/\/ More items loaded - keep scrolling<\/span>\n      <span class=\"p\">}<\/span> <span class=\"k\">else<\/span> <span class=\"p\">{<\/span>\n        <span class=\"k\">break<\/span><span class=\"p\">;<\/span> <span class=\"c1\">\/\/ No more items - break scrolling loop<\/span>\n      <span class=\"p\">}<\/span>\n    <span class=\"p\">}<\/span>\n\n    <span class=\"c1\">\/\/ Parse the data<\/span>\n    <span class=\"kd\">const<\/span> <span class=\"nx\">parsed<\/span> <span class=\"o\">=<\/span> <span class=\"p\">[];<\/span>\n    <span class=\"k\">for <\/span><span class=\"p\">(<\/span><span class=\"kd\">const<\/span> <span class=\"nx\">box<\/span> <span class=\"k\">of<\/span> <span class=\"nx\">streamBoxes<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n        <span class=\"p\">...<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0631 \u06a9\u062f \u0645\u062b\u0627\u0644 \u0628\u0627\u0644\u0627\u060c \u0645\u0627 \u0628\u0647 \u0637\u0648\u0631 \u0645\u062f\u0627\u0648\u0645 \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u0646\u062a\u0627\u06cc\u062c \u062c\u062f\u06cc\u062f \u0631\u0627 \u062a\u0627 \u0631\u0633\u06cc\u062f\u0646 \u0628\u0647 \u067e\u0627\u06cc\u0627\u0646 \u0635\u0641\u062d\u0647 \u0628\u0646\u062f\u06cc \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u0645\u06cc \u06a9\u0646\u06cc\u0645. \u062f\u0631 \u0627\u06cc\u0646 \u0645\u0648\u0631\u062f\u060c \u06a9\u062f \u0645\u0627 \u0628\u0627\u06cc\u062f \u0635\u062f\u0647\u0627 \u0646\u062a\u06cc\u062c\u0647 \u062a\u062c\u0632\u06cc\u0647 \u0634\u062f\u0647 \u062a\u0648\u0644\u06cc\u062f \u06a9\u0646\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%AA%D9%88%D8%A7%D8%A8%D8%B9_%D9%BE%DB%8C%D8%B4%D8%B1%D9%81%D8%AA%D9%87\"><\/span>\n<p>  \u062a\u0648\u0627\u0628\u0639 \u067e\u06cc\u0634\u0631\u0641\u062a\u0647<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0645\u0627 \u0631\u0627\u06cc\u062c\u200c\u062a\u0631\u06cc\u0646 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647\u200c\u0646\u0648\u06cc\u0633 \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u062f\u0631 \u0627\u0633\u06a9\u0631\u0627\u067e\u06cc\u0646\u06af \u0648\u0628 \u0631\u0627 \u067e\u0648\u0634\u0634 \u062f\u0627\u062f\u0647\u200c\u0627\u06cc\u0645: \u067e\u06cc\u0645\u0627\u06cc\u0634\u060c \u0627\u0646\u062a\u0638\u0627\u0631\u060c \u06a9\u0644\u06cc\u06a9 \u06a9\u0631\u062f\u0646\u060c \u062a\u0627\u06cc\u067e \u06a9\u0631\u062f\u0646 \u0648 \u067e\u06cc\u0645\u0627\u06cc\u0634. \u0628\u0627 \u0627\u06cc\u0646 \u062d\u0627\u0644\u060c \u0686\u0646\u062f \u0648\u06cc\u0698\u06af\u06cc \u067e\u06cc\u0634\u0631\u0641\u062a\u0647 \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f \u06a9\u0647 \u0628\u0631\u0627\u06cc \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0627\u0647\u062f\u0627\u0641 \u067e\u06cc\u0686\u06cc\u062f\u0647 \u062a\u0631 \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u0645\u0641\u06cc\u062f \u0627\u0633\u062a.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%A7%D8%B1%D8%B2%DB%8C%D8%A7%D8%A8%DB%8C_%D8%AC%D8%A7%D9%88%D8%A7_%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA\"><\/span>\n<p>  \u0627\u0631\u0632\u06cc\u0627\u0628\u06cc \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u0647\u0631 \u06a9\u062f \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0631\u0627 \u062f\u0631 \u0632\u0645\u06cc\u0646\u0647 \u0635\u0641\u062d\u0647 \u0641\u0639\u0644\u06cc \u0627\u0631\u0632\u06cc\u0627\u0628\u06cc \u06a9\u0646\u062f. \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u062a\u0645\u0627\u0645 \u06a9\u0627\u0631\u0647\u0627\u06cc\u06cc \u0631\u0627 \u06a9\u0647 \u0642\u0628\u0644\u0627 \u0627\u0646\u062c\u0627\u0645 \u062f\u0627\u062f\u0647\u200c\u0627\u06cc\u0645\u060c \u0645\u0627\u0646\u0646\u062f \u067e\u06cc\u0645\u0627\u06cc\u0634\u060c \u06a9\u0644\u06cc\u06a9 \u06a9\u0631\u062f\u0646\u060c \u067e\u06cc\u0645\u0627\u06cc\u0634 \u0648 \u062d\u062a\u06cc \u0628\u06cc\u0634\u062a\u0631 \u0627\u0646\u062c\u0627\u0645 \u062f\u0647\u06cc\u0645! \u062f\u0631 \u0648\u0627\u0642\u0639\u060c \u0628\u0633\u06cc\u0627\u0631\u06cc \u0627\u0632 \u0627\u06cc\u0646 \u0639\u0645\u0644\u06a9\u0631\u062f\u0647\u0627\u06cc \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0627\u0632 \u0637\u0631\u06cc\u0642 \u0627\u0631\u0632\u06cc\u0627\u0628\u06cc \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0627\u062c\u0631\u0627 \u0645\u06cc \u0634\u0648\u0646\u062f.<\/p>\n<p>\u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644\u060c \u0627\u06af\u0631 \u067e\u06cc\u0645\u0627\u06cc\u0634 \u062f\u0627\u062e\u0644\u06cc \u0628\u0627 \u0645\u0634\u06a9\u0644 \u0645\u0648\u0627\u062c\u0647 \u0634\u062f\u060c \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u062a\u0627\u0628\u0639 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u067e\u06cc\u0645\u0627\u06cc\u0634\u06cc \u062e\u0648\u062f \u0631\u0627 \u062a\u0639\u0631\u06cc\u0641 \u06a9\u0631\u062f\u0647 \u0648 \u0622\u0646 \u0631\u0627 \u0628\u0647 Playwright \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u06cc\u0645:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">evaluate<\/span><span class=\"p\">(()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">items<\/span> <span class=\"o\">=<\/span> <span class=\"nb\">document<\/span><span class=\"p\">.<\/span><span class=\"nf\">querySelectorAll<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">.tw-tower &gt; div<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n  <span class=\"k\">if <\/span><span class=\"p\">(<\/span><span class=\"nx\">items<\/span><span class=\"p\">.<\/span><span class=\"nx\">length<\/span> <span class=\"o\">&gt;<\/span> <span class=\"mi\">0<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">items<\/span><span class=\"p\">[<\/span><span class=\"nx\">items<\/span><span class=\"p\">.<\/span><span class=\"nx\">length<\/span> <span class=\"o\">-<\/span> <span class=\"mi\">1<\/span><span class=\"p\">].<\/span><span class=\"nf\">scrollIntoView<\/span><span class=\"p\">({<\/span>\n      <span class=\"na\">behavior<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">smooth<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n      <span class=\"na\">block<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">end<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n      <span class=\"na\">inline<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">end<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n    <span class=\"p\">});<\/span>\n  <span class=\"p\">}<\/span>\n<span class=\"p\">});<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u06a9\u062f \u0628\u0627\u0644\u0627 \u0622\u062e\u0631\u06cc\u0646 \u0646\u062a\u06cc\u062c\u0647 \u0631\u0627 \u0645\u0627\u0646\u0646\u062f \u0642\u0628\u0644 \u0628\u0647 \u0646\u0645\u0627\u06cc\u0634 \u062f\u0631 \u0645\u06cc \u0622\u0648\u0631\u062f\u060c \u0627\u0645\u0627 \u0628\u0647 \u0622\u0631\u0627\u0645\u06cc \u0648 \u0628\u0647 \u0644\u0628\u0647 \u0634\u06cc\u0621 \u062d\u0631\u06a9\u062a \u0645\u06cc \u06a9\u0646\u062f. \u0627\u06cc\u0646 \u0631\u0648\u06cc\u06a9\u0631\u062f \u062f\u0631 \u0645\u0642\u0627\u06cc\u0633\u0647 \u0628\u0627 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0628\u0647 \u0627\u062d\u062a\u0645\u0627\u0644 \u0632\u06cc\u0627\u062f \u0628\u0627\u0639\u062b \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u0635\u0641\u062d\u0647 \u0628\u0639\u062f\u06cc \u0645\u06cc \u0634\u0648\u062f <code>scrollIntoViewIfNeeded<\/code> \u062a\u0627\u0628\u0639<\/p>\n<p>\u0627\u0631\u0632\u06cc\u0627\u0628\u06cc \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u06cc\u06a9 \u0648\u06cc\u0698\u06af\u06cc \u0642\u062f\u0631\u062a\u0645\u0646\u062f \u0627\u0633\u062a \u06a9\u0647 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646 \u0627\u0632 \u0622\u0646 \u0628\u0631\u0627\u06cc \u062d\u0630\u0641 \u0628\u0631\u0646\u0627\u0645\u0647\u200c\u0647\u0627\u06cc \u0648\u0628 \u067e\u06cc\u0686\u06cc\u062f\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0631\u062f\u060c \u0632\u06cc\u0631\u0627 \u0628\u0647 \u0645\u0627 \u06a9\u0646\u062a\u0631\u0644 \u06a9\u0627\u0645\u0644 \u0642\u0627\u0628\u0644\u06cc\u062a\u200c\u0647\u0627\u06cc \u0645\u0631\u0648\u0631\u06af\u0631 \u0631\u0627 \u0627\u0632 \u0637\u0631\u06cc\u0642 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0645\u06cc\u200c\u062f\u0647\u062f.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%B1%D9%87%DA%AF%DB%8C%D8%B1%DB%8C_%D8%AF%D8%B1%D8%AE%D9%88%D8%A7%D8%B3%D8%AA_%D9%88_%D9%BE%D8%A7%D8%B3%D8%AE\"><\/span>\n<p>  \u0631\u0647\u06af\u06cc\u0631\u06cc \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0648 \u067e\u0627\u0633\u062e<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647\u200c\u0646\u0648\u06cc\u0633 \u062a\u0645\u0627\u0645 \u062f\u0631\u062e\u0648\u0627\u0633\u062a\u200c\u0647\u0627\u06cc \u067e\u0633\u200c\u0632\u0645\u06cc\u0646\u0647 \u0648 \u067e\u0627\u0633\u062e\u200c\u0647\u0627\u06cc\u06cc \u0631\u0627 \u06a9\u0647 \u0645\u0631\u0648\u0631\u06af\u0631 \u0627\u0631\u0633\u0627\u0644 \u0648 \u062f\u0631\u06cc\u0627\u0641\u062a \u0645\u06cc\u200c\u06a9\u0646\u062f\u060c \u062f\u0646\u0628\u0627\u0644 \u0645\u06cc\u200c\u06a9\u0646\u062f. \u062f\u0631 \u0627\u0633\u06a9\u0631\u0627\u067e\u06cc\u0646\u06af \u0648\u0628\u060c \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u0632 \u0627\u06cc\u0646 \u0628\u0631\u0627\u06cc \u0627\u0635\u0644\u0627\u062d \u062f\u0631\u062e\u0648\u0627\u0633\u062a\u200c\u0647\u0627\u06cc \u067e\u0633\u200c\u0632\u0645\u06cc\u0646\u0647 \u06cc\u0627 \u062c\u0645\u0639\u200c\u0622\u0648\u0631\u06cc \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc \u0645\u062e\u0641\u06cc \u0627\u0632 \u067e\u0627\u0633\u062e\u200c\u0647\u0627\u06cc \u067e\u0633\u200c\u0632\u0645\u06cc\u0646\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">chromium<\/span> <span class=\"p\">}<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">require<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">playwright<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n\n<span class=\"c1\">\/\/ Function to intercept requests<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">interceptRequest<\/span> <span class=\"o\">=<\/span> <span class=\"p\">(<\/span><span class=\"nx\">request<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"c1\">\/\/ Update requests with custom headers<\/span>\n  <span class=\"k\">if <\/span><span class=\"p\">(<\/span><span class=\"nx\">request<\/span><span class=\"p\">.<\/span><span class=\"nf\">url<\/span><span class=\"p\">().<\/span><span class=\"nf\">includes<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">secret<\/span><span class=\"dl\">\"<\/span><span class=\"p\">))<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">request<\/span><span class=\"p\">.<\/span><span class=\"nf\">headers<\/span><span class=\"p\">({<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">x-secret-token<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">123<\/span><span class=\"dl\">\"<\/span> <span class=\"p\">});<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">patched headers of a secret request<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n  <span class=\"p\">}<\/span>\n  <span class=\"c1\">\/\/ Adjust sent data for POST requests<\/span>\n  <span class=\"k\">if <\/span><span class=\"p\">(<\/span><span class=\"nx\">request<\/span><span class=\"p\">.<\/span><span class=\"nf\">method<\/span><span class=\"p\">()<\/span> <span class=\"o\">===<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">POST<\/span><span class=\"dl\">\"<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">request<\/span><span class=\"p\">.<\/span><span class=\"nf\">postData<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">patched<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">patched POST request<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n  <span class=\"p\">}<\/span>\n<span class=\"p\">};<\/span>\n\n<span class=\"c1\">\/\/ Function to intercept responses<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">interceptResponse<\/span> <span class=\"o\">=<\/span> <span class=\"p\">(<\/span><span class=\"nx\">response<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"c1\">\/\/ Extract details from background requests<\/span>\n  <span class=\"k\">if <\/span><span class=\"p\">(<\/span><span class=\"nx\">response<\/span><span class=\"p\">.<\/span><span class=\"nf\">request<\/span><span class=\"p\">().<\/span><span class=\"nf\">resourceType<\/span><span class=\"p\">()<\/span> <span class=\"o\">===<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">xhr<\/span><span class=\"dl\">\"<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"nx\">response<\/span><span class=\"p\">.<\/span><span class=\"nf\">headers<\/span><span class=\"p\">()[<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">cookie<\/span><span class=\"dl\">\"<\/span><span class=\"p\">]);<\/span>\n  <span class=\"p\">}<\/span>\n<span class=\"p\">};<\/span>\n\n<span class=\"p\">(<\/span><span class=\"k\">async <\/span><span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">browser<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">chromium<\/span><span class=\"p\">.<\/span><span class=\"nf\">launch<\/span><span class=\"p\">({<\/span> <span class=\"na\">headless<\/span><span class=\"p\">:<\/span> <span class=\"kc\">false<\/span> <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">context<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">newContext<\/span><span class=\"p\">({<\/span>\n    <span class=\"na\">viewport<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span> <span class=\"na\">width<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1920<\/span><span class=\"p\">,<\/span> <span class=\"na\">height<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1080<\/span> <span class=\"p\">},<\/span>\n  <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">page<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">context<\/span><span class=\"p\">.<\/span><span class=\"nf\">newPage<\/span><span class=\"p\">();<\/span>\n\n  <span class=\"c1\">\/\/ Enable intercepting for this page<\/span>\n  <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">on<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">request<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"nx\">interceptRequest<\/span><span class=\"p\">);<\/span>\n  <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">on<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">response<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"nx\">interceptResponse<\/span><span class=\"p\">);<\/span>\n\n  <span class=\"c1\">\/\/ Navigate to the Twitch Art directory<\/span>\n  <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">goto<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/www.twitch.tv\/directory\/game\/Art<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n  <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">waitForSelector<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">div[data-target=\"directory-first-item\"]<\/span><span class=\"dl\">'<\/span><span class=\"p\">);<\/span>\n\n  <span class=\"c1\">\/\/ Close the browser<\/span>\n  <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">close<\/span><span class=\"p\">();<\/span>\n<span class=\"p\">})();<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0631 \u0645\u062b\u0627\u0644 \u0628\u0627\u0644\u0627\u060c \u0639\u0645\u0644\u06a9\u0631\u062f\u0647\u0627\u06cc \u0631\u0647\u06af\u06cc\u0631 \u062e\u0648\u062f \u0631\u0627 \u062a\u0639\u0631\u06cc\u0641 \u06a9\u0631\u062f\u0647 \u0648 \u0628\u0647 \u0635\u0641\u062d\u0647 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u062e\u0648\u062f \u0645\u062a\u0635\u0644 \u0645\u06cc \u06a9\u0646\u06cc\u0645. \u0627\u06cc\u0646 \u0628\u0647 \u0645\u0627 \u0627\u06cc\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0631\u0627 \u0645\u06cc \u062f\u0647\u062f \u06a9\u0647 \u0647\u0631 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u067e\u0633 \u0632\u0645\u06cc\u0646\u0647 \u0648 \u067e\u06cc\u0634 \u0632\u0645\u06cc\u0646\u0647 \u0627\u06cc \u0631\u0627 \u06a9\u0647 \u0645\u0631\u0648\u0631\u06af\u0631 \u0645\u06cc \u06a9\u0646\u062f \u0628\u0631\u0631\u0633\u06cc \u0648 \u0627\u0635\u0644\u0627\u062d \u06a9\u0646\u06cc\u0645.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D9%85%D8%B3%D8%AF%D9%88%D8%AF_%DA%A9%D8%B1%D8%AF%D9%86_%D9%85%D9%86%D8%A7%D8%A8%D8%B9\"><\/span>\n<p>  \u0645\u0633\u062f\u0648\u062f \u06a9\u0631\u062f\u0646 \u0645\u0646\u0627\u0628\u0639<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0645\u0631\u0648\u0631\u06af\u0631\u0647\u0627\u06cc \u0628\u062f\u0648\u0646 \u0633\u0631 \u0648\u0627\u0642\u0639\u0627\u064b \u067e\u0647\u0646\u0627\u06cc \u0628\u0627\u0646\u062f \u0641\u0634\u0631\u062f\u0647 \u0627\u0633\u062a. \u0645\u0631\u0648\u0631\u06af\u0631 \u062f\u0631 \u062d\u0627\u0644 \u062f\u0627\u0646\u0644\u0648\u062f \u0647\u0645\u0647 \u062a\u0635\u0627\u0648\u06cc\u0631\u060c \u0641\u0648\u0646\u062a \u0647\u0627 \u0648 \u0633\u0627\u06cc\u0631 \u0645\u0646\u0627\u0628\u0639 \u06af\u0631\u0627\u0646 \u0642\u06cc\u0645\u062a \u0627\u0633\u062a \u06a9\u0647 \u0627\u0633\u06a9\u0631\u0627\u067e\u0631 \u0648\u0628 \u0645\u0627 \u0628\u0647 \u0622\u0646\u0647\u0627 \u0627\u0647\u0645\u06cc\u062a\u06cc \u0646\u0645\u06cc \u062f\u0647\u062f. \u0628\u0631\u0627\u06cc \u0628\u0647\u06cc\u0646\u0647 \u0633\u0627\u0632\u06cc \u0627\u06cc\u0646\u060c \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u0646\u0645\u0648\u0646\u0647 Playwright \u062e\u0648\u062f \u0631\u0627 \u0628\u0631\u0627\u06cc \u0645\u0633\u062f\u0648\u062f \u06a9\u0631\u062f\u0646 \u0627\u06cc\u0646 \u0645\u0646\u0627\u0628\u0639 \u063a\u06cc\u0631 \u0636\u0631\u0648\u0631\u06cc \u067e\u06cc\u06a9\u0631\u0628\u0646\u062f\u06cc \u06a9\u0646\u06cc\u0645:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">chromium<\/span> <span class=\"p\">}<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">require<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">playwright<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n\n<span class=\"c1\">\/\/ Block pages by resource type (e.g., image, stylesheet)<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">BLOCK_RESOURCE_TYPES<\/span> <span class=\"o\">=<\/span> <span class=\"p\">[<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">beacon<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">csp_report<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">font<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">image<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">imageset<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">media<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">object<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">texttrack<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"c1\">\/\/ We can even block stylesheets and scripts, though it's not recommended:<\/span>\n  <span class=\"c1\">\/\/ 'stylesheet',<\/span>\n  <span class=\"c1\">\/\/ 'script',<\/span>\n  <span class=\"c1\">\/\/ 'xhr',<\/span>\n<span class=\"p\">];<\/span>\n\n<span class=\"c1\">\/\/ Block popular third-party resources like tracking<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">BLOCK_RESOURCE_NAMES<\/span> <span class=\"o\">=<\/span> <span class=\"p\">[<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">adzerk<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">analytics<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">cdn.api.twitter<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">doubleclick<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">exelator<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">facebook<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">fontawesome<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">google<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">google-analytics<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"dl\">\"<\/span><span class=\"s2\">googletagmanager<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n<span class=\"p\">];<\/span>\n\n<span class=\"c1\">\/\/ Function to intercept and block requests<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">interceptRoute<\/span> <span class=\"o\">=<\/span> <span class=\"p\">(<\/span><span class=\"nx\">route<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">request<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">route<\/span><span class=\"p\">.<\/span><span class=\"nf\">request<\/span><span class=\"p\">();<\/span>\n\n  <span class=\"c1\">\/\/ Block by resource type<\/span>\n  <span class=\"k\">if <\/span><span class=\"p\">(<\/span><span class=\"nx\">BLOCK_RESOURCE_TYPES<\/span><span class=\"p\">.<\/span><span class=\"nf\">includes<\/span><span class=\"p\">(<\/span><span class=\"nx\">request<\/span><span class=\"p\">.<\/span><span class=\"nf\">resourceType<\/span><span class=\"p\">()))<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span>\n      <span class=\"s2\">`Blocking background resource: <\/span><span class=\"p\">${<\/span><span class=\"nx\">request<\/span><span class=\"p\">.<\/span><span class=\"nf\">url<\/span><span class=\"p\">()}<\/span><span class=\"s2\"> (blocked type: <\/span><span class=\"p\">${<\/span><span class=\"nx\">request<\/span><span class=\"p\">.<\/span><span class=\"nf\">resourceType<\/span><span class=\"p\">()}<\/span><span class=\"s2\">)`<\/span>\n    <span class=\"p\">);<\/span>\n    <span class=\"k\">return<\/span> <span class=\"nx\">route<\/span><span class=\"p\">.<\/span><span class=\"nf\">abort<\/span><span class=\"p\">();<\/span>\n  <span class=\"p\">}<\/span>\n\n  <span class=\"c1\">\/\/ Block by resource name (URL)<\/span>\n  <span class=\"k\">if <\/span><span class=\"p\">(<\/span><span class=\"nx\">BLOCK_RESOURCE_NAMES<\/span><span class=\"p\">.<\/span><span class=\"nf\">some<\/span><span class=\"p\">((<\/span><span class=\"nx\">key<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">request<\/span><span class=\"p\">.<\/span><span class=\"nf\">url<\/span><span class=\"p\">().<\/span><span class=\"nf\">includes<\/span><span class=\"p\">(<\/span><span class=\"nx\">key<\/span><span class=\"p\">)))<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span>\n      <span class=\"s2\">`Blocking background resource: <\/span><span class=\"p\">${<\/span><span class=\"nx\">request<\/span><span class=\"p\">.<\/span><span class=\"nf\">url<\/span><span class=\"p\">()}<\/span><span class=\"s2\"> (blocked name)`<\/span>\n    <span class=\"p\">);<\/span>\n    <span class=\"k\">return<\/span> <span class=\"nx\">route<\/span><span class=\"p\">.<\/span><span class=\"nf\">abort<\/span><span class=\"p\">();<\/span>\n  <span class=\"p\">}<\/span>\n\n  <span class=\"c1\">\/\/ Continue all other requests<\/span>\n  <span class=\"k\">return<\/span> <span class=\"nx\">route<\/span><span class=\"p\">.<\/span><span class=\"k\">continue<\/span><span class=\"p\">();<\/span>\n<span class=\"p\">};<\/span>\n\n<span class=\"p\">(<\/span><span class=\"k\">async <\/span><span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">browser<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">chromium<\/span><span class=\"p\">.<\/span><span class=\"nf\">launch<\/span><span class=\"p\">({<\/span>\n    <span class=\"na\">headless<\/span><span class=\"p\">:<\/span> <span class=\"kc\">false<\/span><span class=\"p\">,<\/span>\n    <span class=\"c1\">\/\/ Enable devtools to see total resource usage<\/span>\n    <span class=\"na\">devtools<\/span><span class=\"p\">:<\/span> <span class=\"kc\">true<\/span><span class=\"p\">,<\/span>\n  <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">context<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">newContext<\/span><span class=\"p\">({<\/span>\n    <span class=\"na\">viewport<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span> <span class=\"na\">width<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1920<\/span><span class=\"p\">,<\/span> <span class=\"na\">height<\/span><span class=\"p\">:<\/span> <span class=\"mi\">1080<\/span> <span class=\"p\">},<\/span>\n  <span class=\"p\">});<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">page<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">context<\/span><span class=\"p\">.<\/span><span class=\"nf\">newPage<\/span><span class=\"p\">();<\/span>\n\n  <span class=\"c1\">\/\/ Enable intercepting for all requests<\/span>\n  <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">route<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">**\/*<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"nx\">interceptRoute<\/span><span class=\"p\">);<\/span>\n\n  <span class=\"c1\">\/\/ Navigate to the Twitch Art directory<\/span>\n  <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">goto<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/www.twitch.tv\/directory\/game\/Art<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n  <span class=\"k\">await<\/span> <span class=\"nx\">page<\/span><span class=\"p\">.<\/span><span class=\"nf\">waitForSelector<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">div[data-target=\"directory-first-item\"]<\/span><span class=\"dl\">'<\/span><span class=\"p\">);<\/span>\n\n  <span class=\"c1\">\/\/ Close the browser<\/span>\n  <span class=\"k\">await<\/span> <span class=\"nx\">browser<\/span><span class=\"p\">.<\/span><span class=\"nf\">close<\/span><span class=\"p\">();<\/span>\n<span class=\"p\">})();<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0631 \u0645\u062b\u0627\u0644 \u0628\u0627\u0644\u0627\u060c \u0645\u0627 \u062f\u0631 \u062d\u0627\u0644 \u062a\u0639\u0631\u06cc\u0641 \u06cc\u06a9 \u0642\u0627\u0646\u0648\u0646 \u0631\u0647\u06af\u06cc\u0631\u06cc \u0647\u0633\u062a\u06cc\u0645 \u06a9\u0647 \u0628\u0647 Playwright \u0645\u06cc\u200c\u06af\u0648\u06cc\u062f \u0647\u0631 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0645\u0646\u0628\u0639 \u067e\u0633\u200c\u0632\u0645\u06cc\u0646\u0647 \u0646\u0627\u062e\u0648\u0627\u0633\u062a\u0647\u200c\u0627\u06cc \u0631\u0627 \u06a9\u0647 \u0627\u0632 \u0646\u0648\u0639 \u0646\u0627\u062f\u06cc\u062f\u0647 \u06af\u0631\u0641\u062a\u0647 \u0634\u062f\u0647 \u06cc\u0627 \u062d\u0627\u0648\u06cc \u0639\u0628\u0627\u0631\u0627\u062a \u0646\u0627\u062f\u06cc\u062f\u0647 \u06af\u0631\u0641\u062a\u0647 \u0634\u062f\u0647 \u062f\u0631 URL \u0647\u0633\u062a\u0646\u062f (\u0645\u0627\u0646\u0646\u062f google analytics) \u0631\u0627 \u0631\u0647\u0627 \u06a9\u0646\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%A7%D8%AC%D8%AA%D9%86%D8%A7%D8%A8_%D8%A7%D8%B2_%D9%85%D8%B3%D8%AF%D9%88%D8%AF_%DA%A9%D8%B1%D8%AF%D9%86\"><\/span>\n<p>  \u0627\u062c\u062a\u0646\u0627\u0628 \u0627\u0632 \u0645\u0633\u062f\u0648\u062f \u06a9\u0631\u062f\u0646<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0627\u06af\u0631\u0686\u0647 Playwright \u0627\u0632 \u06cc\u06a9 \u0645\u0631\u0648\u0631\u06af\u0631 \u0648\u0627\u0642\u0639\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc\u200c\u06a9\u0646\u062f\u060c \u0627\u0645\u0627 \u0648\u0628\u200c\u0633\u0627\u06cc\u062a\u200c\u0647\u0627 \u0647\u0645\u0686\u0646\u0627\u0646 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u0646\u062f \u0631\u0641\u062a\u0627\u0631 \u062e\u0648\u062f\u06a9\u0627\u0631 \u0631\u0627 \u0627\u0632 \u0637\u0631\u06cc\u0642 \u062a\u06a9\u0646\u06cc\u06a9\u200c\u0647\u0627\u06cc\u06cc \u0645\u0627\u0646\u0646\u062f \u0627\u062b\u0631\u0627\u0646\u06af\u0634\u062a \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0648 \u0646\u0638\u0627\u0631\u062a \u0645\u062a\u063a\u06cc\u0631 \u062a\u0634\u062e\u06cc\u0635 \u062f\u0647\u0646\u062f. \u0627\u06cc\u0646 \u0631\u0648\u0634 \u0647\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u0646\u062f \u0646\u0634\u0627\u0646 \u062f\u0647\u0646\u062f \u06a9\u0647 \u0622\u06cc\u0627 \u06cc\u06a9 \u0645\u0631\u0648\u0631\u06af\u0631 \u062a\u0648\u0633\u0637 \u06cc\u06a9 \u0627\u0646\u0633\u0627\u0646 \u06a9\u0646\u062a\u0631\u0644 \u0645\u06cc \u0634\u0648\u062f \u06cc\u0627 \u06cc\u06a9 \u062c\u0639\u0628\u0647 \u0627\u0628\u0632\u0627\u0631 \u0627\u062a\u0648\u0645\u0627\u0633\u06cc\u0648\u0646.<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0628\u06cc\u0634\u062a\u0631 \u062f\u0631 \u0627\u06cc\u0646 \u0645\u0648\u0631\u062f\u060c \u0645\u0642\u0627\u0644\u0647 \u06af\u0633\u062a\u0631\u062f\u0647 \u0645\u0627 \u0631\u0627 \u062f\u0631 \u0645\u0648\u0631\u062f \u0627\u062b\u0631 \u0627\u0646\u06af\u0634\u062a \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0648 \u0646\u0634\u062a \u0645\u062a\u063a\u06cc\u0631\u0647\u0627 \u0628\u0628\u06cc\u0646\u06cc\u062f:<\/p>\n[<\/p>\n<p>How Javascript is Used to Block Web Scrapers? In-Depth Guide<\/p>\n<p>Introduction to javascript fingerprinting and how to fortify automated web browsers against it.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/media2.dev.to\/dynamic\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fscrapfly.io%2Fblog%2Fcontent%2Fimages%2Fhow-to-avoid-web-scraping-blocking-javascript_banner_light.svg\" alt=\"How Javascript is Used to Block Web Scrapers? In-Depth Guide\" loading=\"lazy\" width=\"1910\" height=\"1000\" title=\"\"><\/p>\n<p>](https:\/\/scrapfly.io\/blog\/how-to-avoid-web-scraping-blocking-javascript\/#fortifying-browsers)<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%AC%D8%A7%DB%8C%DA%AF%D8%B2%DB%8C%D9%86_ScrapFly\"><\/span>\n<p>  \u062c\u0627\u06cc\u06af\u0632\u06cc\u0646 ScrapFly<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Playwright \u06cc\u06a9 \u0627\u0628\u0632\u0627\u0631 \u0642\u062f\u0631\u062a\u0645\u0646\u062f \u0628\u0631\u0627\u06cc \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u0627\u0633\u062a\u060c \u0627\u0645\u0627 \u062f\u0631 \u0628\u0631\u062e\u06cc \u0627\u0632 \u0633\u0646\u0627\u0631\u06cc\u0648\u0647\u0627\u06cc \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628\u060c \u0628\u0632\u0631\u06af \u06a9\u0631\u062f\u0646 \u0648 \u0645\u062f\u06cc\u0631\u06cc\u062a \u0622\u0646 \u062f\u0634\u0648\u0627\u0631 \u0627\u0633\u062a \u0648 \u0627\u06cc\u0646\u062c\u0627\u0633\u062a \u06a9\u0647 Scrapfly \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u06a9\u0645\u06a9 \u06a9\u0646\u0646\u062f\u0647 \u0628\u0627\u0634\u062f!<\/p>\n<p>ScrapFly API\u0647\u0627\u06cc \u0627\u0633\u06a9\u0631\u06cc\u0646 \u0634\u0627\u062a\u060c \u0627\u0633\u06a9\u0631\u06cc\u0646 \u0634\u0627\u062a \u0648 \u0627\u0633\u062a\u062e\u0631\u0627\u062c \u0648\u0628 \u0631\u0627 \u0628\u0631\u0627\u06cc \u062c\u0645\u0639 \u0622\u0648\u0631\u06cc \u062f\u0627\u062f\u0647 \u0647\u0627 \u062f\u0631 \u0645\u0642\u06cc\u0627\u0633 \u0641\u0631\u0627\u0647\u0645 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/media2.dev.to\/dynamic\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fscrapfly.io%2Fblog%2Fcontent%2Fimages%2Fcommon_scrapfly-api.svg\" alt=\"\u0645\u06cc\u0627\u0646 \u0627\u0641\u0632\u0627\u0631 scrapfly\" loading=\"lazy\" width=\"876\" height=\"427\" title=\"\"><\/p>\n<p>\u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 ScrapFly SDK \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0647\u0645\u0627\u0646 \u0627\u0642\u062f\u0627\u0645\u0627\u062a\u06cc \u0631\u0627 \u06a9\u0647 \u062f\u0631 Playwright \u0627\u0646\u062c\u0627\u0645 \u062f\u0627\u062f\u06cc\u0645 \u062a\u06a9\u0631\u0627\u0631 \u06a9\u0646\u06cc\u0645:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"k\">import<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">ScrapflyClient<\/span><span class=\"p\">,<\/span> <span class=\"nx\">ScrapeConfig<\/span> <span class=\"p\">}<\/span> <span class=\"k\">from<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">scrapfly-sdk<\/span><span class=\"dl\">\"<\/span><span class=\"p\">;<\/span>\n\n<span class=\"kd\">const<\/span> <span class=\"nx\">client<\/span> <span class=\"o\">=<\/span> <span class=\"k\">new<\/span> <span class=\"nc\">ScrapflyClient<\/span><span class=\"p\">({<\/span> <span class=\"na\">key<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">YOUR SCRAPFLY KEY<\/span><span class=\"dl\">\"<\/span> <span class=\"p\">});<\/span>\n\n<span class=\"c1\">\/\/ We can use a browser to render the page, screenshot it and return final HTML<\/span>\n<span class=\"nx\">result<\/span> <span class=\"o\">=<\/span> <span class=\"k\">await<\/span> <span class=\"nx\">client<\/span><span class=\"p\">.<\/span><span class=\"nf\">scrape<\/span><span class=\"p\">(<\/span>\n  <span class=\"k\">new<\/span> <span class=\"nc\">ScrapeConfig<\/span><span class=\"p\">({<\/span>\n    <span class=\"na\">url<\/span><span class=\"p\">:<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">https:\/\/www.twitch.tv\/directory\/game\/Art<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span>\n    <span class=\"c1\">\/\/ enable browser rendering<\/span>\n    <span class=\"na\">render_js<\/span><span class=\"p\">:<\/span> <span class=\"nx\">True<\/span><span class=\"p\">,<\/span>\n    <span class=\"c1\">\/\/ we can wait for specific part to load just like with Playwright:<\/span>\n    <span class=\"na\">wait_for_selector<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">div[data-target=directory-first-item]<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n    <span class=\"c1\">\/\/ we can capture screenshots<\/span>\n    <span class=\"na\">screenshots<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">everything<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">fullpage<\/span><span class=\"dl\">\"<\/span><span class=\"p\">},<\/span>\n    <span class=\"c1\">\/\/ for targets that block scrapers we can enable block bypass:<\/span>\n    <span class=\"na\">asp<\/span><span class=\"p\">:<\/span> <span class=\"nx\">True<\/span>\n  <span class=\"p\">}),<\/span>\n<span class=\"p\">);<\/span>\n\n<span class=\"c1\">\/\/ It's also possible to execute complex javascript scenarios like button clicking<\/span>\n<span class=\"c1\">\/\/ and text typing:<\/span>\n\n<span class=\"nx\">result<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">client<\/span><span class=\"p\">.<\/span><span class=\"nf\">scrape<\/span><span class=\"p\">(<\/span><span class=\"k\">new<\/span> <span class=\"nc\">ScrapeConfig<\/span><span class=\"p\">({<\/span>\n  <span class=\"na\">url<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">https:\/\/www.twitch.tv\/directory\/game\/Art<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"c1\">\/\/ enable browser rendering<\/span>\n  <span class=\"na\">wait_for_selector<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">div[data-target=directory-first-item]<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n  <span class=\"na\">render_js<\/span><span class=\"p\">:<\/span> <span class=\"kc\">true<\/span><span class=\"p\">,<\/span>\n  <span class=\"na\">js_scenario<\/span><span class=\"p\">:<\/span> <span class=\"p\">[<\/span>\n      <span class=\"c1\">\/\/ wait to load<\/span>\n      <span class=\"p\">{<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">wait_for_selector<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">selector<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">input[autocomplete=\"twitch-nav-search\"]<\/span><span class=\"dl\">'<\/span><span class=\"p\">}},<\/span>\n      <span class=\"c1\">\/\/ input search<\/span>\n      <span class=\"p\">{<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">fill<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">value<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">watercolor<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">selector<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">input[autocomplete=\"twitch-nav-search\"]<\/span><span class=\"dl\">'<\/span><span class=\"p\">}},<\/span>\n      <span class=\"c1\">\/\/ click search button<\/span>\n      <span class=\"p\">{<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">click<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">selector<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">button[aria-label=\"Search Button\"]<\/span><span class=\"dl\">'<\/span><span class=\"p\">}},<\/span>\n      <span class=\"c1\">\/\/ wait explicit amount of time<\/span>\n      <span class=\"p\">{<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">wait_for_navigation<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">timeout<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"mi\">2000<\/span><span class=\"p\">}}<\/span>\n  <span class=\"p\">]<\/span>\n<span class=\"p\">}));<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0631\u0633\u062a \u0645\u0627\u0646\u0646\u062f Playwright\u060c \u0645\u0627 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u06cc\u06a9 \u0645\u0631\u0648\u0631\u06af\u0631 \u0648\u0628 \u0631\u0627 \u0628\u0631\u0627\u06cc \u067e\u06cc\u0645\u0627\u06cc\u0634 \u062f\u0631 \u0648\u0628\u200c\u0633\u0627\u06cc\u062a\u060c \u06a9\u0644\u06cc\u06a9 \u0631\u0648\u06cc \u062f\u06a9\u0645\u0647\u200c\u0647\u0627\u060c \u0648\u0627\u0631\u062f \u06a9\u0631\u062f\u0646 \u0645\u062a\u0646 \u0648 \u0628\u0631\u06af\u0631\u062f\u0627\u0646\u062f\u0646 HTML \u0631\u0646\u062f\u0631 \u0634\u062f\u0647 \u0646\u0647\u0627\u06cc\u06cc \u0628\u0647 \u0645\u0627 \u0628\u0631\u0627\u06cc \u062a\u062c\u0632\u06cc\u0647 \u06a9\u0646\u062a\u0631\u0644 \u06a9\u0646\u06cc\u0645.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%B3%D9%88%D8%A7%D9%84%D8%A7%D8%AA_%D9%85%D8%AA%D8%AF%D8%A7%D9%88%D9%84\"><\/span>\n<p>  \u0633\u0648\u0627\u0644\u0627\u062a \u0645\u062a\u062f\u0627\u0648\u0644<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0628\u0631\u0627\u06cc \u067e\u0627\u06cc\u0627\u0646 \u062f\u0627\u062f\u0646 \u0628\u0647 \u0627\u06cc\u0646 \u0645\u0642\u062f\u0645\u0647\u060c \u0627\u062c\u0627\u0632\u0647 \u062f\u0647\u06cc\u062f \u0646\u06af\u0627\u0647\u06cc \u0628\u0647 \u0686\u0646\u062f \u0633\u0648\u0627\u0644 \u0645\u062a\u062f\u0627\u0648\u0644 \u062f\u0631 \u0645\u0648\u0631\u062f \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u0628\u0627 Playwright \u062f\u0631 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0628\u06cc\u0646\u062f\u0627\u0632\u06cc\u0645:<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%DA%86%DA%AF%D9%88%D9%86%D9%87_%D8%A7%D8%B2_%D9%BE%D8%B1%D9%88%DA%A9%D8%B3%DB%8C_%D8%A8%D8%A7_Playwright_%D8%AF%D8%B1_%D8%AC%D8%A7%D9%88%D8%A7_%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA_%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D9%87_%DA%A9%D9%86%DB%8C%D9%85%D8%9F\"><\/span>\n<p>  \u0686\u06af\u0648\u0646\u0647 \u0627\u0632 \u067e\u0631\u0648\u06a9\u0633\u06cc \u0628\u0627 Playwright \u062f\u0631 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645\u061f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u0628\u0647 \u0627\u0632\u0627\u06cc \u0647\u0631 \u0646\u0645\u0648\u0646\u0647 \u0645\u0631\u0648\u0631\u06af\u0631 \u062f\u0631 Playwright \u06cc\u06a9 \u0633\u0631\u0648\u0631 \u067e\u0631\u0627\u06a9\u0633\u06cc \u0627\u062e\u062a\u0635\u0627\u0635 \u062f\u0647\u06cc\u062f. \u0647\u0646\u06af\u0627\u0645\u06cc \u06a9\u0647 \u0646\u06cc\u0627\u0632 \u0628\u0647 \u0686\u0631\u062e\u0634 IP \u06cc\u0627 \u062f\u0633\u062a\u0631\u0633\u06cc \u0628\u0647 \u0645\u062d\u062a\u0648\u0627\u06cc \u062e\u0627\u0635 \u0645\u0646\u0637\u0642\u0647 \u062f\u0627\u0631\u06cc\u062f\u060c \u0627\u06cc\u0646 \u0628\u0631\u0627\u06cc \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628 \u0645\u0641\u06cc\u062f \u0627\u0633\u062a:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>\nconst { chromium } = require(\"playwright\");\n\n(async () =&gt; {\n  const browser = await chromium.launch({\n    headless: true, \/\/ Set to false if you want a visible browser\n    proxy: { server: \"11.11.11.1:9000\" }, \/\/ Proxy server configuration\n    \/\/ Optional: Add authentication\n    \/\/ proxy: { server: '11.11.11.1:9000', username: 'user', password: 'pass' },\n  });\n\n  const page = await browser.newPage();\n  await page.goto(\"https:\/\/example.com\");\n\n  \/\/ Scrape or interact with the page here\n\n  await browser.close();\n})();\n\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h3><span class=\"ez-toc-section\" id=\"%DA%86%DA%AF%D9%88%D9%86%D9%87_%D9%85%DB%8C_%D8%AA%D9%88%D8%A7%D9%86%D9%85_%D8%A7%D8%B2_%D9%BE%D8%B1%D9%88%DA%A9%D8%B3%DB%8C_%D8%A8%D8%A7_%D9%86%D9%85%D8%A7%DB%8C%D8%B4%D9%86%D8%A7%D9%85%D9%87_%D9%86%D9%88%DB%8C%D8%B3_%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D9%87_%DA%A9%D9%86%D9%85%D8%9F\"><\/span>\n<p>  \u0686\u06af\u0648\u0646\u0647 \u0645\u06cc \u062a\u0648\u0627\u0646\u0645 \u0627\u0632 \u067e\u0631\u0648\u06a9\u0633\u06cc \u0628\u0627 \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u0645\u061f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0647\u0646\u06af\u0627\u0645 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Playwright \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u06cc\u06a9 \u067e\u0631\u0648\u06a9\u0633\u06cc \u0628\u0631\u0627\u06cc \u0646\u0645\u0648\u0646\u0647 \u0645\u0631\u0648\u0631\u06af\u0631 \u062e\u0648\u062f \u0627\u062e\u062a\u0635\u0627\u0635 \u062f\u0647\u06cc\u062f. \u0627\u06cc\u0646 \u0628\u0647 \u0648\u06cc\u0698\u0647 \u0628\u0631\u0627\u06cc \u062d\u0630\u0641 \u0645\u062d\u062a\u0648\u0627\u06cc \u062e\u0627\u0635 \u0645\u0646\u0637\u0642\u0647 \u06cc\u0627 \u0627\u062c\u062a\u0646\u0627\u0628 \u0627\u0632 \u0645\u0645\u0646\u0648\u0639\u06cc\u062a IP \u0645\u0641\u06cc\u062f \u0627\u0633\u062a. \u0628\u0633\u062a\u0647 \u0628\u0647 \u0646\u06cc\u0627\u0632 \u0634\u0645\u0627\u060c \u067e\u0631\u0648\u06a9\u0633\u06cc \u0647\u0627 \u0631\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646 \u0628\u0627 \u06cc\u0627 \u0628\u062f\u0648\u0646 \u0627\u062d\u0631\u0627\u0632 \u0647\u0648\u06cc\u062a \u067e\u06cc\u06a9\u0631\u0628\u0646\u062f\u06cc \u06a9\u0631\u062f.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%DA%A9%D8%AF%D8%A7%D9%85_%D9%85%D8%B1%D9%88%D8%B1%DA%AF%D8%B1_Headless_%D8%A8%D8%B1%D8%A7%DB%8C_Scraping_%D9%86%D9%85%D8%A7%DB%8C%D8%B4%D9%86%D8%A7%D9%85%D9%87_%D9%86%D9%88%DB%8C%D8%B3_%D8%AC%D8%A7%D9%88%D8%A7_%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA_%D8%A8%D9%87%D8%AA%D8%B1%DB%8C%D9%86_%D8%A7%D8%B3%D8%AA%D8%9F\"><\/span>\n<p>  \u06a9\u062f\u0627\u0645 \u0645\u0631\u0648\u0631\u06af\u0631 Headless \u0628\u0631\u0627\u06cc Scraping \u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0628\u0647\u062a\u0631\u06cc\u0646 \u0627\u0633\u062a\u061f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Chromium \u0628\u0647\u062a\u0631\u06cc\u0646 \u0639\u0645\u0644\u06a9\u0631\u062f \u0631\u0627 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc \u062f\u0647\u062f \u0648 \u06af\u0633\u062a\u0631\u062f\u0647 \u062a\u0631\u06cc\u0646 \u0645\u0631\u0648\u0631\u06af\u0631 \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0634\u062f\u0647 \u0628\u0631\u0627\u06cc \u0627\u0633\u06a9\u0631\u0627\u067e\u06cc\u0646\u06af \u0645\u0628\u062a\u0646\u06cc \u0628\u0631 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0627\u0633\u062a \u06a9\u0647 \u0622\u0646 \u0631\u0627 \u0628\u0647 \u06cc\u06a9 \u0627\u0646\u062a\u062e\u0627\u0628 \u0645\u062d\u0628\u0648\u0628 \u0628\u0631\u0627\u06cc \u0627\u06a9\u062b\u0631 \u0645\u0648\u0627\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u062a\u0628\u062f\u06cc\u0644 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<p>\u0627\u0632 \u0633\u0648\u06cc \u062f\u06cc\u06af\u0631\u060c \u0641\u0627\u06cc\u0631\u0641\u0627\u06a9\u0633 \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u0628\u0647 \u0648\u06cc\u0698\u0647 \u0628\u0631\u0627\u06cc \u062f\u0648\u0631 \u0632\u062f\u0646 \u06a9\u067e\u0686\u0627\u0647\u0627 \u0648 \u062c\u0644\u0648\u06af\u06cc\u0631\u06cc \u0627\u0632 \u0634\u0646\u0627\u0633\u0627\u06cc\u06cc \u0645\u0641\u06cc\u062f \u0628\u0627\u0634\u062f\u060c \u0632\u06cc\u0631\u0627 \u06a9\u0645\u062a\u0631 \u062f\u0631 \u0627\u0633\u06a9\u0631\u067e\u06cc\u0646\u06af \u0648\u0628 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u0634\u0648\u062f \u0648 \u0628\u0646\u0627\u0628\u0631\u0627\u06cc\u0646 \u0627\u062d\u062a\u0645\u0627\u0644 \u06a9\u0645\u062a\u0631\u06cc \u062f\u0627\u0631\u062f \u06a9\u0647 \u0627\u0642\u062f\u0627\u0645\u0627\u062a \u0636\u062f \u062e\u0631\u0627\u0634 \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%AE%D9%84%D8%A7%D8%B5%D9%87\"><\/span>\n<p>  \u062e\u0644\u0627\u0635\u0647<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0627\u06cc\u0646 \u0631\u0627\u0647\u0646\u0645\u0627 \u0645\u0648\u0631\u062f \u0628\u0631\u0631\u0633\u06cc \u0642\u0631\u0627\u0631 \u06af\u0631\u0641\u062a <strong>\u0646\u0645\u0627\u06cc\u0634\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633 \u0628\u0627 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a<\/strong>\u060c \u06cc\u06a9 \u062c\u0639\u0628\u0647 \u0627\u0628\u0632\u0627\u0631 \u0627\u062a\u0648\u0645\u0627\u0633\u06cc\u0648\u0646 \u0645\u0631\u0648\u0631\u06af\u0631 \u0628\u0631\u0627\u06cc \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u0648\u0628. \u0646\u06a9\u0627\u062a \u06a9\u0644\u06cc\u062f\u06cc \u0639\u0628\u0627\u0631\u062a\u0646\u062f \u0627\u0632:<\/p>\n<ul>\n<li>  <strong>\u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u0627\u0635\u0644\u06cc<\/strong>: \u067e\u06cc\u0645\u0627\u06cc\u0634\u060c \u06a9\u0644\u06cc\u06a9 \u0631\u0648\u06cc \u062f\u06a9\u0645\u0647\u060c \u0648\u0631\u0648\u062f\u06cc \u0645\u062a\u0646\u060c \u067e\u06cc\u0645\u0627\u06cc\u0634 \u0648 \u062a\u062c\u0632\u06cc\u0647 \u062f\u0627\u062f\u0647 \u0647\u0627.<\/li>\n<li>  <strong>\u0645\u062b\u0627\u0644 \u0632\u0646\u062f\u06af\u06cc \u0648\u0627\u0642\u0639\u06cc<\/strong>: Scraping \u062f\u0633\u062a\u0647 \u0647\u0646\u0631\u06cc Twitch.tv \u0628\u0631\u0627\u06cc \u0639\u0646\u0627\u0648\u06cc\u0646\u060c \u0628\u06cc\u0646\u0646\u062f\u06af\u0627\u0646 \u0648 \u062c\u0632\u0626\u06cc\u0627\u062a \u0633\u0627\u0632\u0646\u062f\u0647.<\/li>\n<li>  <strong>\u0627\u0628\u0632\u0627\u0631\u0647\u0627\u06cc \u067e\u06cc\u0634\u0631\u0641\u062a\u0647<\/strong>: \u0645\u0633\u062f\u0648\u062f \u06a9\u0631\u062f\u0646 \u0645\u0646\u0627\u0628\u0639\u060c \u0631\u0647\u06af\u06cc\u0631\u06cc \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0648 \u0627\u0631\u0632\u06cc\u0627\u0628\u06cc \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a.<\/li>\n<li>  <strong>\u0627\u0633\u06a9\u0631\u0648\u0644 \u0628\u06cc \u0646\u0647\u0627\u06cc\u062a<\/strong>: \u062a\u06a9\u0646\u06cc\u06a9 \u0647\u0627\u06cc \u0645\u062f\u06cc\u0631\u06cc\u062a \u0628\u0627\u0631\u06af\u0630\u0627\u0631\u06cc \u0645\u062d\u062a\u0648\u0627\u06cc \u067e\u0648\u06cc\u0627.<\/li>\n<li>  <strong>\u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u067e\u0631\u0648\u06a9\u0633\u06cc<\/strong>: \u062f\u0648\u0631 \u0632\u062f\u0646 \u0645\u062d\u062f\u0648\u062f\u06cc\u062a \u0647\u0627\u06cc \u062c\u063a\u0631\u0627\u0641\u06cc\u0627\u06cc\u06cc \u0648 \u0627\u0642\u062f\u0627\u0645\u0627\u062a \u0636\u062f\u062e\u0631\u0627\u0634.<\/li>\n<li>  <strong>\u062c\u0627\u06cc\u06af\u0632\u06cc\u0646<\/strong>: ScrapFly \u0628\u0631\u0627\u06cc \u062e\u0631\u0627\u0634 \u062f\u0627\u062f\u0646 \u062f\u0631 \u0645\u0642\u06cc\u0627\u0633 \u0628\u0632\u0631\u06af \u0628\u0627 \u0645\u062d\u0627\u0641\u0638\u062a \u0636\u062f \u0631\u0628\u0627\u062a \u0648 \u0631\u0646\u062f\u0631 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a.<\/li>\n<\/ul>\n<p>\u0628\u0627 \u0645\u062c\u0645\u0648\u0639\u0647 \u0627\u0628\u0632\u0627\u0631 \u063a\u0646\u06cc \u0627\u0632 \u0648\u06cc\u0698\u06af\u06cc Playwright\u060c \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0648\u0628\u200c\u0633\u0627\u06cc\u062a\u200c\u0647\u0627\u06cc \u0645\u062f\u0631\u0646 \u0648 \u067e\u0648\u06cc\u0627 \u0631\u0627 \u0628\u0647\u200c\u0637\u0648\u0631 \u06a9\u0627\u0631\u0622\u0645\u062f \u062e\u0631\u0627\u0634 \u062f\u0647\u06cc\u062f \u0648 \u062f\u0631 \u0639\u06cc\u0646 \u062d\u0627\u0644 \u0628\u0631 \u0686\u0627\u0644\u0634\u200c\u0647\u0627\u06cc \u0631\u0627\u06cc\u062c\u06cc \u0645\u0627\u0646\u0646\u062f CAPTCHA \u0648 \u062a\u0623\u062e\u06cc\u0631 \u0628\u0627\u0631\u06af\u0630\u0627\u0631\u06cc \u0645\u062d\u062a\u0648\u0627 \u063a\u0644\u0628\u0647 \u06a9\u0646\u06cc\u062f.<\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u062e\u0631\u0627\u0634 \u0648\u0628 \u067e\u062a\u0627\u0646\u0633\u06cc\u0644 \u0627\u0633\u062a\u062e\u0631\u0627\u062c \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0627\u0631\u0632\u0634\u0645\u0646\u062f \u0627\u0632 \u0648\u0628 \u0633\u0627\u06cc\u062a \u0647\u0627 \u0631\u0627 \u0628\u0627\u0632 \u0645\u06cc \u06a9\u0646\u062f \u0648 Playwright \u06cc\u06a9 \u062a\u063a\u06cc\u06cc\u0631 \u062f\u0647\u0646\u062f\u0647 \u0628\u0627\u0632\u06cc \u0628\u0631\u0627\u06cc \u062e\u0648\u062f\u06a9\u0627\u0631\u0633\u0627\u0632\u06cc \u0627\u06cc\u0646 \u0641\u0631\u0622\u06cc\u0646\u062f \u0627\u0633\u062a. Playwright \u0628\u0627 \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0627\u0632 \u0686\u0646\u062f\u06cc\u0646 \u0645\u062d\u06cc\u0637 \u0645\u0627\u0646\u0646\u062f Node.js\u060c Deno\u060c \u0648 Bun\u060c \u0627\u0633\u06a9\u0631\u0627\u067e\u06cc\u0646\u06af \u0648\u0628 \u0631\u0627 \u0628\u0631\u0627\u06cc \u0645\u0628\u062a\u062f\u06cc\u0627\u0646 \u0648 \u0628\u0631\u0627\u06cc \u062d\u0631\u0641\u0647 \u0627\u06cc \u0647\u0627 \u0642\u062f\u0631\u062a\u0645\u0646\u062f \u0645\u06cc \u06a9\u0646\u062f. \u062f\u0631 \u0627\u06cc\u0646 \u0648\u0628\u0644\u0627\u06af\u060c \u0646\u062d\u0648\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 &hellip;<\/p>\n","protected":false},"author":2,"featured_media":92803,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"https:\/\/media2.dev.to\/dynamic\/image\/width=1000,height=500,fit=cover,gravity=auto,format=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fznxtd99qwasomxsm94xx.png","fifu_image_alt":"","footnotes":""},"categories":[339],"tags":[],"class_list":["post-92802","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dev"],"_links":{"self":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/92802","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/comments?post=92802"}],"version-history":[{"count":0,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/92802\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media\/92803"}],"wp:attachment":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media?parent=92802"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/categories?post=92802"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/tags?post=92802"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}