این صفحه به‌وسیله ‏Cloud Translation API‏ ترجمه شده است.

تست خودکار رابط کاربری با Antigravity (AGY) CLI، BrowserMCP، Playwright و Browser Agent

۱. مقدمه

انقلاب هوش مصنوعی عامل‌محور، نحوه‌ی ساخت نرم‌افزار توسط ما را متحول می‌کند و باعث می‌شود کل فرآیند فوق‌العاده جذاب، هیجان‌انگیز و در دسترس به نظر برسد. وظایف و پروژه‌هایی که قبلاً ماه‌ها طول می‌کشید تا توسط توسعه‌دهندگان تکمیل شوند، اکنون با استفاده از ابزارهای عامل‌محور، در یک جلسه قابل انجام هستند.

یکی از حوزه‌های مستعد برای این تحول عامل‌محور، تست برنامه‌های وب است. به طور سنتی، تست برنامه‌های وب یک کار طاقت‌فرسا و یک نبرد مداوم علیه شکنندگی بوده است. اما چه می‌شد اگر می‌توانستید این پیچیدگی را به طور کامل کنار بگذارید؟ چه می‌شد اگر می‌توانستید به یک عامل به زبان ساده و طبیعی بگویید چه چیزی را تست کند و اجازه دهید عامل در مورد نحوه اجرای آن استدلال کند؟

در این آزمایشگاه کد، نحوه استفاده از Antigravity CLI را به همراه مهارت‌های عامل (agent) و ابزارهای MCP چندوجهی مانند BrowserMCP بررسی خواهیم کرد. خواهید دید که چگونه می‌توانید تست‌های رابط کاربری خودکار را با استفاده از زبان طبیعی ایجاد و اجرا کنید، و نشان خواهید داد که چگونه ابزارهای عامل می‌توانند وظایف پیچیده را انجام دهند و به شما به عنوان یک سازنده قدرت‌های فوق‌العاده‌ای بدهند.

نکته مهم این است که اگرچه این آزمایشگاه کد بر موارد استفاده خاص اتوماسیون رابط کاربری و کنترل از راه دور مرورگر تمرکز دارد، اما اصول اساسی و دنیای عظیم امکاناتی که آنها ارائه می‌دهند، واقعاً مهم هستند. با آموزش استفاده از CLIهای محلی و سرورهای MCP به عامل‌ها، می‌توانیم گردش‌های کاری پیچیده‌ای را که در غیر این صورت زمان یا تخصص تخصصی برای انجام آنها را نداشتیم، به آنها واگذار کنیم.

آنچه یاد خواهید گرفت

رابط خط فرمان آنتی‌گراویتی چیست و چگونه در اکوسیستم آنتی‌گراویتی جای می‌گیرد؟
پروتکل زمینه مدل (MCP) چیست و چرا می‌تواند انقلابی در این زمینه ایجاد کند؟
چگونه BrowserMCP به عامل‌های هوش مصنوعی امکان کنترل مرورگرهای وب را می‌دهد.
نحوه اجرای تست‌های خودکار رابط کاربری از طریق Antigravity CLI.
درک مهارت‌های نماینده و مزایای آنها.
آموزش یک نماینده برای استفاده از نمایشنامه‌نویس با مهارت.
آشنایی با مرورگر داخلی آنتی‌گراویتی.
موارد استفاده دیگر برای کنترل مرورگر.

کاری که انجام خواهید داد

این آزمایشگاه کد از رابط خط فرمان Antigravity، ابزارهای MCP، مهارت‌های عامل (agent skills) و یک اپلیکیشن آزمایشی React استفاده می‌کند.

شما:

محیط توسعه خود را تنظیم کنید.
یک اپلیکیشن آزمایشی که نیاز به آزمایش دارد را بررسی کنید.
از Antigravity CLI برای تعامل با برنامه از طریق BrowserMCP استفاده کنید.
به نماینده خود بیاموزید که چگونه از Playwright با مهارت نماینده استفاده کند.

۲. اکوسیستم ضد جاذبه

در ماه مه ۲۰۲۶، گوگل مجموعه جدید Antigravity را کنار گذاشت. این یک بازنگری اساسی در Antigravity بود و آن را به چهار محصول زیر تقسیم کرد:

Antigravity 2.0 که اکنون محیط اختصاصی "سازنده" با محوریت عامل روی دسکتاپ شماست. نکته قابل توجه این است که خود این محیط شامل یک IDE نیست. در عوض، ما اکنون فقط با مدیر عامل تعامل داریم. هدف این سطح، آغاز دوران "ایده تا محصول" با استفاده از عامل‌ها، بدون نگرانی از کد است. بسیاری از سازندگانی که سابقه کدنویسی ندارند، این را دوست خواهند داشت.
Antigravity IDE، که محیط کدنویسی شبیه به VS Code را در اختیار ما قرار می‌دهد و توسط Agent Antigravity پشتیبانی می‌شود. در اینجا می‌توانیم توسعه با کمک Agent را انجام دهیم و همیشه کد را می‌بینیم. کدنویسان در اینجا احساس راحتی خواهند کرد.
کیت توسعه نرم‌افزار Antigravity، که ابزار و تجهیزات مورد نیاز Antigravity را در اختیار شما قرار می‌دهد، اما به عنوان یک کیت توسعه نرم‌افزار Python Agent ارائه می‌شود. با وارد کردن از google.antigravity می‌توانیم از طریق برنامه‌نویسی از قابلیت‌های Antigravity بهره ببریم.
رابط خط فرمان Antigravity، که تکامل بعدی رابط خط فرمان فوق‌العاده Gemini است. این رابط هنوز یک محیط ترمینال-محور برای تعامل با مدل‌های Gemini است. اما رابط خط فرمان Antigravity جدید با زبان Go ساخته شده است و می‌توانید تشخیص دهید؛ چه در هنگام راه‌اندازی و چه در استفاده عمومی، بسیار سریع‌تر از Gemini CLI به نظر می‌رسد. این رابط از همان "مهار" عامل Antigravity 2.0 و IDE استفاده می‌کند و این امکان تنظیمات و پیکربندی مشترک را در سراسر مجموعه Antigravity فراهم می‌کند.

اگرچه این آزمایشگاه بر استفاده از Antigravity CLI تمرکز دارد، اما همه کارهای این آزمایشگاه را می‌توان با Agy IDE یا Agy 2.0 نیز انجام داد.

۳. پیش‌نیازها

قبل از اینکه به سراغ چیزهای جالب برویم، بیایید مطمئن شویم که هر آنچه نیاز دارید را دارید.

ابزارها

این آزمایشگاه فرض می‌کند که شما از قبل موارد زیر را دارید:

برای استفاده از Antigravity CLI، باید با گوگل احراز هویت کنید. وقتی برای اولین بار agy را اجرا می‌کنید، به طور خودکار از طریق مرورگر وب پیش‌فرض شما، از شما درخواست ورود به سیستم با گوگل را می‌کند. این گزینه با سهمیه رایگان و سخاوتمندانه‌ای از استفاده Gemini ارائه می‌شود و نیازی به پروژه Google Cloud ندارد. اگر کلید API Gemini یا پروژه Google Cloud دارید، می‌توانید این مورد را نیز پیکربندی کنید.

این دستورالعمل‌ها فرض می‌کنند که شما در محیط لینوکس (یا WSL) یا macOS کار می‌کنید. اگر (مثل من) از ویندوز استفاده می‌کنید، می‌توانید با استفاده از WSL مراحل را دنبال کنید.

(توجه داشته باشید که BrowserMCP از طریق Google Cloud Shell کار نخواهد کرد، زیرا فقط به یک مرورگر محلی که روی همان دستگاه اجرا می‌شود متصل می‌شود.)

راه‌اندازی محیط توسعه

من یک مخزن آزمایشی در گیت‌هاب ایجاد کرده‌ام. این مخزن شامل یک برنامه نمونه است که می‌توانیم برای تست رابط کاربری خود از آن استفاده کنیم. با اجرای این دستور از ترمینال محلی خود، آن را کلون کنید:

git clone https://github.com/derailed-dash/agentic-ui-testing
cd agentic-ui-testing

یک Makefile وجود دارد که تنظیم محیط برای اجرای برنامه آزمایشی را برای شما آسان می‌کند. بیایید آن را اجرا کنیم تا محیط خود را مقداردهی اولیه کنیم:

make install

# Or if you don't have make
npm install --prefix demo-app

۴. اپلیکیشن آزمایشی ما

اپلیکیشنی که امروز آزمایش می‌کنیم، The Dazbo Omni-Dash است - یک داشبورد آینده‌نگرانه با تم تاریک برای مدیریت تله‌متری امنیتی. (بله، با ویبره کدنویسی شده بود!)

چرا این برنامه؟

این دستگاه طوری ساخته شده است که یک سطح آزمایش واقع‌گرایانه با موارد زیر ارائه دهد:

احراز هویت ساختگی : یک جریان ورود به سیستم که نیاز به اعتبارنامه‌های خاص دارد.
محتوای پویا : کارت‌های تله‌متری و لاگ‌های امنیتی که داده‌های بلادرنگ را شبیه‌سازی می‌کنند.
حالت‌های تعاملی : منوهای ناوبری و ورودی‌های فرم که بر اساس عملکرد کاربر تغییر می‌کنند.
فناوری مدرن : ساخته شده با React و Vite برای یک تجربه سریع و واکنش‌گرا.

راه‌اندازی برنامه

برای شروع برنامه، کافیست دستور زیر را اجرا کنید:

make dev

# Or if you don't have make
npm run dev --prefix demo-app

سرور توسعه باید خیلی سریع شروع به کار کند و برنامه از طریق آدرس http://localhost:5173 در دسترس خواهد بود.

ما می‌توانیم فقط روی لینک کلیک کنیم تا برنامه در مرورگر ما باز شود. فقط این فرآیند را در ترمینال خود در حال اجرا بگذارید. دستورات ترمینال بعدی را در یک بخش ترمینال جداگانه انجام خواهیم داد.

۵. چالش تست رابط کاربری

تست رابط کاربری سنتی به سختی به نتیجه می‌رسد و حفظ آن حتی سخت‌تر است. نقاط ضعف رایج عبارتند از:

منحنی یادگیری بالا : توسعه‌دهندگان را ملزم می‌کند تا زمان زیادی را صرف تسلط بر زبان‌های پیچیده مختص دامنه و ویژگی‌های خاص چارچوب (مانند سلنیوم یا Playwright) کنند، فقط برای خودکارسازی یک تعامل اولیه.
انتخابگرهای شکننده و اتوماسیون : اسکریپت‌های سنتی به ساختارهای DOM سفت و سخت (مانند div > div > button ) یا برچسب‌های متنی خاص متکی هستند. چه اتفاقی می‌افتد اگر نام دکمه "خروج" را به "خروج" تغییر دهید؟ یا یک دکمه را به یک منوی کاملاً متفاوت منتقل کنید؟ یا ساختار HTML خود را تغییر دهید؟ ابزارهای تست سنتی هنگام انجام این کارها از کار می‌افتند و منجر به نگهداری مداوم اسکریپت می‌شوند.
تست "Flacking": تست‌هایی که یک دقیقه با موفقیت انجام می‌شوند و دقیقه بعد به دلیل مشکلات زمان‌بندی، شرایط رقابتی یا بارگذاری کند فایل‌ها، با شکست مواجه می‌شوند.
برابری محیطی : دست و پنجه نرم کردن با حالت‌های برنامه که تکرار آنها دشوار است و سربار پاکسازی داده‌های آزمایشی.

قصد در مقابل اجرا

برای حل این مشکلات، به روشی برای آزمایش نیاز داریم که به جای اجرا، بر قصد و نیت تمرکز کند.

با بهره‌گیری از ابزارهای هوش مصنوعی عامل‌محور، می‌توانیم اتوماسیون تکرارپذیری ایجاد کنیم که کاملاً از تغییرات جزئی رابط کاربری و تغییرات ساختاری مصون باشد. به جای نام‌ها، برچسب‌ها یا سلسله مراتب دقیق اشیاء که به صورت کدنویسی شده ارائه می‌شوند، عامل بر اساس قصد زبان طبیعی کاربر، اقدامات را اجرا می‌کند. اگر یک دکمه حرکت کند یا برچسب آن کمی تغییر کند، قابلیت‌های چندوجهی عامل به آن اجازه می‌دهد تا عنصر را پیدا کرده و کار را با موفقیت انجام دهد.

۶. MCP به نجات می‌آید

پروتکل زمینه مدل (MCP) یک استاندارد باز است که به مدل‌ها و عامل‌های هوش مصنوعی اجازه می‌دهد تا با ابزارهای خارجی، APIها و داده‌ها تعامل داشته باشند. آن را به عنوان یک آداپتور جهانی در نظر بگیرید که به مدل‌ها و عامل‌ها اجازه می‌دهد ابزارهایی را که به آنها دسترسی دارند، پیدا و اجرا کنند.

به طور سنتی، ادغام مدل‌های زبان بزرگ (LLM) با داده‌ها و ابزارهای خارجی، توسعه‌دهندگان را ملزم به نوشتن اتصالات API سفارشی و کدگذاری شده برای هر منبع داده جدید می‌کرد، که یک مشکل یکپارچه‌سازی ناپایدار "M x N" ایجاد می‌کرد که در آن هر مدل و ابزار جدید، بار نگهداری را چند برابر می‌کرد. پروتکل زمینه مدل (MCP) با حذف نیاز به نوشتن کد خاص برای هماهنگ‌سازی این قابلیت‌ها، این مشکل را حل می‌کند. به جای کدگذاری صریح گردش‌های کاری پیچیده اجرا، توسعه‌دهندگان می‌توانند به LLM تکیه کنند تا درخواست‌های زبان طبیعی کاربر را تفسیر کند و به صورت پویا در مورد اینکه از کدام ابزارها استفاده کنند، استدلال کند.

وقتی کاربر یک دستور زبان طبیعی صادر می‌کند (مانند «به localhost:5173 بروید، به عنوان 'admin' وارد شوید و روی دکمه ارسال کلیک کنید» )، LLM قابلیت‌های موجود را کشف کرده و یک درخواست ساختاریافته برای فراخوانی یک ابزار خاص ایجاد می‌کند. کلاینت MCP به عنوان یک مترجم عمل می‌کند و این درخواست را به سرور MCP تعیین‌شده هدایت می‌کند، که عمل را اجرا می‌کند یا داده‌ها را دریافت کرده و زمینه را به مدل برمی‌گرداند. این امر به هوش مصنوعی این قدرت را می‌دهد که بدون نیاز به کدنویسی سخت مسیر اجرای خاص توسط توسعه‌دهنده، به صورت مستقل عمل کند.

از آنجا که MCP یک استاندارد جهانی ایجاد می‌کند - که اغلب به عنوان "USB-C برای برنامه‌های هوش مصنوعی" توصیف می‌شود - قابلیت استفاده مجدد گسترده‌ای را در دسترس قرار می‌دهد. توسعه‌دهندگان می‌توانند یک بار یک سرور MCP بسازند و هر میزبان هوش مصنوعی سازگار با MCP می‌تواند فوراً به آن متصل شود و مشکل ادغام M x N را از بین ببرد. دیگر لازم نیست برای هر پلتفرم پل‌های API سفارشی بسازید. در عوض، می‌توانید از اکوسیستم سرورهای MCP از پیش ساخته شده و متن باز برای سرویس‌های رایج مانند GitHub، Slack، پایگاه‌های داده و هر چیز دیگری استفاده کنید و آنها را مستقیماً به گردش‌های کاری عامل خود متصل کنید. این معماری ماژولار و plug-and-play تضمین می‌کند که اگر ارائه دهندگان LLM را تغییر دهید یا ابزارهای خود را بعداً ارتقا دهید، زیرساخت ادغام اصلی شما کاملاً بدون تغییر باقی می‌ماند.

۷. خودکارسازی با BrowserMCP

BrowserMCP چیست؟

این اولین ابزاری است که امروز با آن کار خواهیم کرد. BrowserMCP یک سرور MCP است که به عامل‌های هوش مصنوعی «چشم» و «دست» لازم برای تعامل با یک مرورگر وب را می‌دهد. به طور خلاصه، این سرور تعامل انسان با یک مرورگر را تقلید می‌کند. این ابزار متن‌باز است و می‌توانید مخزن گیت‌هاب آن را اینجا بررسی کنید. مستندات اصلی BrowserMCP را اینجا ببینید.

در اینجا به برخی از قابلیت‌های آن اشاره می‌کنیم:

می‌تواند به URLها پیمایش کند.
می‌تواند DOM را بررسی کند.
می‌تواند روی دکمه‌ها کلیک کند و متن را در فرم‌ها تایپ کند.
می‌تواند با کشیدن و رها کردن (drag-and-drop) انجام شود.
می‌تواند لاگ‌های کنسول مرورگر را بخواند.
سریع است: اتوماسیون به صورت محلی روی دستگاه شما اتفاق می‌افتد.

نصب مرورگر MCP

برای استفاده از BrowserMCP، باید دو کار انجام دهید:

افزونه BrowserMCP را در کروم (یا هر مرورگر مبتنی بر کرومیوم) نصب کنید.
سرور MCP را به صورت دستی در پیکربندی Antigravity خود پیکربندی کنید.

برای نصب افزونه، فقط دستورالعمل‌های اینجا را دنبال کنید. این کار فقط چند ثانیه طول می‌کشد. و پس از نصب، روی «اتصال» در افزونه کلیک می‌کنید تا به نماینده شما اجازه کنترل برگه فعلی‌تان داده شود. (بدیهی است که می‌خواهید برگه فعلی، برگه‌ای باشد که برنامه آزمایشی روی آن اجرا می‌شود!)

در مرحله بعد، سرور MCP واقعی را در Antigravity پیکربندی می‌کنیم. این کار را با اضافه کردن تعریف سرور browsermcp به فایل سراسری mcp_config.json خود انجام می‌دهیم.

فایل ~/.gemini/config/mcp_config.json را ایجاد یا ویرایش کنید و پیکربندی زیر را به آن اضافه کنید:

{
  "mcpServers": {
    "browsermcp": {
      "command": "npx",
      "args": [
        "-y",
        "@browsermcp/mcp@latest"
      ]
    }
  }
}

برای آشنایی کامل با نحوه راه‌اندازی سرورهای MCP و مهارت‌های موجود در اکوسیستم Antigravity، به این منابع مراجعه کنید:

تست با BrowserMCP

حالا بریم سراغ جادو. اول، بیایید Antigravity CLI را (با اجرای agy) در یک جلسه ترمینال جدید اجرا کنیم. (به یاد داشته باشید که برنامه آزمایشی در جلسه ترمینال اولیه ما اجرا می‌شود.) در داخل TUI تعاملی، /mcp را تایپ کنید تا لیست ابزارهای فعال را تأیید کنید و مطمئن شوید که browsermcp در دسترس است.

اگر قبلاً برنامه آزمایشی را اجرا نکردید، اکنون آن را اجرا کنید:

make dev

اگر هنوز این کار را نکرده‌اید، باید برنامه را در مرورگر کروم خود باز کنید و افزونه BrowserMCP را در آن برگه متصل کنید. پیوند را از دستور run دنبال کنید. سپس روی نماد افزونه BrowserMCP کلیک کنید و روی "اتصال" کلیک کنید.

حالا می‌توانیم از رابط خط فرمان Agy برای اجرای تست استفاده کنیم. این خط فرمان را کپی کرده و در رابط خط فرمان پیست کنید:

Using BrowserMCP, connect to the application at http://localhost:5173. If the application is not showing a login screen, first logout. Then login as 'admin' with password 'password', and verify that the dashboard title says 'System Overview'. In the main dashboard, read the telemetry values shown, and present them back to me in a markdown table.

رابط خط فرمان (CLI) ابتدا بررسی می‌کند که آیا برنامه آزمایشی روی پورت مشخص شده اجرا می‌شود یا خیر. سپس از شما می‌خواهد که اقدامات ابزاری که قرار است انجام شود را تأیید کنید.

به رابط خط فرمان (CLI) اجازه دهید تمام ابزارهای BrowserMCP را برای این جلسه اجرا کند. سپس به مرورگر برگردید و شاهد انجام تعاملات خودکار باشید!

چند نکته در مورد دستور بالا قابل توجه است:

ما با گفتن به عامل برای خروج (logout) شروع می‌کنیم، اگر برنامه از قبل وارد شده باشد. توجه داشته باشید که نیازی نیست به عامل بگوییم روی متن خاصی مانند "خروج از دروازه" کلیک کند. خود عامل به اندازه کافی هوشمند است که تشخیص دهد روی چه چیزی کلیک کند.
پس از ورود به سیستم و نمایش صفحه اصلی، عامل اطلاعات تله‌متری را ثبت می‌کند. باز هم، نیازی نیست به عامل بگوییم که در کاشی‌های خاص جستجو کند یا کلمات خاصی را مطابقت دهد. بنابراین اگر بعداً اطلاعات نشان داده شده در این صفحه را گسترش دهیم یا تغییر دهیم، این اعلان همچنان کار خواهد کرد و خروجی همچنان در جدول نشانه‌گذاری ما ثبت می‌شود.

باحاله، درسته؟

فعلاً کار ما با BrowserMCP تمام شده است، بنابراین اتصال آن را در مرورگر خود قطع کنید .

۸. اتوماسیون با مهارت‌ها و نمایشنامه‌نویس

محدودیت‌های BrowserMCP

BrowserMCP عالی است، اما چند محدودیت دارد. برای مثال:

به یک جلسه مرورگر موجود، با افزونه BrowserMCP متصل، نیاز دارد. (جلسات جدیدی ایجاد نمی‌کند.)
از مرورگرهای غیر Chromium پشتیبانی نمی‌کند.
این امر مستلزم اجرای یک فرآیند مرورگر جداگانه است که روی همان دستگاهی قرار دارد که سرور MCP در آن در حال اجرا است.
قادر به کار با سیستم فایل محلی نیست. برای مثال، نمی‌تواند: فایل‌های محلی برای اثبات اسکرین‌شات‌ها ایجاد کند، یا فایل‌هایی مانند PDF قابل دانلود را از برنامه وب دانلود و ذخیره کند.
این غیرقطعی است. سعی می‌کند اقداماتی را که شما به آن می‌گویید انجام دهد، اما وضعیت محلی، مانند یک پنجره پاپ‌آپ غیرمنتظره، می‌تواند تعامل را مختل کند.
این برنامه از عملیات "بدون سر" پشتیبانی نمی‌کند، به این معنی که نمی‌تواند بدون یک پنجره مرورگر واقعی در یک خط لوله CI/CD اجرا شود.

نمایشنامه‌نویس

Playwright ابزاری بسیار پیچیده‌تر است. این یک چارچوب اتوماسیون و تست مرورگر متن‌باز و جاافتاده است. این ابزار می‌تواند کارهای زیادی انجام دهد که BrowserMCP نمی‌تواند، از جمله تمام مواردی که در بالا به آنها اشاره کردم.

این روش برای اجرای سناریوهای تست پیچیده، قابل اعتماد و تکرارپذیر بسیار مناسب‌تر است. و به ویژه برای کار با جلسات طولانی مدت یا در واقع اجرای چندین جلسه مستقل به صورت موازی بسیار مناسب است.

اما با چنین قابلیت اضافی، منحنی یادگیری بسیار تندتری به وجود می‌آید.

مهارت‌ها

خوشبختانه، لازم نیست یاد بگیریم که چگونه مستقیماً از Playwright استفاده کنیم. در عوض، می‌توانیم از مهارت یک عامل (agent) استفاده کنیم.

خب، مهارت یک عامل دقیقاً چیست؟ آن را به عنوان مجموعه‌ای از تخصص‌های مرتبط در نظر بگیرید که می‌توانید در مواقع نیاز به انجام کاری خاص، به عامل هوش مصنوعی خود ارائه دهید. این مهارت‌ها شامل دستورالعمل‌ها، بهترین شیوه‌ها و گاهی اوقات حتی اسکریپت‌های کمکی متناسب با یک کار خاص است.

بخش واقعاً هوشمندانه ماجرا اینجاست: افشای تدریجی . به جای اینکه هر سند API قابل تصور و قانون چارچوب تست را در اعلان اولیه سیستم LLM قرار دهد - که پنجره context شما را اشغال می‌کند و توکن‌ها را به طرز بی‌اهمیتی می‌سوزاند - عامل فقط زمانی که واقعاً به مهارت نیاز دارد، آن را می‌خواند. این کار context پایه را ساده و مختصر نگه می‌دارد و "نحوه انجام" دقیق را به موقع دریافت می‌کند. و بله، یک مهارت می‌تواند شامل دستورالعمل‌هایی در مورد نحوه استفاده از سرورهای MCP خاص برای انجام کار باشد.

مثل آن صحنه در فیلم ماتریکس به آن فکر کنید: مامور به یک مشکل نگاه می‌کند، متوجه می‌شود که باید Playwright را بداند، مهارت را دانلود می‌کند و ناگهان: "من کونگ فو بلدم." بوم. متخصص فوری.

اگر می‌خواهید در مورد مهارت‌های ارتباطی بیشتر بدانید، به موارد زیر توجه کنید:

چرا مهارت‌ها برای نمایشنامه‌نویس ایده‌آل هستند؟

استفاده از یک مهارت در اینجا انتخاب بسیار خوبی است. Playwright فوق‌العاده قدرتمند است، اما سینتکس آن می‌تواند پیچیده باشد. با دادن مهارت Playwright به عامل، دیگر لازم نیست نگران توهم LLM خود در مورد سینتکس قدیمی یا نوشتن انتخابگرهای شکننده باشیم. ما به آن یک کتاب راهنمای معتبر و دقیق در مورد نحوه استفاده صحیح از Playwright می‌دهیم.

من قصد دارم از Playwright CLI و مهارت‌های مرتبط با آن استفاده کنم.

با این رویکرد، ما Playwright CLI را به صورت محلی نصب می‌کنیم و سپس دانش لازم برای استفاده از آن را به عامل خود می‌دهیم. برای جلوگیری از هرگونه سردرگمی: من هیچ سرور Playwright MCP نصب نمی‌کنم.

نصب

بیایید ابتدا رابط خط فرمان متن‌باز Microsoft Playwright را نصب کنیم. اگر هنوز این کار را انجام نداده‌اید، با تایپ کردن / quit`` از رابط خط فرمان تعاملی خارج شوید. سپس، در ترمینال خود:

# Pre-req: nodejs installed
npm install -g @playwright/cli@latest # Install Playwright CLI globally
npm install @playwright/test # Install Playwright test framework

npx playwright install-deps # Install dependencies
npx playwright install chromium chrome # Install browser binaries in Linux / WSL

و حالا بیایید مهارت را اضافه کنیم. این دستور زیرپوشه مهارت را مستقیماً از GitHub در پوشه مهارت‌های Gemini ما دانلود می‌کند:

mkdir -p ~/.gemini/skills
npx degit microsoft/playwright-cli/skills/playwright-cli ~/.gemini/skills/playwright-cli

حالا می‌توانیم آن را آزمایش کنیم.

# Launch Playwright CLI with visible browser
playwright-cli open https://playwright.dev --headed

این باید یک جلسه مرورگر ایجاد کند که به URL مشخص شده باز می‌شود.

من همچنین می‌خواهم Gemini بتواند از Playwright در حالت "headed" استفاده کند، یعنی با یک رابط کاربری قابل مشاهده. اما این مهارت به Gemini نمی‌گوید که چگونه این کار را انجام دهد. بنابراین این خطوط را به ~/.gemini/skills/playwright-cli/SKILL.md در بخش Core اضافه کرده‌ام:

# Add the following under the "playwright-cli open" command

# Run in headed mode so we can see the browser
playwright-cli open https://playwright.dev --headed

تست با نمایشنامه نویس

مانند قبل، باید برنامه را اجرا کنیم (اگر در حال اجرا نیست). این کار را از همان جلسه اولیه ترمینال انجام دهید:

make dev

سپس، در بخش ترمینال دیگر، بیایید BrowserMCP را به طور موقت غیرفعال کنیم تا عامل در مورد اینکه از کدام ابزارها استفاده کند، دچار سردرگمی نشود. رابط خط فرمان Antigravity ( agy ) را مجدداً راه‌اندازی کنید. می‌توانیم سرور browsermcp را مستقیماً از طریق TUI غیرفعال کنیم:

برای باز کردن پنل مدیریت MCP، عبارت /mcp را در کادر اعلان تایپ کنید.
با استفاده از کلیدهای جهت‌نما (بالا/پایین) browsermcp انتخاب کرده و Enter/Return را فشار دهید.
برای غیرفعال کردن، به سمت راست حرکت کنید و برای خاموش کردن آن، Enter را فشار دهید.

حالا از عامل می‌خواهیم که با Playwright به برنامه ما برود. اما برخلاف BrowserMCP، نیازی نیست ابتدا مرورگر را باز کنیم. Playwright این کار را با یک فرآیند محلی برای ما انجام می‌دهد.

این دستور را در Agy CLI وارد کنید:

Using Playwright, connect to the application at http://localhost:5173. Then login as 'admin' with password 'password', and verify that the dashboard title says 'System Overview'. Take a screenshot of the dashboard and save it to output/dashboard.png. In the main dashboard, read the telemetry values shown, and present them back to me in a markdown table.

(مثل همیشه، رابط خط فرمان (CLI) قبل از اجرای هر ابزاری، اجازه می‌خواهد.)

اینجا چه فرقی دارد؟

لازم نبود اول مرورگر را اجرا کنیم.
ما نیازی به شروع و اتصال یک افزونه مرورگر نداشتیم.
لازم نیست به عامل بگوییم که ابتدا از سیستم خارج شود. تست از یک جلسه "تمیز" نمونه‌سازی می‌شود.
ما می‌توانیم از صفحه عکس بگیریم و آنها را به عنوان فایل‌های محلی ذخیره کنیم.

کمی بعد باید یک فایل dashboard.png در پوشه خروجی ببینید.

توجه داشته باشید که اجرای فراخوانی‌های ابزار را در رابط خط فرمان Agy خواهید دید، اما رابط کاربری مرورگر را نخواهید دید. دلیل این امر این است که Playwright به طور پیش‌فرض در حالت «بدون سر» اجرا می‌شود.

اما اگر دوباره با این اعلان اصلاح‌شده اجرا کنید، می‌توانید رابط کاربری را نیز ببینید:

Using Playwright, connect to the application at http://localhost:5173 in **headed** mode, and keep the browser open when you're done. Login as 'admin' with password 'password', and verify that the dashboard title says 'System Overview'. Take a screenshot of the dashboard and save it to output/dashboard.png. In the main dashboard, read the telemetry values shown and record them. Then wait 3 seconds, read them again. Now present the data back to me in a markdown table.

خروجی Agy CLI باید چیزی شبیه به این باشد:

چقدر عالی بود؟

۹. مرورگر داخلی آنتی‌گراویتی

گوگل آنتی‌گراویتی به مرورگر داخلی خود ( Browser Subagent ) مجهز است که خودکارسازی مرورگر را بدون نیاز به نصب ابزار جداگانه‌ای مانند Playwright CLI فراهم می‌کند.

چگونه کار می‌کند؟

برای کنترل مرورگر شما، عامل مرورگر داخلی مستقیماً از طریق پروتکل Chrome DevTools (CDP) کار می‌کند و نیاز به هرگونه افزونه مرورگر یا افزونه‌های واسطه‌ای در Antigravity 2.0 و IDE را از بین می‌برد.

وقتی Antigravity اجرا می‌شود، از طریق یک پورت اشکال‌زدایی محلی از طریق اتصال WebSocket به نمونه Chrome شما متصل می‌شود. دستورالعمل‌های سطح بالا از agent مستقیماً به دستورات سطح پایین CDP ترجمه می‌شوند که:

دستکاری DOM صفحه (مانند کلیک کردن روی عناصر یا وارد کردن متن).
وضعیت مرورگر را کنترل کرده و ناوبری را فعال کنید.
فریم‌ها و داده‌های بصری را به صورت بلادرنگ ثبت کنید.

با ترکیب کنترل مستقیم CDP با تحلیل بصری و چندوجهی، subagent هدف سطح بالای شما (مثلاً "تأیید اینکه داشبورد مقادیر تله‌متری صحیح را نمایش می‌دهد") را در نظر می‌گیرد، صفحه را به صورت بصری تجزیه و تحلیل می‌کند تا بفهمد چه اقداماتی مورد نیاز است و خودش آنها را اجرا می‌کند. همچنین به طور خودکار ویدیوها را ضبط می‌کند و از اقدامات خود اسکرین‌شات می‌گیرد و آنها را مستقیماً در فضای کاری شما به عنوان مصنوعات ذخیره می‌کند تا به عنوان اثبات بصری اجرای تست عمل کند.

در دسترس بودن ابزار

عامل مرورگر داخلی هنوز در رابط خط فرمان Antigravity (Agy CLI) که از ترمینال استفاده می‌کند، پشتیبانی نمی‌شود. با این حال، می‌توانید همین امروز از آن به صورت آماده در Antigravity IDE و Antigravity 2.0 استفاده کنید. امیدواریم پشتیبانی از عامل مرورگر در نسخه‌های آینده به Agy CLI اضافه شود!

نکته‌ای برای کاربران WSL: راه‌اندازی Browser Agent در Antigravity تحت WSL اکنون بسیار آسان‌تر از گذشته است. به جای مواجهه با مسیریابی پیچیده شبکه و ارسال پورت، کافیست حالت شبکه "mirrored" را در پیکربندی WSL خود فعال کنید. برای مشاهده راهنمای کامل و گام به گام، به راهنمای Resolving WSL Friction with Google Antigravity: The Agy 2.0 and Agy IDE Edition مراجعه کنید.

۱۰. سایر موارد استفاده برای خودکارسازی مرورگر

خودکارسازی مرورگر فقط به این معنی نیست که قبل از شروع به کار، دکمه ورود شما کار کند. وقتی متوجه شوید که می‌توانید یک مدرک لیسانس مدیریت (LLM) را مستقیماً به یک مرورگر وصل کنید، دنیای کاملاً جدیدی از پروژه‌های خودساخته و خودجوش به روی شما باز می‌شود.

اگر در حال ساخت عامل‌های هوش مصنوعی خودتان هستید، در اینجا چند روش وجود دارد که می‌توانید از ابزارهایی مانند BrowserMCP یا Playwright CLI برای انجام کارهای سنگین استفاده کنید:

دستیار تحقیق شخصی: تصور کنید که به نماینده خود یک URL خاص را نشان می‌دهید و از او می‌خواهید که در مورد موضوعی تحقیق کند، اما سایت نیاز به ورود به سیستم و پیمایش منوهای پیچیده دارد. به جای نوشتن یک وب اسکرپر سفارشی که هفته آینده خراب می‌شود، فقط به نماینده خود می‌گویید که وارد سیستم شود، به داده‌ها پیمایش کند و آن را برای شما خلاصه کند.
یکپارچه‌ساز «صندلی چرخان»: همه ما سیستم‌های اینترانت قدیمی داریم که API ندارند. شما آن‌هایی را که می‌شناسید - جایی که باید داده‌ها را از سیستم A به صورت دستی کپی کنید و آن را در فرمی در سیستم B قرار دهید. یک عامل با اتوماسیون مرورگر می‌تواند به عنوان چسب جهانی عمل کند، صفحه سیستم قدیمی را بخواند و فرم را در سیستم جدید پر کند.
تریاژ و اصلاح خودکار: آیا ساعت ۳ صبح از سیستم مانیتورینگ خود هشدار P1 دریافت کرده‌اید؟ نماینده شما می‌تواند به طور خودکار URL داشبورد خاص را باز کند، نمودارها یا گزارش‌ها را بخواند (با استفاده از قابلیت‌های دید چندوجهی آن) و خلاصه‌ای را مستقیماً در کانال Slack شما ارسال کند و در طول یک حادثه، دقایق گرانبهایی را برای شما ذخیره کند.

زیبایی این رویکرد این است که شما دیگر محدود به API های موجود نیستید. اگر یک انسان بتواند کاری را در مرورگر انجام دهد، عامل شما نیز می‌تواند.

۱۱. نتیجه‌گیری

تبریک! شما به سادگی با گفتن آنچه که می‌خواستید به یک عامل هوش مصنوعی به زبان ساده انجام دهد، تست‌های رابط کاربری خودکار و قوی را ساخته و اجرا کرده‌اید. بدون انتخابگرهای CSS شکننده، بدون اسکریپت‌های تنظیمات پیچیده.

شما آموخته‌اید:

تست رابط کاربری لازم نیست دردناک باشد : با تمرکز بر هدف تست به جای پیاده‌سازی شکننده DOM، می‌توانیم سربار نگهداری را به میزان زیادی کاهش دهیم.
پروتکل زمینه مدل (MCP) به عامل‌های شما دسترسی جهانی و آسان به ابزارها، داده‌ها و محیط‌ها را می‌دهد.
BrowserMCP ابزاری فوق‌العاده برای آوردن قابلیت‌های عامل‌محور به جلسات محلی و موجود کروم شماست.
Skills و Playwright CLI سطح جدیدی از تست خودکار قطعی و تکرارپذیر را ارائه می‌دهند - که همگی از طریق افشای تدریجی قدرت می‌گیرند.
مرورگر Subagent شرکت Antigravity با معرفی ناوبری خودکار و چندوجهی و ضبط مصنوعات، همه چیز را یک قدم فراتر می‌برد.

حالا، بروید و کارهای خسته‌کننده را خودکار کنید!

۱۲. لینک‌های مفید

اگر می‌خواهید عمیق‌تر به ابزارها و مفاهیمی که امروز پوشش دادیم بپردازید، این منابع را بررسی کنید:

کد مخزن

مخزن گیت‌هاب agentic-ui-testing - لطفاً اگر این آزمایشگاه کد را مفید یافتید، یک ستاره به مخزن اضافه کنید!

ابزارها و چارچوب‌های اصلی

مفاهیم و مهارت‌های عامل‌محور

دیگر