जावास्क्रिप्ट यूनिट परीक्षण वातावरण की स्थापना

शुरुआत में एक समारोह था और इसे एक जगह पर बुलाया। फिर हम उसे नई सुविधाओं के साथ दूसरी जगह बुलाना चाहते थे और उसे अपडेट किया। हमें यह एफएफ इतना पसंद आया कि हमने इसे तीसरे स्थान पर बुलाया और फिर भी कार्यात्मक संपादन किए और ... पहली जगह में कुछ गलत हो गया। कैसे पता करें? उन सभी स्थानों पर जांचें जहां हमने इस फ़ंक्शन का उपयोग किया था, क्या सब कुछ सही ढंग से काम करता है? यह संभव है, लेकिन यूनिट परीक्षणों का उपयोग करना बेहतर है।

सभी को नमस्कार। सैंडबॉक्स से कनेक्टेड गुमनाम। आप खोज इंजन की पहली पंक्तियों में अपने कोड का परीक्षण करने का सही तरीका पा सकते हैं, लेकिन आपको पर्यावरण की स्थापना के साथ छेड़छाड़ करनी होगी। इसलिए आज मैं नौसिखिया डेवलपर्स को यूनिट कोड के परीक्षण के लिए पर्यावरण स्थापित करने में मदद करना चाहता हूं।

PS - यह लेख को आगे पढ़ने के लिए समझ में आता है अगर पाठक ने npm या इसी तरह के पैकेज मैनेजर के साथ काम करने में महारत हासिल की है।

आइए छोटी परिभाषाओं से शुरुआत करें:

• इकाई परीक्षण एक ऐसी तकनीक है जिसका उद्देश्य त्रुटियों और दुष्प्रभावों की संभावना को कम करना है (जब एक बग को ठीक करते समय एक और बग पेश किया जाता है)।
• कर्म एक उपकरण है जो आपको ब्राउज़र में जावा-स्क्रिप्ट परीक्षण चलाने की अनुमति देता है।
• चमेली javasctript कोड के परीक्षण के लिए एक रूपरेखा है।

कर्मा इंस्टॉलेशन निर्देश (कई अन्य की तरह) कहते हैं कि परियोजना में संकुल स्थानीय स्तर पर स्थापित किया जाना चाहिए।

# Install Karma: $ npm install karma --save-dev 

 # Install plugins that your project needs: $ npm install karma-jasmine karma-chrome-launcher jasmine-core --save-dev 

सुविधा के लिए, हम npm install -g karma-cli ./node_modules/karma/bin/karma cli npm install -g karma-cli cli भी स्थापित कर सकते हैं, अन्यथा आदेश टर्मिनल से उपलब्ध ./node_modules/karma/bin/karma ।

तब हम एक विन्यास फाइल बना सकते हैं:

 karma init karma.conf.js 

• सबसे पहले, हम इस्तेमाल किए गए परीक्षण ढांचे से पूछा जाएगा। (जैस्मीन)
• क्या हम फ़ाइल / मॉड्यूल लोडर आवश्यकता का उपयोग करते हैं। Js (नहीं)
• हम कौन से ब्राउज़र देखना चाहते हैं (Chrome)
• हम किन फाइलों को सुन रहे हैं। (* [एसएस] pec.js)
• क्या किसी फाइल को बाहर रखा जाना चाहिए
• क्या मुझे परीक्षण परिवर्तनों की निगरानी करनी चाहिए (हाँ)

सवालों के जवाब देने के बाद, हमारे पास एक कॉन्फ़िगरेशन फ़ाइल होगी।

 // Karma configuration // Generated on Thu May 09 2019 18:54:02 GMT+0300 (RTZ 2 ()) module.exports = function(config) { config.set({ // base path that will be used to resolve all patterns (eg. files, exclude) basePath: '', // frameworks to use // available frameworks: https://npmjs.org/browse/keyword/karma-adapter frameworks: ['jasmine'], // list of files / patterns to load in the browser files: [ '*[Ss]pec.js' ], // list of files / patterns to exclude exclude: [ ], // preprocess matching files before serving them to the browser // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor preprocessors: { }, // test results reporter to use // possible values: 'dots', 'progress' // available reporters: https://npmjs.org/browse/keyword/karma-reporter reporters: ['progress'], // web server port port: 9876, // enable / disable colors in the output (reporters and logs) colors: true, // level of logging // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG logLevel: config.LOG_INFO, // enable / disable watching file and executing tests whenever any file changes autoWatch: true, // start these browsers // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher browsers: ['Chrome'], // Continuous Integration mode // if true, Karma captures browsers, runs the tests and exits singleRun: false, // Concurrency level // how many browser should be started simultaneous concurrency: Infinity }) } 

एक और परीक्षण फ़ाइल बनाएँ।

 // test.spec.js describe("A suite is just a function", function() { var a; it("and so is a spec", function() { a = true; expect(a).toBe(true); }); it("and so is a spec", function() { a = true; expect(a).toBe(false); }); }); 

हम पहले से ही देख सकते हैं कि karma start karma.conf.js चलाकर हमारा परीक्षण कैसे काम करता है, लेकिन मैं थोड़ा इंतजार करने और अतिरिक्त ऐड-ऑन बनाने की सलाह देता हूं।

npm i -D karma-jasmine-html-reporter पैकेज npm i -D karma-jasmine-html-reporter , जो गतिशील रूप से ब्राउज़र में परीक्षा परिणाम प्रदर्शित करता है। आइए कर्म विन्यास जोड़ें:

 ... reporters: ['progress', 'kjhtml'], client: { clearContext: false // leave Jasmine Spec Runner output visible in browser }, ... 

अब हम सब सेट हैं। हम karma start karma.conf.js और अपने पहले परीक्षण के लिए आगे बढ़ते हैं: डी