import { $, expect } from '@wdio/globals'
import { render } from '@testing-library/vue'
import HelloWorld from '../../src/components/HelloWorld.vue'

describe('Component Testing', () => {
    it('increments value on click', async () => {
        const { getByText } = render(HelloWorld)
        const btn = getByText('count is 0')

        // transform into WebdriverIO element
        const button = await $(btn)

        // interact with element like a real user
        await button.click()
        await button.click()

        await expect(button).toMatchInlineSnapshot(
            "count is 2"
        )
    })
})

اختبار من البداية إلى النهاية واختبار الوحدات / المكونات في متصفح حقيقي!

WebdriverIO هو إطار عمل شامل لتطوير تطبيقات الويب الخاصة بك. يتيح لك تشغيل اختبارات مكونات صغيرة وخفيفة الوزن بالإضافة إلى تشغيل سيناريوهات اختبار شاملة في المتصفح أو على جهاز محمول. هذا يضمن لك إجراء الاختبار في بيئة يستخدمها المستخدمون.

يأتي مع استراتيجيات اختيار ذكية تبسط التفاعل مثلاً مع React components أو تنفيذ استعلامات محدد عميقة مع أشجار DOM الظلية المتداخلة. نظرًا لأن التفاعلات تحدث من خلال بروتوكول أتمتة موحد، فمن المضمون أنها تتصرف بشكل طبيعي وليست مجرد محاكاة JavaScript.

إعداد سهل لاختبار مكونات الويب مع:

ابدأ مع WebdriverIO في ثوانٍ

يأتي مشغل اختبار WebdriverIO مع واجهة سطر أوامر توفر أداة تكوين قوية وتساعدك على إنشاء إعداد الاختبار الخاص بك في أقل من دقيقة. يتيح لك اختيار تكاملات إطار العمل للاختبار المتاحة ويسمح بسهولة بإضافة جميع المكونات الإضافية للمراسلين والخدمات المدعومة!

بأمر واحد بسيط يمكنك إعداد مجموعة اختبار كاملة:


$ npm init wdio@latest ./

ابدأ في تعلم المزيد حول WebdriverIO وكيفية البدء على يوتيوب.

شاهد محادثات حول WebdriverIO

يتحدث المجتمع حول WebdriverIO بنشاط في مجموعات المستخدمين المختلفة أو المؤتمرات حول مواضيع محددة تتعلق بالاختبار الآلي باستخدام WebdriverIO. شاهد هذه المحادثة على ميزاتي المفضلة في WebdriverIO بواسطة Julia Pottinger في Open Quality Conference.

هناك أيضًا العديد من قنوات يوتيوب مع دروس مفيدة من أعضاء المجتمع مثل Klamping، Seventeenth Sep أو Automation Bro.

تكامل Google Lighthouse

لا يقوم WebdriverIO بتشغيل الأتمتة فقط بناءً على بروتوكول WebDriver، بل يستفيد أيضًا من واجهات برمجة التطبيقات الأصلية للمتصفح لتمكين التكامل مع أدوات المطور الشائعة مثل Chrome DevTools أو Google Lighthouse. مع المكون الإضافي @wdio/lighthouse-service، يمكنك الوصول إلى الأوامر للتحقق مما إذا كان تطبيقك هو تطبيق PWA صالح بالإضافة إلى الأوامر لالتقاط مقاييس أداء الواجهة الأمامية مثل `speedIndex` وغيرها.

تكامل مع أدوات المطور مثل:

await browser.emulate('device', 'iPhone X')
await browser.enablePerformanceAudits({
    networkThrottling: 'Good 3G',
    cacheEnabled: true,
    formFactor: 'mobile'
})

// open application under test
await browser.url('https://localhost:3000')

expect(await browser.getMetrics().firstMeaningfulPaint)
    .toBeBelow(2500)

const pwaCheckResult = await browser.checkPWA()
expect(pwaCheckResult.passed).toBe(true)

من يستخدم WebdriverIO؟

مفتوح المصدر ومفتوح الحوكمة

نحن مشروع مفتوح المصدر مع التزام قوي بالشفافية وحوكمة المجتمع. نحن جزء من OpenJS Foundation التي تعد جزءًا من Linux Foundation. يتم إدارة المشروع بالكامل من قبل متطوعين وتموله شركات مستثمرة تريد رؤية نجاح المشروع. فريق المشروع ممتن للرعاية السخية من هذه الشركات.

💎 الرعاة المميزون

🥇 الرعاة الذهبيون

إذا كنت تستخدم WebdriverIO داخل منظمتك، فيرجى التفكير في دعم المشروع من خلال أن تصبح راعيًا. سيساعدنا ذلك في الحفاظ على استمرار المشروع وتطويره.

نود أن نعرب عن شكرنا الصادق لجميع المساهمين الذين ساعدوا في جعل WebdriverIO الأداة القوية التي هي عليه اليوم. نحن نقدر حقًا تفانيكم وجهودكم!

اختبار في بيئات حقيقية

متعدد الاستخدامات وغني بالمميزات

انتظار تلقائي

مبني على معايير الويب

دعم المحمول الأصلي

مجتمع ملتزم