Jest: RequJS के लिए समर्थन

++

यह जेस्ट के लिए मॉड्यूल सिस्टम ऐड-ऑन का समर्थन करने के लिए हमारे रोडमैप पर है (जैसे requ.js, es6 मॉड्यूल, आदि), लेकिन दुर्भाग्य से हम अभी तक काफी नहीं हैं।

आइए इस मुद्दे को इस पर प्रगति को ट्रैक करने के लिए खुला छोड़ दें, हालांकि -- मुझे लगता है कि यह आवश्यकता.जेएस लोडर का समर्थन करने के लिए बहुत उपयोगी होगा

@jeffmo webpack commonjs / ES6 / AMD का समर्थन करता है। अगर हम एक प्लगइन के रूप में जेस्ट ला सकते हैं तो हम शायद वह सब सामान मुफ्त में प्राप्त कर सकते हैं।

++

हमारे पास एक बड़े संगठन में कई परियोजनाएं हैं और हम मजाक का उपयोग करने की योजना बना रहे हैं लेकिन हम 100% आवश्यकताएँ हैं। Requjs एकीकरण पर कोई ईटा?

++

मैं जेस्ट को भी आज़माना चाहूंगा, लेकिन मैं जिस मौजूदा प्रोजेक्ट पर काम कर रहा हूं, वह RequJS का उपयोग कर रहा है।

:+1:

किसी ने इसे शिम के रूप में इस्तेमाल करने का सुझाव दिया है, क्या किसी ने इसे आजमाया है?

https://github.com/Jakobo/redefine

_चेतावनी के साथ व्यवहार्य_। मैंने कुछ यादृच्छिक रेपो में नोडफी के साथ थोड़ा सा निर्माण लागू किया जो चाल को स्टॉप-गैप के रूप में कर सकता था। संकुल के अंतर्गत scripts.cjs देखें।

लिटमस परीक्षण: आपका AMD मॉड्यूल उपनाम node_modules के अंतर्गत संबंधित मॉड्यूल के साथ संरेखित होता है । यदि लिटमस परीक्षण विफल हो जाता है, लेकिन आप हताश हैं, तो आप शुद्ध AMD मॉड्यूल को नोडिफाई कर सकते हैं और/या नोड_मॉड्यूल्स में सिम्लिंक जोड़ सकते हैं, लेकिन यह विचार मुझे दुखी करता है। मेरे दृष्टिकोण से, मेरे द्वारा उपयोग किए जाने वाले एक्सटर्नल UMD को लागू करते हैं और npm द्वारा मेरे AMD उपनामों के साथ संरेखित नामों पर स्थापित होते हैं - कोई बड़ी बात नहीं।

(मैंने nodefy से पहले uRequire की जाँच की, लेकिन CommonJS टेम्पलेट इसे कार्यात्मक रूप से नोडफी के समकक्ष प्रस्तुत करता है - मैं लक्षित उपकरण लूंगा। मैंने amdefine की भी जाँच की, लेकिन जेस्ट 'आवश्यकता' पर रेगेक्स मिलान का उपयोग करता है - शायद एक अनाम AMD है कोण? हमेशा यूएमडी होता है, लेकिन बिखरे हुए document संदर्भों के साथ यूएमडी को कोड करना खराब शिष्टाचार की तरह लगता है।)

+1

++

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

क्या अभी तक कोई व्यावहारिक उपाय है? मैं जिस मुख्य मुद्दे में चल रहा हूं वह परिभाषित बयान है जो प्रतिक्रिया घटकों को लपेटता है।

+1

@petehunt ने मुझे

+1

क्या कोई मुझे कोड कवरेज के साथ जैस्मीन/वेबपैक या जेस्ट/वेबपैक चल रहे ब्राउज़र परीक्षणों के उदाहरण के लिए इंगित कर सकता है?

++

हम requjs के लिए समर्थन की अपेक्षा कब कर सकते हैं?

+1

+1

+1

+1

+1

+1

यदि आप अपने परिभाषित कॉल के लिए वापसी के बजाय मॉड्यूल.एक्सपोर्ट का उपयोग करते हैं तो आप इसे अपने प्रीप्रोसेसर में जोड़ सकते हैं।

मेरे लिए काम करता है: अंगूठे:

// preprocessor.js
var ReactTools = require('react-tools');
module.exports = {
  process: function(src) {
    if (/define\(.*?\{/.test(src)) {
      //Remove AMD ceremony for use without require.js or almond.js
      src = src.replace(/define\(.*?\{/, '')
        .replace(/(}\);|}\))$/,'');
    }

    return ReactTools.transform(src);
  }
};

++

+1

+1

RequJS समर्थन के लिए +1

+1

@charliedowler क्या आप इस दृष्टिकोण को थोड़ा और स्पष्ट

if (typeof(module) == 'object' && module.exports) { module.exports = <my_element>;  }

फिर भी, मैं return का उपयोग कर रहा हूं, इसलिए मुझे प्री-प्रोसेसर से एक पार्सर त्रुटि मिल रही है। मैंने सोचा कि मैं पिछले रिटर्न से मेल खाने के लिए रेगेक्स को बढ़ाकर दूर हो सकता हूं। लेकिन यह बिल्कुल भी काम नहीं कर रहा है। मुझे "अवैध रिटर्न स्टेटमेंट" त्रुटि मिलती रहती है। शायद अभिव्यक्ति में कुछ गड़बड़ है, और यह इसे पकड़ नहीं रहा है।

if (/define\(.*?\{/.test(src)) {
  src = src.replace(/(define\(.*?\{|return.*[\s]}\);?$)/g,'');  
}

क्या मेरे लिए स्टडआउट में src लिखने का कोई तरीका है? एक साधारण कंसोल.लॉग काम नहीं कर रहा है।

और अंत में, यह मानते हुए कि मुझे यह सब काम मिल गया है। आप निर्भरताओं को कैसे संभाल रहे हैं? उदाहरण के लिए प्रतिक्रिया की तरह?

+1

आह! मैं साथ खेल रहा था (और बहुत मज़ा आ रहा था)। आज इसे एक वास्तविक परियोजना में खींचने की कोशिश की और कोई आवश्यकता नहीं मिली जेएस समर्थन: सोब: ... सभी मौजूदा "वास्तविक" परियोजनाओं के लिए डील ब्रेकर। वास्तव में दुखद। यह निश्चित रूप से एक रोमांचक विचार था!

:+1:

+1

+1

:+1:

:थम्स अप:

:+1:

:+1:

इसलिए मैंने अपने एएमडी मॉड्यूल और परीक्षणों को एक साथ संकलित करने के लिए वेबपैक का उपयोग करके इसे हल किया है। इसने मुझे अपने परीक्षणों के साथ सभी प्रकार के अतिरिक्त लोडर का भी उपयोग करने की अनुमति दी। https://github.com/ninjapanzer/Backbone-Flux-React-Webpack

:+1:

+1

+1

+1

इस मुद्दे की रिपोर्ट करने के लिए धन्यवाद और आपके धैर्य की सराहना करते हैं। हमने इस मुद्दे पर अपडेट के लिए कोर टीम को सूचित कर दिया है। हम अगले 30 दिनों के भीतर प्रतिक्रिया की तलाश कर रहे हैं या समस्या बंद हो सकती है।

+1

@ फेसबुक-जीथब-बॉट -4 कृपया इसे करें!

+1

+1

++

मैं जेस्टपैक पर काम कर रहा

एक तरफ ध्यान दें कि क्या किसी को एफबी स्टाइल जल्दबाजी मॉड्यूल का उपयोग करने वालों के अलावा जेस्ट का उपयोग करने वाले किसी भी बड़े (आईएसएच) ओपन सोर्स प्रोजेक्ट के बारे में पता है क्योंकि यह जेस्टपैक के प्रदर्शन का परीक्षण करने के लिए वास्तव में उपयोगी होगा?

मैं jest-requirejs पर भी काम कर रहा हूं जो एक मानक जेस्ट प्रीप्रोसेसर का एक प्रयास है जो प्रोजेक्ट main.js कॉन्फिग फाइल का विश्लेषण करता है और फिर एक deamdify , जो define को हटा देता है

अभी भी प्लगइन/लोडर सिंटैक्स पर काम कर रहा है, और परीक्षण वातावरण के अंदर jest.dontMock("") , jest.setMock("") और require.requireActual("") पथों को फिर से लिखना।

हेलो दोस्तों ये वाकई कमाल है। मुझे जेस्टपैक का विचार पसंद है और मैं अतिरिक्त मॉड्यूल रिज़ॉल्वर का समर्थन करना अधिक आसान बनाना चाहता हूं। अंत में मैं वेबसाइट में सुधार करना चाहता हूं और गेटिंग स्टार्टेड गाइड के हिस्से के रूप में जेस्टपैक जैसे समाधानों की सिफारिश करना चाहता हूं (जो मेरे दिमाग में है :))। @richardscarrott और @sterpe कृपया मुझे बताएं कि क्या आपको कुछ चाहिए।

साथ ही cc @mwolson और @ColCh

(बाकी सभी के लिए: कृपया टिप्पणियों को अपवोट करना बंद करें, यह मददगार नहीं है। यदि आप मजाक के लिए कुछ बनाना चाहते हैं, तो कृपया एक पुल अनुरोध भेजें। कोड तर्क जीतता है! व्यक्तिगत रूप से मैं केवल सुविधाओं को प्राथमिकता नहीं दे सकता क्योंकि समुदाय के लोगों को उनकी आवश्यकता है और मुझे _सभी मॉड्यूल लोडर_ का उपयोग न करें जो स्वयं वहां मौजूद हैं।)

जेस्टपैक दिलचस्प है, हालांकि मैं प्रति परीक्षण एक प्रवेश बिंदु बनाने का प्रशंसक नहीं हूं। https://github.com/Ticketmaster/jest-webpack-alias कुछ प्रीप्रोसेसिंग की कीमत पर, और वेबपैक के मॉड्यूल रिज़ॉल्यूशन कोड को फिर से लागू करने के कारण संभावित अभी तक-अनदेखे बग्स की कीमत पर समस्या को थोड़ा अधिक सामान्य रूप से हल करता है।

साथ ही: आरंभ करने वाली मार्गदर्शिकाओं में शायद यह उल्लेख होना चाहिए कि यदि आपके पास एक प्रीप्रोसेसर है, तो यह सीमित करना एक अच्छा विचार है कि आपके प्रीप्रोसेसर किन फाइलों पर चलते हैं, अन्यथा यह परीक्षण रन को काफी धीमा कर देता है।

प्रीप्रोसेसर केवल एक बार चलाए जाते हैं और आप कैश कुंजी फ़ंक्शन प्रदान कर सकते हैं। अगर फ़ाइल नहीं बदली है तो जेस्ट आपके प्रीप्रोसेसर को फिर से नहीं चलाएगा।

यह हो सकता है, लेकिन पहला रन भी हमारे परीक्षण सूट के निष्पादन में लगभग ~ 10 सेकंड जोड़ने के लिए पर्याप्त था।

सहमत हैं कि यह तेज़ नहीं है। FB पर पहला रन बाद के रनों की तुलना में लगभग दोगुना समय लेता है लेकिन व्यक्तिगत रूप से मुझे इसे हल करने के लिए कोई अन्य नहीं दिखता - हम FB पर बेबेल और अन्य कस्टम ट्रांसफ़ॉर्म का उपयोग कर रहे हैं; हम प्रीप्रोसेसर के बिना परीक्षण नहीं चला सकते :)

प्रीप्रोसेसर कैशिंग रिक्वायरज प्रीप्रोसेसर को विकसित करते समय मुझे काट रहा था। मैं ज्यादातर अभी भी जेस्ट @ 0.4 का उपयोग करता

इसे 0.5 के साथ ठीक काम करना चाहिए!

देव-वॉच मोड में वेबपैक बहुत तेज है।

चूंकि:

1. वेबपैक उनके रनटाइम को मेमोरी में रखता है (बिना रीलोड के)
2. संकलित स्रोत कोड स्मृति में भी स्थित होता है।

तो, मेरे जेस्ट प्रीप्रोसेसर में मैंने केवल (2) बिंदु लागू किया है।

स्मृति एफएस में, संकलन फ़ाइलें सिर्फ स्मृति में जेस्ट और Webpack क्रम रखने के लिए और स्मृति एफएस में परीक्षण मामलों पर अमल - छोटा में, एक पैकेज (Jestpack, सही है ...) जेस्ट और Webpack के शीर्ष पर प्रदर्शन के साथ सभी मुद्दों का समाधान हो जाएगा।

यही मेरा नजरिया है...

लेकिन अब हमें एक और परेशानी है: मेमोरी FS को अभी Jest में इंजेक्ट करना संभव नहीं है।

मैंने निजी जेस्ट कैश एपीआई का उपयोग करने के बारे में सोचा - संकलित स्रोत को सीधे कैश में इंजेक्ट करने के लिए। हो सकता है कि यह एक हैक हो, इसलिए मैं यहां गलत था: जेस्ट-वेबपैक/मुद्दे/4#इश्यूकमेंट-98623189

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

@cpojer मुझे लगा कि अंततः मॉड्यूल लोडर को कॉन्फ़िगर करने योग्य बनाने का आपका इरादा था क्योंकि यह पहले से ही विकल्प था, इसलिए मैंने सोचा कि मैं इसे जेस्टपैक के साथ एक स्टैब दूंगा। एकमात्र वास्तविक समस्या जिसमें मैंने भाग लिया, वह नोड_मॉड्यूल्स के लिए मैनुअल मोक्स की खोज के तर्क को समझ रहा था https://github.com/facebook/jest/issues/509 , मैं बस एक समाधान के साथ जा रहा था जो मुझे समझ में आया लेकिन अगर आप ' उस मुद्दे पर कोई अंतर्दृष्टि प्रदान करने में सक्षम होने के लिए जेस्टपैक के मॉड्यूल लोडर को HasteModuleLoader के साथ संरेखित करना अच्छा होगा।

@mwolson जेस्टपैक प्रति परीक्षण फ़ाइल में एक अलग प्रविष्टि बिंदु का उपयोग करने का कारण यह सुनिश्चित करना है कि यह अभी भी जेस्ट की बहु प्रक्रियाओं का लाभ उठा सकता है।

moduleLoader को पहले से ही कॉन्फ़िगरेशन के हिस्से के रूप में निर्दिष्ट किया जा सकता है, वास्तव में।

++

हम भी यही चाहेंगे। जेस्ट सॉफ्टवेयर के एक भयानक टुकड़े की तरह लगता है, लेकिन बिना किसी RequJS समर्थन के हमारे पास जो कुछ भी है, उसे फिर से नहीं लिख सकता।

+1

क्या समुदाय का कोई व्यक्ति इस पर काम करने में दिलचस्पी रखता है? मुझे इसके माध्यम से लोगों का समर्थन करने और आधिकारिक जेस्ट प्लगइन बनाने में खुशी होगी। यह संभावना नहीं है कि हम जल्द ही किसी भी समय एफबी में इसमें भारी निवेश करेंगे। जेस्ट टीम बहुत छोटी है (1.5 लोग) और दुर्भाग्य से हम इन सभी सुविधाओं पर काम नहीं कर सकते।

जावास्क्रिप्ट समुदाय की वर्तमान स्थिति और मानक के आधार पर ऐसा नहीं लगता है कि जावास्क्रिप्ट कोड को संलेखित करने के लिए स्वयं जेएस का एक बड़ा भविष्य है। अब हमारे पास ES2015 में एक मानकीकृत मॉड्यूल सिस्टम है। बैबेल और जेस्ट अब पूरी तरह से एकीकृत हैं और एक साथ अच्छी तरह से काम करते हैं। मैं किसी को भी कॉमनजेएस या ईएस2015 मॉड्यूल पर स्विच करने की सलाह दूंगा, जो आपको अधिक टूलिंग बॉक्स से बाहर उपलब्ध कराएगा।

आवश्यकता जेएस के पास कॉमनजेएस को आवश्यकता.जेएस में बदलने के तरीके के बारे में एक दस्तावेज भी है, जिसका उपयोग उत्पादन परिनियोजन के लिए किया जा सकता है, देखें: http://requirejs.org/docs/commonjs.html

व्यक्तिगत रूप से मुझे जेएस की आवश्यकता का उपयोग करके कोड लिखने में कोई उल्टा नहीं दिखता है। मुझे एक कोडमॉड लिखने में मदद करने में भी खुशी होगी जो जेएस कोडबेस को

@cpojer मैं यहां प्रीप्रोसेसर दृष्टिकोण के साथ कुछ हद तक सफल रहा था https://github.com/sterpe/jest-requirejs/blob/master/index.js लेकिन अब तक केवल !text/ प्लगइन्स के लिए एक ट्रांसफॉर्म लागू किया है। हमारी टीम requjs से पूरी तरह से हट गई है इसलिए मेरे पास उस रास्ते को जारी रखने का कोई कारण नहीं है।

मैं सहमत हूं, मुझे कोड लिखने के लिए RequJS का उपयोग करने में बहुत कम मूल्य दिखाई देता है। उत्पादन के लिए आवश्यक जेएस के लिए कॉमनजेएस/ईएस2015 मॉड्यूल कोड संकलित करना मेरे लिए समझ में आता है, लेकिन इस शैली के साथ मैन्युअल रूप से कोड लिखना अच्छा नहीं लगता है।

मैंने अभी RequJS से वेबपैक में माइग्रेशन किया है। हमारे कोडबेस में 300 से अधिक घटक हैं। पूरी प्रक्रिया आश्चर्यजनक रूप से आसान और दर्द रहित थी।

एएमडी से कॉमनजेएस शैली में कोड परिवर्तित करने के लिए मैंने जिस टूल का उपयोग किया है वह https://github.com/Skookum/recast-to-cjs था।

साथ ही https://github.com/facebook/jscodeshift की मदद से, हमने कुछ ही दिनों में अपने कोड बेस को रिएक्ट 0.11 से 0.14 पर माइग्रेट कर दिया।

उम्मीद है कि यह उसी स्थिति में किसी की मदद कर सकता है।

@टेंडेंट अच्छा! ठीक यही मैं पहले बात कर रहा था :) खुशी है कि इसने आपके लिए बहुत अच्छा काम किया।

यहाँ मेरा काम है:
https://github.com/1twitif/testRequireJSAmdModulesWithJest
यह कम से कम इस उपयोग के मामले में काम करता है:
http://stackoverflow.com/questions/33889662/not-able-to-load-amd-modules-through-jest

चूंकि यह बंद है, तो क्या इसका मतलब यह है कि फेसबुक इसके लिए समर्थन नहीं जोड़ने जा रहा है?

अगर फेसबुक से आपका मतलब मुझसे है, तो हाँ, यह संभावना नहीं है कि "आधिकारिक" समर्थन होगा। यह आपको जेस्ट में योगदान करने और इस सुविधा को प्राप्त करने से नहीं रोकना चाहिए, लेकिन मेरा मानना ​​​​है कि ज्यादातर लोग इन दिनों ES मॉड्यूल या कॉमनजेएस पर चले गए हैं।

हाँ मुझे पता हे। दुर्भाग्य से, मैं इन निर्भरताओं से दूर नहीं जा सकता क्योंकि यह काम के लिए है।

बैबेल-प्लगइन-ट्रांसफॉर्म-एएमडी-टू-कॉमनज जेस्ट+एएमडी की समस्या को हल करने के लिए उपयोगी साबित हो सकता है, खासकर यदि आप पहले से ही

मैंने एक उदाहरण प्रोजेक्ट स्थापित किया है जो दिखाता है कि परीक्षण वातावरण में परिवर्तन चलाकर जेस्ट को पारदर्शी रूप से एएमडी फाइलों की आवश्यकता कैसे हो सकती है।

मैं वास्तविक परियोजना में इस तरह के दृष्टिकोण के विवरण के बारे में अनिश्चित हूं - विशेष रूप से जेस्ट/आवश्यकता जेएस/वेबपैक/आदि के बीच कॉन्फ़िगरेशन-साझाकरण के लिए एक अच्छा दृष्टिकोण। .js कॉन्फ़िगरेशन फ़ाइल के लिए जेस्ट समर्थन अधिक पुन: प्रयोज्य समाधान की दिशा में एक कदम होगा (देखें https://github.com/facebook/jest/issues/2140)।

@msrose यह कमाल है। इसे साझा करने के लिए बहुत - बहुत धन्यवाद।

मैं समझता हूं कि यह एक पुराना मामला है। एक साधारण परिवर्तन काम कर सकता है:

exports.process = function (content) {
  return 'function define(name, deps, body) { module.exports = body.apply(undefined, deps.map(require)); }' + content;
}

मुझे लगता है कि AMD -> CJS का रूपांतरण कई तरीकों से किया जा सकता है, उदाहरण के लिए, deamdify , इंजेक्टेड रैपर, आदि। समस्या, अभी भी अनसुलझी है, आवश्यकता-शैली लोडर/प्लगइन सिंटैक्स है। वह सामान है जैसे fooTemplate = require('tpl!foo.tpl') और barJson = require('json!bar.json') (अपेक्षाकृत सामान्य वाले के रूप में)। लेकिन इनमें से बहुत सारे थे और वास्तविक दुनिया require-js प्रोजेक्ट्स इस तरह के सिंटैक्स से अटे पड़े हैं।

यह बहुत अच्छा होगा यदि ट्रांसफॉर्म सिस्टम में मौजूदा require-js प्लगइन्स को सीधे पुन: उपयोग करने का एक आसान तरीका था जो अंततः jest | के मॉड्यूल लोडर में फीड हो जाता है।

+1

ReferenceError: define is not defined

+1

विफल srcApp.test.js
टेस्ट सूट चलने में विफल रहा

ReferenceError: define is not defined

आपको amd के बजाय umd का उपयोग करना चाहिए। यदि यह संभव नहीं है, तो आपको एक रूपांतरण जोड़ना चाहिए (उदाहरण के लिए ऊपर लिंक किया गया बेबेल प्लगइन)।

जब loader! सिंटैक्स की बात आती है, तो हम इसका समर्थन नहीं करेंगे (हम वेबपैक के लिए भी इसका समर्थन नहीं करते हैं)। आयात को बदलने (लोडर को हटाने) के लिए समाधान है और जेस्ट को अपने transform कॉन्फ़िगरेशन का उपयोग करके बदलने दें। संबंधित चर्चा: #4868