إعداد Playwright في SvelteKit
ثبّت Playwright واضبطه لمشروع SvelteKit باستخدام التكامل الرسمي.
إعداد Playwright في SvelteKit درس مجاني في Sveltejs Academy على CoddyKit. هذا هو الدرس 1 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Sveltejs Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
ما هو Playwright
Playwright هو إطار حديث لاختبارات النهاية إلى النهاية، ويدعم Chromium وFirefox وWebKit.
التثبيت
يمكن لمعالج create-svelte في SvelteKit إضافة Playwright، وإلا فثبّتوه يدويًا.
npm init playwright@latestالإعداد
ينشئ المعالج ملف playwright.config.js يتضمن إعدادات المتصفح ومجلد الاختبارات وخطاف webServer لتشغيل تطبيقكم.
إعداد webServer
يمكن لـ Playwright تشغيل npm run build && npm run preview تلقائيًا قبل الاختبارات.
webServer: { command: "npm run build && npm run preview", port: 4173 }بنية المجلدات
توجد الاختبارات في tests/ أو e2e/. ومن المعتاد تخصيص ملف واحد لكل ميزة.
تشغيل الاختبارات
استخدموا سكربت npm للتشغيل.
npm run test:e2eوضع واجهة المستخدم
يوفر وضع واجهة المستخدم في Playwright تصحيحًا باستخدام التنقّل عبر الزمن.
npx playwright test --uiإنشاء الاختبارات
يسجّل الأمر codegen التفاعلات ويكتب الاختبارات نيابةً عنكم.
npx playwright codegen http://localhost:5173تعدد المتصفحات
تُشغّل الاختبارات على متصفحات متعددة بالتوازي لتوفير تغطية واسعة.
عارض التتبّع
ينتج عن الاختبارات الفاشلة تتبعات يمكنكم عرضها باستخدام playwright show-trace لتسريع تصحيح الأخطاء.
التكامل مع CI
يعمل Playwright على GitHub Actions وGitLab CI وغيرهما، مع توفير صور حاويات رسمية.
تحقق سريع
ماذا يفعل webServer في Playwright؟
مراجعة
أعدّوا Playwright باستخدام المعالج. واضبطوا webServer لتشغيل تطبيقكم تلقائيًا، ثم شغّلوا الاختبارات باستخدام npm run test:e2e.
الأسئلة الشائعة
هل درس «إعداد Playwright في SvelteKit» مجاني؟
نعم — نص درس «إعداد Playwright في SvelteKit» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Sveltejs Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
ماذا ستتعلم في «إعداد Playwright في SvelteKit»؟
ثبّت Playwright واضبطه لمشروع SvelteKit باستخدام التكامل الرسمي. تتمرن على Sveltejs Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Sveltejs Academy؟
لا تُشترط خبرة سابقة. Sveltejs Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 1 من أصل 4.
كم من الوقت يستغرق درس «إعداد Playwright في SvelteKit»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Sveltejs Academy هذا؟
نعم. كل درس في Sveltejs Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- إعداد Playwright في SvelteKit
- كتابة اختبارات تفاعل الصفحات
- اختبار النماذج والتنقل
- التكامل مع CI