/ الدليل / الملعب / dev-browser
← كل الخوادم ↗ GitHub
● مجتمع SawyerHood ⚡ فوري

dev-browser

بواسطة SawyerHood · SawyerHood/dev-browser

مهارة Claude تُشغّل متصفحًا مُفعَّلًا بـ devtools يمكن لوكيلك قيادته — تنقل، نقر، فحص، لقطة شاشة.

يمنح dev-browser وكيلك Claude متصفحًا غير مرئي موجَّهًا للمطورين عبر prompts المهارات. يُغلّف متصفحًا مبنيًا على CDP بأدوات صديقة للوكيل: selectors ثابتة، لقطة شاشة بعد كل إجراء، ولقطات DOM جاهزة للتقطيع. مثالي حين تحتاج متصفحًا دون إعداد playwright من البداية للنهاية.

▶ شاهد العرض 📦 التثبيت 💡 حالات الاستخدام

لماذا تستخدمه

الميزات الأساسية

عرض مباشر

كيف يبدو في الممارسة

جاهز

التثبيت

مستودع المؤلف · وثائق Claude Skills الرسمية

حالات الاستخدام

استخدامات عملية: dev-browser

أجرِ بحثًا ويب سريعًا دون إعداد MCP

👤 المطورون الذين لا يريدون Playwright في إعداد MCP ⏱ ~15 min beginner

متى تستخدمه: تريد من جلسة Claude Code تصفح شيء مرةً واحدة دون الالتزام بخادم متصفح دائم.

الخطوات
  1. التشغيل
    استخدم dev-browser. افتح https://vercel.com/docs/functions. أدرج أقسام الشريط الجانبي.✓ تم النسخ
    → عناوين مستخرجة مع عناوين URL للارتساء
  2. التعمق
    انتقل إلى «Runtime» — اقرأ الصفحة ولخّص خيارات وقت التشغيل الثلاثة في فقرة لكل منها.✓ تم النسخ
    → ثلاث فقرات مع استشهادات لأجزاء URL
  3. الالتقاط
    التقط لقطة شاشة لقسم التسعير لملاحظاتي.✓ تم النسخ
    → لقطة الشاشة محفوظة محليًا

النتيجة: بحث مكتمل بمتصفح حين احتجته، بلا بنية تحتية مستمرة.

المزالق
  • ثنائي Chromium مفقود — شغّل npx playwright install chromium مرةً واحدة
اجمعها مع: filesystem

فحص سلامة تدفق تسجيل الدخول على بيئة التدريج

👤 المطورون المعنيون بالجودة قبل النشر ⏱ ~5 min beginner

متى تستخدمه: قبل النشر، تريد النقر عبر المسار الرئيسي السعيد مرةً واحدة.

الخطوات
  1. الفتح
    استخدم dev-browser. افتح https://staging.myapp.com، التقط لقطة شاشة.✓ تم النسخ
    → لقطة شاشة الصفحة الرئيسية
  2. تسجيل الدخول
    انقر "Sign in"، أدخل [email protected] / Test1234، أرسل.✓ تم النسخ
    → لوحة تحكم ما بعد تسجيل الدخول ملتقطة
  3. التأكيد
    هل النص «Welcome, qa» مرئي على الصفحة؟✓ تم النسخ
    → نعم/لا + لقطة شاشة

النتيجة: اختبار دخاني في 60 ثانية قبل النقر على نشر.

المزالق
  • CAPTCHA عند تسجيل الدخول — أضف تجاوزًا للاختبار فقط في التدريج؛ dev-browser ليس كاسر CAPTCHA

التركيبات

اجمعها مع خوادم MCP أخرى لتحقيق نتائج x10

dev-browser-skill + filesystem

حفظ لقطات الشاشة بجانب الملاحظات

بعد كل خطوة، التقط لقطة شاشة في /notes/web-research/.✓ تم النسخ
dev-browser-skill + chrome-devtools

حين تحتاج عمقًا على مستوى devtools، تصاعد إلى chrome-devtools MCP

dev-browser أعطاني الصفحة — الآن استخدم chrome-devtools للتحقق من شلال الشبكة.✓ تم النسخ

الأدوات

ما يوفره هذا الـ MCP

الأداةالمدخلاتمتى تستدعيهاالتكلفة
open_url url التنقل 0
click selector|text التفاعل 0
type selector, text إدخال نص 0
snapshot none التأصيل في الحالة الحالية 0

التكلفة والحدود

تكلفة التشغيل

حصة API
N/A
الرموز لكل استدعاء
لقطات DOM محدودة الحجم؛ لقطات الشاشة base64
التكلفة المالية
مجاني
نصيحة
تخطَّ لقطات DOM حين لا تحتاجها — لقطة الشاشة وحدها كافية في الغالب

الأمان

الصلاحيات والأسرار ونطاق الأثر

تخزين بيانات الاعتماد: لا شيء
نقل البيانات الخارجي: مباشرةً إلى المواقع التي تتنقل إليها

استكشاف الأخطاء

الأخطاء الشائعة وحلولها

Error: Executable doesn't exist at chromium path

npx playwright install chromium — المهارة تفترض ثنائيات Playwright

Selector غير موجود

شغّل snapshot أولًا؛ اختر selector من DOM الحقيقي لا من تخمين

الصفحة تحجب الأتمتة

الموقع اكتشف الوضع غير المرئي — جرّب التشغيل مع headless=false في إعداد المهارة

البدائل

dev-browser مقابل البدائل

البديلمتى تستخدمهاالمقايضة
playwright MCPتريد متصفحًا دائمًا مسجَّلًا في MCPإعداد أكثر؛ المهارة أخف
mcp-chromeتحتاج Chrome الحقيقي المسجَّل دخولهليس متصفح اختبار غير مرئي

المزيد

الموارد

📖 اقرأ ملف README الرسمي على GitHub

🐙 تصفح القضايا المفتوحة

🔍 تصفح أكثر من 400 خادم MCP و Skills