jest configuration debugging jest based tests
जेस्ट कॉन्फिगरिंग, डिबगिंग और जेस्ट की तुलना अन्य जावास्क्रिप्ट टेस्टिंग फ्रेमवर्क के साथ करें, विशेष रूप से जेस्ट बनाम मोचा और जेस्ट बनाम जैस्मीन:
इस में जानकारीपूर्ण जेस्ट श्रृंखला , हम सब के बारे में पता लगाया जेस्ट का उपयोग करके रिएक्ट ऐप्स, मोक्स और जासूस का परीक्षण करना हमारे अंतिम ट्यूटोरियल में।
इस ट्यूटोरियल में, हम जेस्ट कॉन्फिग फाइलों के बारे में अधिक जानेंगे और देखेंगे कि आप वास्तव में एक या एक से अधिक परीक्षणों के निवारण के लिए जेस्ट परीक्षणों को कैसे डिबग कर सकते हैं।
हम जेस्ट कॉन्फिगर फाइल में आमतौर पर उपयोग किए जाने वाले कुछ विकल्पों का भी पता लगाएंगे, जिन्हें किसी प्रोजेक्ट में स्वतंत्र रूप से सेट किया जा सकता है या जिन्हें पैकेज.जॉन कॉन्फ़िगरेशन के एक हिस्से के रूप में जोड़ा जा सकता है।
हम अपने जेस्ट परीक्षणों को लिखने के लिए विजुअल स्टूडियो कोड का उपयोग करेंगे और जेएस परीक्षणों के लिए डिबगिंग समर्थन को सक्षम करने के लिए वीएस कोड में एक एक्सटेंशन या प्लगइन का उपयोग करेंगे।
इसके अलावा, हम मोस्ट और जैस्मीन जैसे विभिन्न जावास्क्रिप्ट परीक्षण रूपरेखाओं की तुलना जेस्ट के साथ करेंगे और एक-दूसरे के पेशेवरों और विपक्षों को समझेंगे।
आप क्या सीखेंगे:
विन्यास है
जेस्ट कॉन्फ़िगरेशन को 3 तरीकों से निर्दिष्ट किया जा सकता है
- Package.json फ़ाइल में एक कुंजी के माध्यम से।
- Jest.config.js फ़ाइल के माध्यम से - कॉन्फ़िगरेशन फ़ाइल को एक मॉड्यूल के रूप में लिखा गया है।
- एक JSON के माध्यम से जो विकल्प के साथ -config ध्वज के रूप में इस्तेमाल किया जा सकता है।
उपरोक्त सभी दृष्टिकोणों के साथ, आप एक ही परिणाम प्राप्त कर सकते हैं। चलिए पहला कदम देखते हैं - अर्थात् पैकेज.जॉन फ़ाइल में एक कुंजी के माध्यम से जेस्ट कॉन्फ़िगरेशन जोड़ना।
मौजूदा package.json फ़ाइल में, 'jest' नामक एक नई कुंजी जोड़ें। यह और कुछ नहीं बल्कि JSON फॉर्मेट में की-वैल्यू पेयर का एक सेट है। Jest से संबंधित सभी कॉन्फ़िगरेशन विकल्प को इस खंड में package.json फ़ाइल में जोड़ा जा सकता है।
सबसे अधिक बार उपयोग किए जाने वाले कॉन्फ़िगरेशन विकल्प नीचे सूचीबद्ध हैं।
(१) कवरेज संबंधी
संग्रहण, कवरेज, ट्रेडशोल्ड, कवरेजरिपोर्टर्स, कवरेजडायरेक्टरी - ये सबसे व्यापक रूप से उपयोग किए जाने वाले विकल्प हैं। कवरेज एक महत्वपूर्ण मीट्रिक है और यह सुनिश्चित करता है कि कोड का प्रीसेट थ्रेशोल्ड के खिलाफ परीक्षण किया जाए।
उनमें से प्रत्येक की एक विस्तृत व्याख्या इस प्रकार है:
(1) संग्रह: इस विकल्प का उपयोग यह निर्दिष्ट करने के लिए किया जाता है कि क्या हम जेस्ट टेस्ट धावक को सूचना एकत्र करना चाहते हैं या नहीं। जब सही पर सेट किया जाता है, तो जेस्ट धावक कवरेज की जानकारी एकत्र करता है। इस विकल्प के साथ, कवरेज को एकत्र किया जाएगा और नीचे दिखाए गए अनुसार परीक्षण निष्पादन के अंत में कंसोल पर प्रदर्शित किया जाएगा।
# 2) कवरेज यह सेटिंग हमें प्रतिशत के संदर्भ में सीमा मानों को निर्दिष्ट करने की अनुमति देती है। यह तब बहुत मददगार होता है जब संगठन या टीम कवरेज के एक निश्चित न्यूनतम मूल्य का पालन करना चाहती है जिसके बिना किसी भी कोड को मुख्य शाखा में धकेल या विलय नहीं किया जा सकता है।
आइए देखें कि इसका उपयोग कैसे किया जा सकता है।
कवरेज को वैश्विक स्तर, फ़ाइल-स्तर या किसी अन्य रेगेक्स पर निर्दिष्ट किया जा सकता है। जब वैश्विक स्तर पर निर्दिष्ट किया जाता है, तो सभी निर्दिष्ट सीमा परियोजना में संयुक्त सभी फाइलों के लिए मेल खाना चाहिए।
'coverageThreshold': { 'global': { 'branches':95, 'functions':100, 'lines':70, 'statements':-2 } } फ़ाइल स्तर पर कवरेज को निर्दिष्ट करना भी संभव है, 'वैश्विक' को बदलकर फ़ाइलनाम या रेगेक्स। दहलीज विन्यास आवश्यकता के आधार पर भिन्न हो सकते हैं।
'coverageThreshold': { './src/calculator.js': { 'branches':100, 'functions':100, 'lines':100, 'statements':-10 } } # 3) कवरेजरिपोर्टर्स: यह कॉन्फ़िगरेशन यह निर्दिष्ट करने के लिए उपयोग किया जाता है कि कवरेज रिपोर्ट तैयार करने के लिए आप किस रिपोर्टर का उपयोग करना चाहते हैं। एनपीएम पैकेज उपलब्ध होने के कारण बहुत सारे मौजूदा पत्रकार हैं जो परीक्षण निष्पादन के अंत में एक कवरेज रिपोर्ट उत्पन्न करने के लिए इस्तेमाल किया जा सकता है।
# 4) कवरेजडायरेक्टरी: यह सेटिंग उपयोगकर्ता को उस निर्देशिका को निर्दिष्ट करने की अनुमति देती है, जहां कवरेज रिपोर्ट को सहेजने या बनाए जाने के बाद कायम रहना चाहिए।
नीचे दिए गए सभी कवरेज से संबंधित कॉन्फ़िगरेशन सेटिंग्स का उपयोग करने का एक संयुक्त उदाहरण है।
'jest':{ 'collectCoverage':true, 'coverageThreshold': { 'global': { 'branches':95, 'functions':100, 'lines':70, 'statements':-2 }, './src/calculator.js': { 'branches':100, 'functions':100, 'lines':100, 'statements':-10 } }, 'coverageReporters': ( 'lcov','text' ), 'coverageDirectory': './output/code-coverage/' } यहां, हमने 2 कवरेज रिपोर्टरों का उपयोग किया है यानी lcov और text.Lcov लिनक्स की लाइन कवरेज है और यह डिफ़ॉल्ट रूप से मौजूद है और 'टेक्स्ट' रिपोर्टर का अर्थ है कि कवरेज आउटपुट कंसोल पर भी प्रदर्शित होगा। कवरेज रिपोर्ट 'कवरेजडायरेक्टरी' सेटिंग में निर्दिष्ट पथ पर उत्पन्न होगी।
# 2) नकली संबंधित
जेस्ट के साथ परीक्षण करते समय मोक्स का भारी उपयोग किया जाता है। नीचे दिए गए दोनों कॉन्फ़िगरेशन विकल्प आसान कॉन्फ़िगरेशन और मोक्स को साफ़ करने की अनुमति देते हैं।
- ऑटो मोड: जब यह सच हो जाता है, तो यह उन सभी मॉड्यूलों का मजाक उड़ाएगा जो डिफ़ॉल्ट रूप से परीक्षण में आयात किए जाते हैं।
- ClearMocks: जब सही पर सेट किया जाता है, तो यह प्रत्येक परीक्षण के बाद सभी नकली सेटअप / मॉड्यूल को साफ कर देगा, ताकि हर परीक्षा नए सिरे से शुरू हो। यह टेस्टक्लेनअप या 'आफ्टर' विधि का उपयोग करके भी प्राप्त किया जा सकता है, लेकिन इसे कॉन्फिग में रखने से यह और भी आसान हो जाता है।
# 3) टेस्ट संबंधित
(1) टेस्ट टाइमआउट: इस कॉन्फ़िगरेशन का उपयोग मिलीसेकंड में परीक्षण के लिए एक कठिन टाइमआउट सेटिंग प्रदान करने के लिए किया जाता है। इस कॉन्फ़िगर सीमा से अधिक लेने वाला कोई भी परीक्षण टाइमआउट अपवाद के कारण विफल हो जाएगा।
'jest' { 'testTimeout': 100 } # 2) वैश्विक: इस कॉन्फ़िगरेशन का उपयोग वैश्विक चर सेट करने के लिए किया जाता है जो प्रत्येक परीक्षण के साथ उपलब्ध होना चाहिए।
'jest' { 'globals': { 'globalVar': 'test global variable!' } } आइए परीक्षण में एक वैश्विक चर का उपयोग करने का प्रयास करें और देखें कि क्या यह उम्मीद के मुताबिक काम करता है।
describe('Calculator tests', () => { test('add 2 numbers', () => { // arrange & act const val = mathOps.sum(3,4) console.log(globalVar) // assert expect(val).toBe(7) }) इस परीक्षण को निष्पादित करने के बाद, GlobalVar का मान लॉग किया जाना चाहिए।
जाँच यहां सभी कॉन्फ़िगरेशन विकल्पों की विस्तृत सूची के लिए।
वीडियो विन्यास IS विन्यास पर है
डीबगिंग जेस्ट का उपयोग करना
इस खंड में, हम यह समझने की कोशिश करेंगे कि हम जेस्ट पर आधारित परीक्षणों को कैसे डिबग कर सकते हैं।
हम 2 अलग-अलग तरीकों को लागू करेंगे और समझेंगे जिसमें हम जेस्ट परीक्षणों को डिबग कर सकते हैं।
- नोड के मूल डिबगर और फिर परीक्षणों को डिबग करने के लिए क्रोम इंस्पेक्टर का उपयोग करना।
- विज़ुअल स्टूडियो कोड संपादक के भीतर ही परीक्षणों को डिबग करने के लिए विज़ुअल स्टूडियो कोड के डिबग कॉन्फ़िगरेशन का उपयोग करना। यह डीबग करने का सबसे अधिक उपयोग किया जाने वाला तरीका है क्योंकि विज़ुअल स्टूडियो कोड इन दिनों अधिकांश जावास्क्रिप्ट विकास के लिए पसंद का डिफ़ॉल्ट संपादक है।
इनमें से प्रत्येक दृष्टिकोण को नीचे विस्तार से बताया गया है।
# 1) नोड के मूल निवासी डिबगर का उपयोग करना
नोड जेएस मूल डिबगर का उपयोग करने के लिए, हमें परीक्षण में ger डीबगर का कीवर्ड सम्मिलित करना होगा, जहां हम ब्रेकपॉइंट लगाना चाहते हैं।
एक बार जब परीक्षण निष्पादक का सामना होता है डिबगर कमांड, यह निष्पादन को रोक देता है और यदि हम क्रोम डिबगर टूल संलग्न करते हैं, तो हम क्रोम टूल का उपयोग करके टेस्ट कोड (साथ ही फ़ंक्शन के तहत फ़ंक्शन) को डीबग कर सकते हैं।
Node के मूल निवासी डीबगर का उपयोग करने के लिए Chrome ब्राउज़र यहां एक शर्त है।
कृपया नीचे दिए गए चरणों का पालन करें।
# 1) परीक्षण के भीतर डिबगर कीवर्ड जोड़ें, उस बिंदु पर जहां आप परीक्षण को ब्रेकपॉइंट पर हिट करना चाहते हैं, 'डिबग' कमांड डालें
#दो) परीक्षण का उपयोग करके जांच करें -inspect-brk ध्वज।
ब्रेकपॉइंट मोड में परीक्षण को निष्पादित करने के लिए नीचे दिए गए आदेश का उपयोग करें।
/usr/local/bin/node --inspect-brk ./node_modules/jest/bin/jest.js --runInBand# 3) Chrome में नोड का डीबगर संलग्न करें। अब क्रोम ब्राउज़र में, क्रोम पर नेविगेट करें: // उपरोक्त चरण द्वारा बनाई गई लक्ष्य श्रोता से निरीक्षण करें और कनेक्ट करें।
# 4) निष्पादन जारी रखें, और आप देखेंगे कि ब्रेकप्वाइंट क्रोम डीबगर इंस्पेक्टर में हिट करता है और आप कॉल डीबगर में कॉल स्टैक और ऑब्जेक्ट स्टेट को डीबग कर सकते हैं।
जेस्ट परीक्षणों को डिबग करने का यह तरीका ठीक नहीं है, लेकिन बहुत उपयोगकर्ता के अनुकूल नहीं है क्योंकि आपको कोड संपादक से क्रोम पर स्विच करने की आवश्यकता है और इसके विपरीत बहुत अधिक घर्षण का कारण बनता है। आगामी अनुभाग में, हम डीबगर को विज़ुअल स्टूडियो कोड संपादक के भीतर कॉन्फ़िगर करने के तरीके देखेंगे।
# 2) VS कोड डीबग कॉन्फ़िगरेशन का उपयोग करना
# 1) बाएं पैनल से विज़ुअल स्टूडियो कोड के डिबग / रन अनुभाग का चयन करें।
#दो) अब, हम जेस्ट परीक्षणों के लिए डिबग कॉन्फ़िगरेशन को अपडेट करेंगे। ऐसा करने के लिए मेनू विकल्प का चयन करके एक नया कॉन्फ़िगरेशन जोड़ें।
# 3) एक बार एड कॉन्फ़िगरेशन विकल्प चुने जाने के बाद, यह एडिटर फलक में डिफॉल्ट कंटेंट के साथ `लॉन्च.जॉन` फाइल को खोलेगा। डिफ़ॉल्ट सामग्री निकालें और जेस्ट परीक्षणों के लिए डिबग कॉन्फ़िगरेशन बनाने के लिए नीचे दी गई सामग्री की प्रतिलिपि बनाएँ।
{ 'version': '0.2.0', 'configurations': ( { 'name': 'Debug Jest Tests', 'type': 'node', 'request': 'launch', 'runtimeArgs': ( '--inspect-brk', '${workspaceRoot}/node_modules/jest/bin/jest.js', '--runInBand' ), 'console': 'integratedTerminal', 'internalConsoleOptions': 'neverOpen', 'port': 9229 } ) } # 4) जेस्ट परीक्षणों को डीबग करने के लिए उपयोग किए जाने वाले नए जोड़े गए सामग्री कॉन्फ़िगरेशन को सहेजें। यदि आप कॉन्फिगरेशन को ध्यान से पढ़ते हैं, तो हमने कमांड के माध्यम से क्रोम डेवलपर टूल्स में नोड डीबगर से कनेक्ट करने का प्रयास करते समय हमने जो किया, वह वैसा ही है।
--inspect-brk ./node_modules/jest/bin/jest.js --runInBandयहाँ विन्यास होने का लाभ यह है कि परीक्षण स्वयं संपादक के एक भाग के रूप में चलेंगे / डिबग करेंगे (इस मामले में यह VSCode है) और हमें किसी भी बाहरी एप्लिकेशन से कनेक्ट होने की आवश्यकता नहीं है।
# 5) एक बार डिबग कॉन्फ़िगरेशन बन जाने के बाद, आप अब परीक्षणों को ब्रेकप्वाइंट जोड़ सकते हैं और इस RUN कॉन्फ़िगरेशन का उपयोग करके निष्पादित कर सकते हैं। यह सुनिश्चित करेगा कि परीक्षण ब्रेकप्वाइंट पर रुकता है और आप वास्तविक परीक्षण फ़ाइल में ब्रेकपॉइंट पर मान, ऑब्जेक्ट स्थिति को डीबग कर सकते हैं।
कोड फाइलों में लाइन नंबरों के पास क्लिक करके ब्रेकप्वाइंट जोड़े जा सकते हैं।
# 6) एक बार ब्रेकप्वाइंट जोड़ने के बाद, हम रन कॉन्फ़िगरेशन का चयन कर सकते हैं जो हमने परीक्षण को निष्पादित / डीबग करने के लिए चरण # 3 में जोड़ा था।
मोबाइल हॉटस्पॉट के लिए नेटवर्क सुरक्षा कुंजी कैसे खोजें
# 7) रन बटन को चुनने / क्लिक करने पर, आपको यह देखने में सक्षम होना चाहिए कि निष्पादन ब्रेकपॉइंट को हिट करता है और आप ब्रेकपॉइंट पर अधिक विवरण जैसे पर्यावरण / चर मान, स्टैक ट्रेस आदि प्राप्त कर सकते हैं।
ब्रेकपॉइंट / कोड फ्लो कंट्रोल बटन का उपयोग अगले ब्रेकपॉइंट पर जाने या अधिक विवरण के लिए फ़ंक्शन के अंदर स्थानांतरित करने के लिए किया जा सकता है।
वीडियो ट्यूटोरियल वह हैडिबगिंग
मोचा बनाम जैस्मीन है
नीचे के भाग में हम विभिन्न मापदंडों पर जेस्ट बनाम मोचा और जेस्ट बनाम जैस्मीन की तुलना करेंगे और स्नैपशॉट परीक्षण, कॉन्फ़िगरेशन में आसानी और विभिन्न फ्रेमवर्क की क्षमताओं की तुलना करेंगे।
| पैरामीटर | है | कहवा | चमेली |
|---|---|---|---|
| परीक्षण प्रकार समर्थित हैं | ज्यादातर यूनिट परीक्षण के लिए उपयोग किया जाता है। | इकाई का परीक्षण | यूनिट परीक्षण और E2E परीक्षण। |
| स्नैपशॉट परीक्षण | पूरी तरह से समर्थित - रिएक्ट घटकों के लिए विशेष रूप से उपयोग किया जाता है, जेस्ट घटक के स्नैपशॉट लेने और सहेजे गए घटक संरचना के खिलाफ परीक्षण आउटपुट की तुलना करने के लिए इसका उपयोग करने का समर्थन करता है। स्नैपशॉट यह सुनिश्चित करने का एक शानदार तरीका है कि UI अनपेक्षित रूप से परिवर्तित न हो। | समर्थन नहीं | समर्थन नहीं |
| अभिकथन और मिलान | माचिस के लिए अपेक्षित .js लाइब्रेरी का उपयोग करें। | नोड के मुखर मॉड्यूल के लिए समर्थन, और इसमें अन्य पुस्तकालय भी शामिल हो सकते हैं। | निर्मित कथनों में |
| मजाक | पूरी तरह से जेक में मोक्स और स्टब्स के समर्थन में बनाया गया है। | मॉकिंग या स्टबिंग के लिए बिल्ट इन सपोर्ट नहीं। मॉकिंग का समर्थन करने के लिए सिनॉन जैसे अन्य पुस्तकालयों के साथ इस्तेमाल किया जा सकता है। | स्पाईऑन का उपयोग करके सीमित समर्थन को इनबिल्ट करें। अन्य पुस्तकालयों के साथ एकीकृत कर सकते हैं। |
| निष्पादन की गति | 4 एक्स जेस्ट परीक्षण अपने स्वयं के सैंडबॉक्स में अलग-थलग हैं। इस प्रकार जेस्ट परीक्षण अनिवार्य रूप से समानांतर में चल रहे हैं जिसके कारण वे निष्पादन समय में काफी सुधार प्रदान करते हैं। | एक्स परीक्षणों के समानांतर निष्पादन का समर्थन नहीं करता है। | एक्स परीक्षणों के समानांतर निष्पादन का समर्थन नहीं करता है। |
| कॉन्फ़िगरेशन और सेटअप | बहुत आसान - शून्य कॉन्फ़िगरेशन की आवश्यकता। | ||
| परीक्षण निष्पादन का तरीका | नेतृत्वहीन | नेतृत्वहीन | नेतृत्वहीन |
| टेस्ट आउटपुट और संदर्भ | समृद्ध संदर्भ पोस्ट निष्पादन उत्पन्न करता है - जेस्ट विस्तृत परीक्षण संदर्भ प्रदान करता है जिसमें गहरी विफलता को खोदने के लिए आसान डिबगिंग सुनिश्चित करता है। | टेस्ट आउटपुट बहुत पठनीय नहीं है और डीबगिंग को थोड़ा चुनौतीपूर्ण बनाता है। | |
| डिबगिंग | देशी नोड डिबगर्स के लिए समर्थन को एक अलग लॉन्च कॉन्फ़िगरेशन के माध्यम से विजुअल स्टूडियो कोड जैसे संपादकों के भीतर डिबग करने के लिए भी इस्तेमाल किया जा सकता है। | देशी नोड डिबगर का समर्थन करता है। | क्रोम और डीबग में परीक्षण शुरू करने के लिए कर्म परीक्षण धावक का उपयोग कर सकते हैं। |
| कोड कवरेज़ | कोड कवरेज के लिए जेस्ट में इनबिल्ट सपोर्ट है। कवरेज विन्यास जेस्ट विन्यास में निर्दिष्ट किया जा सकता है और रिपोर्ट प्रत्येक परीक्षण निष्पादन के साथ उत्पन्न की जा सकती है। | कोई इनबिल्ट सपोर्ट नहीं। कवरेज रिपोर्ट तैयार करने के लिए बाहरी पुस्तकालयों के लिए समर्थन प्रदान करता है। | मोचा के समान |
| परीक्षण की शैली | BDD सभी तीन चौखटे ऐनक या विनिर्देशों के एक सेट के रूप में लिखे जाने के लिए परीक्षणों का समर्थन करते हैं जो उन्हें अधिक पठनीय बनाते हैं। | BDD | BDD |
निष्कर्ष
इस ट्यूटोरियल में, हमने उन विभिन्न तरीकों के बारे में सीखा जिनसे आप विज़ुअल स्टूडियो कोड के भीतर या क्रोम इंस्पेक्टर में नोड के मूल डीबगर का उपयोग करके अपने जेस्ट परीक्षणों को डीबग कर सकते हैं।
हमने जेस्ट कॉन्फिगर फ़ाइल में आमतौर पर उपयोग किए जाने वाले कॉन्फ़िगरेशन विकल्पों की खोज की। जेस्ट कॉन्फ़िगरेशन कोड कवरेज, एचटीएमएल रिपोर्ट, मॉक बिहेवियर सेट करना, ग्लोबल वैरिएबल सेट अप करना आदि जैसी बहुत सारी चीजें हासिल करने में मदद करता है।
PREV ट्यूटोरियल | सबसे पहले ट्यूटोरियल
अनुशंसित पाठ
- जेस्ट ट्यूटोरियल - जेस्ट फ्रेमवर्क का उपयोग करके जावास्क्रिप्ट यूनिट टेस्टिंग
- जेस्ट फ्रेमवर्क का उपयोग करके रिएक्ट ऐप्स का परीक्षण कैसे करें
- जैस्मीन फ्रेमवर्क ट्यूटोरियल उदाहरण सहित जैस्मीन Jquery
- वितरित बिल्ड: जेनकिंस मास्टर स्लेव कॉन्फ़िगरेशन
- सेलेनियम में डिबगिंग तकनीक: ब्रेकपॉइंट, डिबग मोड और अधिक
- उदाहरणों के साथ कॉन्फ़िगरेशन टेस्टिंग ट्यूटोरियल
- Node.js टेस्टिंग फ्रेमवर्क कैसे सेटअप करें: Node.js ट्यूटोरियल
- 25 सर्वश्रेष्ठ जावा परीक्षण फ्रेमवर्क और स्वचालन परीक्षण के लिए उपकरण (भाग 3)