रनर

WebdriverIO में एक रनर यह संचालित करता है कि टेस्टरनर का उपयोग करते समय परीक्षण कैसे और कहां चलाए जाते हैं। WebdriverIO वर्तमान में दो अलग-अलग प्रकार के रनर का समर्थन करता है: लोकल और ब्राउज़र रनर।

लोकल रनर

लोकल रनर आपके फ्रेमवर्क (जैसे Mocha, Jasmine या Cucumber) को वर्कर प्रोसेस के भीतर शुरू करता है और आपकी सभी टेस्ट फाइलों को आपके Node.js वातावरण के भीतर चलाता है। हर टेस्ट फाइल को क्षमता के अनुसार एक अलग वर्कर प्रोसेस में चलाया जाता है, जिससे अधिकतम समवर्तिता संभव होती है। हर वर्कर प्रोसेस एक ब्राउज़र इंस्टेंस का उपयोग करता है और इसलिए अपना स्वयं का ब्राउज़र सेशन चलाता है, जिससे अधिकतम अलगाव सुनिश्चित होता है।

चूंकि हर परीक्षण अपनी खुद की अलग प्रक्रिया में चलता है, इसलिए टेस्ट फाइलों के बीच डेटा साझा करना संभव नहीं है। इसके लिए दो तरीके हैं:

• सभी वर्कर्स के बीच डेटा साझा करने के लिए @wdio/shared-store-service का उपयोग करें
• स्पेक फाइलों को समूहित करें (अधिक जानकारी के लिए टेस्ट सूट व्यवस्थित करना पढ़ें)

अगर wdio.conf.js में कुछ और परिभाषित नहीं है तो लोकल रनर WebdriverIO में डिफ़ॉल्ट रनर है।

इंस्टाल

लोकल रनर का उपयोग करने के लिए आप इसे इस प्रकार इंस्टाल कर सकते हैं:

npm install --save-dev @wdio/local-runner

सेटअप

लोकल रनर WebdriverIO में डिफ़ॉल्ट रनर है, इसलिए इसे आपके wdio.conf.js में परिभाषित करने की कोई आवश्यकता नहीं है। यदि आप इसे स्पष्ट रूप से सेट करना चाहते हैं, तो आप इसे इस प्रकार परिभाषित कर सकते हैं:

// wdio.conf.js
export const {
    // ...
    runner: 'local',
    // ...
}

ब्राउज़र रनर

लोकल रनर के विपरीत, ब्राउज़र रनर ब्राउज़र के भीतर फ्रेमवर्क को शुरू और निष्पादित करता है। यह आपको यूनिट टेस्ट या कंपोनेंट टेस्ट को JSDOM के बजाय वास्तविक ब्राउज़र में चलाने की अनुमति देता है, जिसका उपयोग कई अन्य टेस्ट फ्रेमवर्क करते हैं।

हालांकि JSDOM परीक्षण उद्देश्यों के लिए व्यापक रूप से उपयोग किया जाता है, यह अंत में वास्तविक ब्राउज़र नहीं है और न ही आप इसके साथ मोबाइल वातावरण का अनुकरण कर सकते हैं। इस रनर के साथ WebdriverIO आपको आसानी से ब्राउज़र में अपने परीक्षण चलाने और पेज पर रेंडर किए गए तत्वों के साथ इंटरैक्ट करने के लिए WebDriver कमांड का उपयोग करने की सुविधा देता है।

यहां JSDOM बनाम WebdriverIO ब्राउज़र रनर में परीक्षण चलाने का अवलोकन दिया गया है:

	JSDOM	WebdriverIO ब्राउज़र रनर
1.	वेब मानकों के पुनः कार्यान्वयन का उपयोग करके Node.js के भीतर आपके परीक्षण चलाता है, विशेष रूप से WHATWG DOM और HTML मानक	वास्तविक ब्राउज़र में आपके परीक्षण को निष्पादित करता है और कोड को उस वातावरण में चलाता है जिसका उपयोग आपके उपयोगकर्ता करते हैं
2.	कंपोनेंट्स के साथ इंटरैक्शन केवल JavaScript के माध्यम से नकल किया जा सकता है	आप WebDriver प्रोटोकॉल के माध्यम से तत्वों के साथ इंटरैक्ट करने के लिए WebdriverIO API का उपयोग कर सकते हैं
3.	कैनवास समर्थन के लिए अतिरिक्त निर्भरताओं की आवश्यकता होती है और सीमाएँ हैं	आपके पास वास्तविक Canvas API तक पहुंच है
4.	JSDOM में कुछ कैवियट और असमर्थित वेब API हैं	सभी वेब API समर्थित हैं क्योंकि परीक्षण वास्तविक ब्राउज़र में चलते हैं
5.	क्रॉस ब्राउज़र त्रुटियों का पता लगाना असंभव	मोबाइल ब्राउज़र सहित सभी ब्राउज़रों के लिए समर्थन
6.	तत्व छद्म स्थितियों के लिए परीक्षण नहीं कर सकता	:hover या :active जैसी ​​छद्म स्थितियों के लिए समर्थन

यह रनर आपके परीक्षण कोड को संकलित करने और उसे ब्राउज़र में लोड करने के लिए Vite का उपयोग करता है। यह निम्नलिखित कंपोनेंट फ्रेमवर्क के लिए प्रीसेट के साथ आता है:

• React
• Preact
• Vue.js
• Svelte
• SolidJS
• Stencil

प्रत्येक परीक्षण फ़ाइल / परीक्षण फ़ाइल समूह एक एकल पृष्ठ के भीतर चलता है जिसका अर्थ है कि प्रत्येक परीक्षण के बीच पृष्ठ को पुनः लोड किया जाता है ताकि परीक्षणों के बीच अलगाव सुनिश्चित किया जा सके।

इंस्टाल

ब्राउज़र रनर का उपयोग करने के लिए आप इसे इस प्रकार इंस्टाल कर सकते हैं:

npm install --save-dev @wdio/browser-runner

सेटअप

ब्राउज़र रनर का उपयोग करने के लिए, आपको अपनी wdio.conf.js फ़ाइल के भीतर runner प्रॉपर्टी को परिभाषित करना होगा, उदाहरण:

// wdio.conf.js
export const {
    // ...
    runner: 'browser',
    // ...
}

रनर ऑप्शंस

ब्राउज़र रनर निम्नलिखित कॉन्फिगरेशन की अनुमति देता है:

preset

यदि आप ऊपर उल्लिखित फ्रेमवर्क में से किसी एक का उपयोग करके कंपोनेंट्स का परीक्षण करते हैं, तो आप एक प्रीसेट परिभाषित कर सकते हैं जो सुनिश्चित करता है कि सब कुछ आउट ऑफ द बॉक्स कॉन्फिगर है। इस ऑप्शन का उपयोग viteConfig के साथ नहीं किया जा सकता है।

प्रकार: vue | svelte | solid | react | preact | stencil
उदाहरण:

wdio.conf.js

export const {
    // ...
    runner: ['browser', {
        preset: 'svelte'
    }],
    // ...
}

viteConfig

अपना स्वयं का Vite कॉन्फिगरेशन परिभाषित करें। आप या तो एक कस्टम ऑब्जेक्ट पास कर सकते हैं या मौजूदा vite.conf.ts फ़ाइल को आयात कर सकते हैं यदि आप विकास के लिए Vite.js का उपयोग करते हैं। ध्यान दें कि WebdriverIO परीक्षण हार्नेस सेट करने के लिए कस्टम Vite कॉन्फिगरेशन को रखता है।

प्रकार: string या UserConfig या (env: ConfigEnv) => UserConfig | Promise<UserConfig>
उदाहरण:

wdio.conf.ts

import viteConfig from '../vite.config.ts'

export const {
    // ...
    runner: ['browser', { viteConfig }],
    // या सिर्फ:
    runner: ['browser', { viteConfig: '../vites.config.ts' }],
    // या एक फंक्शन का उपयोग करें यदि आपका vite कॉन्फिग बहुत सारे प्लगइन्स शामिल करता है
    // जिन्हें आप केवल तब हल करना चाहते हैं जब वैल्यू पढ़ी जाती है
    runner: ['browser', {
        viteConfig: () => ({
            // ...
        })
    }],
    // ...
}

headless

यदि true पर सेट किया जाता है, तो रनर परीक्षण हेडलेस चलाने के लिए क्षमताओं को अपडेट करेगा। डिफ़ॉल्ट रूप से यह CI वातावरण में सक्षम होता है जहां CI पर्यावरण वेरिएबल '1' या 'true' पर सेट होता है।

प्रकार: boolean
डिफ़ॉल्ट: false, यदि CI पर्यावरण वेरिएबल सेट है तो true पर सेट करें

rootDir

प्रोजेक्ट रूट डायरेक्टरी।

प्रकार: string
डिफ़ॉल्ट: process.cwd()

coverage

WebdriverIO istanbul के माध्यम से टेस्ट कवरेज रिपोर्टिंग का समर्थन करता है। अधिक विवरण के लिए कवरेज ऑप्शंस देखें।

प्रकार: object
डिफ़ॉल्ट: undefined

कवरेज ऑप्शंस

निम्नलिखित विकल्प कवरेज रिपोर्टिंग को कॉन्फिगर करने की अनुमति देते हैं।

enabled

कवरेज संग्रह को सक्षम करता है।

प्रकार: boolean
डिफ़ॉल्ट: false

include

ग्लोब पैटर्न के रूप में कवरेज में शामिल फाइलों की सूची।

प्रकार: string[]
डिफ़ॉल्ट: [**]

exclude

ग्लोब पैटर्न के रूप में कवरेज से बाहर रखी गई फाइलों की सूची।

प्रकार: string[]
डिफ़ॉल्ट:

[
  'coverage/**',
  'dist/**',
  'packages/*/test{,s}/**',
  '**/*.d.ts',
  'cypress/**',
  'test{,s}/**',
  'test{,-*}.{js,cjs,mjs,ts,tsx,jsx}',
  '**/*{.,-}test.{js,cjs,mjs,ts,tsx,jsx}',
  '**/*{.,-}spec.{js,cjs,mjs,ts,tsx,jsx}',
  '**/__tests__/**',
  '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*',
  '**/.{eslint,mocha,prettier}rc.{js,cjs,yml}',
]

extension

रिपोर्ट में शामिल करने के लिए फाइल एक्सटेंशन की सूची।

प्रकार: string | string[]
डिफ़ॉल्ट: ['.js', '.cjs', '.mjs', '.ts', '.mts', '.cts', '.tsx', '.jsx', '.vue', '.svelte']

reportsDirectory

कवरेज रिपोर्ट लिखने के लिए डायरेक्टरी।

प्रकार: string
डिफ़ॉल्ट: ./coverage

reporter

उपयोग करने के लिए कवरेज रिपोर्टर्स। सभी रिपोर्टर्स की विस्तृत सूची के लिए istanbul डॉक्यूमेंटेशन देखें।

प्रकार: string[]
डिफ़ॉल्ट: ['text', 'html', 'clover', 'json-summary']

perFile

प्रति फाइल थ्रेशोल्ड जांचें। वास्तविक थ्रेशोल्ड के लिए lines, functions, branches और statements देखें।

प्रकार: boolean
डिफ़ॉल्ट: false

clean

परीक्षण चलाने से पहले कवरेज परिणामों को साफ़ करें।

प्रकार: boolean
डिफ़ॉल्ट: true

lines

लाइन्स के लिए थ्रेशोल्ड।

प्रकार: number
डिफ़ॉल्ट: undefined

functions

फंक्शन्स के लिए थ्रेशोल्ड।

प्रकार: number
डिफ़ॉल्ट: undefined

branches

ब्रांचेस के लिए थ्रेशोल्ड।

प्रकार: number
डिफ़ॉल्ट: undefined

statements

स्टेटमेंट्स के लिए थ्रेशोल्ड।

प्रकार: number
डिफ़ॉल्ट: undefined

सीमाएँ

WebdriverIO ब्राउज़र रनर का उपयोग करते समय, यह ध्यान रखना महत्वपूर्ण है कि थ्रेड ब्लॉकिंग डायलॉग जैसे alert या confirm का उपयोग नेटिव रूप से नहीं किया जा सकता है। ऐसा इसलिए है क्योंकि वे वेब पेज को ब्लॉक कर देते हैं, जिसका मतलब है कि WebdriverIO पेज के साथ संवाद जारी नहीं रख सकता है, जिससे निष्पादन रुक जाता है।

ऐसी स्थितियों में, WebdriverIO इन API के लिए डिफ़ॉल्ट रिटर्न वैल्यू के साथ डिफ़ॉल्ट मॉक प्रदान करता है। यह सुनिश्चित करता है कि अगर उपयोगकर्ता गलती से सिंक्रोनस पॉपअप वेब API का उपयोग करता है, तो निष्पादन नहीं रुकेगा। हालांकि, बेहतर अनुभव के लिए उपयोगकर्ता को इन वेब API को मॉक करने की सलाह दी जाती है। मॉकिंग में अधिक पढ़ें।

उदाहरण

कंपोनेंट टेस्टिंग के आसपास के दस्तावेज़ों को जांचना सुनिश्चित करें और इन और विभिन्न अन्य फ्रेमवर्क का उपयोग करने के उदाहरणों के लिए उदाहरण रिपॉजिटरी पर नज़र डालें।