اختبار تطبيقات الويب

# اختبار تطبيقات الويب

لاختبار تطبيقات الويب المحلية، اكتب نصوص Playwright برمجية أصلية بلغة Python.

**البرامج النصية المساعدة المتاحة**: - `scripts/with_server.py` - يدير دورة حياة الخادم (يدعم خوادم متعددة)

**قم دائما بتشغيل البرامج النصية باستخدام `--help` أولا** للاطلاع على الاستخدام. لا تقم بقراءة المصدر حتى تحاول تشغيل البرنامج النصي أولا وتجد أن الحل المخصص ضروري للغاية. يمكن أن تكون هذه البرامج النصية كبيرة جدا وبالتالي تلوث نافذة السياق الخاصة بك. وهي موجودة ليتم استدعاؤها مباشرة كبرامج نصية ذات صندوق أسود بدلا من استيعابها في نافذة السياق الخاصة بك.

## شجرة القرار: اختيار نهجك

``` مهمة المستخدم ← هل هي HTML ثابت؟ ├─ نعم ← اقرأ ملف HTML مباشرة لتحديد المحددات │ ├─ نجاح ← اكتب برنامج Playwright النصي باستخدام المحددات │ └─ فشل/غير مكتمل ← تعامل معه كديناميكي (أدناه) │ └─ لا (تطبيق ويب ديناميكي) ← هل الخادم يعمل بالفعل؟ ├─ لا ← تشغيل: python scripts/with_server.py --help │ ثم استخدم المساعد + اكتب برنامج Playwright نصي مبسط │ └─ نعم ← استطلاع ثم عمل: 1. انتقل وانتظر networkidle 2. التقط لقطة شاشة أو افحص DOM 3. حدد المحددات من الحالة المعروضة 4. نفذ الإجراءات باستخدام المحددات المكتشفة ```

## مثال: استخدام with_server.py

لبدء خادم، قم بتشغيل `--help` أولا، ثم استخدم المساعد:

**خادم واحد:** ```bash python scripts/with_server.py --server "npm run dev" --port 5173 -- python your_automation.py ```

**خوادم متعددة (على سبيل المثال، الواجهة الخلفية + الواجهة الأمامية):** ```bash python scripts/with_server.py \ --server "cd backend && python server.py" --port 3000 \ --server "cd frontend && npm run dev" --port 5173 \ -- python your_automation.py ```

لإنشاء برنامج نصي للأتمتة، قم بتضمين منطق Playwright فقط (تتم إدارة الخوادم تلقائيا): ```python from playwright.sync_api import sync_playwright

with sync_playwright() as p: browser = p.chromium.launch(headless=True) # Always launch chromium in headless mode page = browser.new_page() page.goto('http://localhost:5173') # Server already running and ready page.wait_for_load_state('networkidle') # CRITICAL: Wait for JS to execute # ... your automation logic browser.close() ```

## نمط الاستطلاع ثم العمل

1. **فحص DOM المعروض**: ```python page.screenshot(path='/tmp/inspect.png', full_page=True) content = page.content() page.locator('button').all() ```

2. **تحديد المحددات** من نتائج الفحص

3. **تنفيذ الإجراءات** باستخدام المحددات المكتشفة

## خطأ شائع

❌ **لا** تفحص DOM قبل انتظار `networkidle` في التطبيقات الديناميكية ✅ **انتظر** `page.wait_for_load_state('networkidle')` قبل الفحص

## أفضل الممارسات

- **استخدم البرامج النصية المجمعة كصناديق سوداء** - لإنجاز مهمة ما، فكر فيما إذا كان أحد البرامج النصية المتاحة في `scripts/` يمكن أن يساعد. تتعامل هذه البرامج النصية مع سير العمل الشائع والمعقد بشكل موثوق دون إرباك نافذة السياق. استخدم `--help` للاطلاع على الاستخدام، ثم استدعها مباشرة. - استخدم `sync_playwright()` للبرامج النصية المتزامنة - أغلق المتصفح دائما عند الانتهاء - استخدم محددات وصفية: `text=`, `role=`, محددات CSS، أو IDs - أضف أوقات انتظار مناسبة: `page.wait_for_selector()` أو `page.wait_for_timeout()`

## ملفات مرجعية

- **examples/** - أمثلة توضح الأنماط الشائعة: - `element_discovery.py` - اكتشاف الأزرار والروابط وعناصر الإدخال في صفحة - `static_html_automation.py` - استخدام عناوين URL لملفات `file://` لملفات HTML المحلية - `console_logging.py` - التقاط سجلات وحدة التحكم أثناء الأتمتة