नमस्ते, DevTools डाइजेस्ट के पिछले एडिशन में, हमें असाइनोक्रोनस कॉल स्टैक और कुछ अन्य सुविधाओं के बारे में जानकारी मिली थी. इस वर्शन में, हमें नेटवर्क पैनल को फ़िल्टर करने की बेहतर सुविधा (शब्द अपने-आप पूरा होने की सुविधा के साथ) मिलेगी. साथ ही, शैडो DOM कॉन्टेंट में बदलाव करने की सुविधा, CodeMirror 4 के अपडेट वगैरह भी मिलेंगे.
नेटवर्क पैनल को फ़िल्टर करना
अब डोमेन जैसे कुछ फ़ील्ड के हिसाब से संसाधनों को फ़िल्टर किया जा सकता है. फ़िल्टर का एक फ़ॉर्मैट यह है: Domain:website.com. फ़िल्टर करने के अलावा, आपको फ़िल्टर की मान्य वैल्यू के लिए, ऑटोकंप्लीट के सुझाव भी मिलते हैं. ये सुझाव, क्वेरी टाइप करते ही रीयल-टाइम में अपडेट होते हैं. यह तब काम आता है, जब आपको किसी खास डोमेन से दिखाए जाने वाले सभी संसाधनों को ढूंढना हो. [crbubg.com/258421]
शैडो DOM कॉन्टेंट में बदलाव करना
DevTools में, एलिमेंट पैनल में हमेशा से ही सामान्य एचटीएमएल में बदलाव किया जा सकता है. अब ये सुविधाएं, शैडो डीओएम के एलिमेंट में भी उपलब्ध हैं. [crbug.com/348991]
CodeMirror 4.0 पर अपग्रेड करना
सोर्स पैनल के हिस्से के तौर पर इस्तेमाल किए जा रहे JavaScript पर आधारित टेक्स्ट एडिटर, CodeMirror को वर्शन 4 पर अपग्रेड कर दिया गया है. इस वजह से, कई नई सुविधाएं जोड़ी गई हैं. crbug.com/356878]
सीएसएस-प्रॉपर्टी को तुरंत खोजना
अब स्टाइल पैनल में मौजूद नए खोज बॉक्स से, प्रॉपर्टी के नाम, वैल्यू या नियम चुनने वाले टूल खोजे जा सकते हैं. क्वेरी टाइप करते ही, नतीजे रीयल-टाइम में हाइलाइट हो जाते हैं. [crbug.com/278852]
कंसोल मैसेज के बगल में टाइमस्टैंप
एक के बाद एक कई मैसेज लॉग करते समय, यह देखना मददगार हो सकता है कि मैसेज किस समय लॉग किया गया. इसे DevTools एक्सपेरिमेंट की मदद से चालू किया जा सकता है. [crbug.com/131714]
हीप स्नैपशॉट के लिए मेमोरी के आंकड़े
रिकॉर्ड किया गया हीप स्नैपशॉट देखते समय, आंकड़ों के पाई चार्ट पर ध्यान दें. इससे, आपको यह जानकारी विज़ुअल और कलर-कोड में मिलती है कि JavaScript का कौनसा हिस्सा सबसे ज़्यादा मेमोरी का इस्तेमाल कर रहा है. फ़िलहाल, यह सुविधा प्रयोग के तौर पर उपलब्ध है. इसे आज़माने के लिए, “हीप स्नैपशॉट के आंकड़े” चालू करें. [crbug.com/346335]
console.log का ओरिजनल सोर्स देखना, न कि रैप किया गया वर्शन
हो सकता है कि आपके पास console.log wrapper फ़ंक्शन हो, लेकिन माफ़ करें, console में आपके सभी मैसेज util.js:46 जैसे किसी फ़ंक्शन से आते हैं. अब DevTools की मदद से, अपनी मूल जगहों की जानकारी का पता लगाया जा सकता है. “Skip stepping through sources with particular names” इनपुट बॉक्स में, वह फ़ाइल डालें जो कंसोल लॉग मैसेज को रैप करती है. इससे DevTools, उस फ़ाइल को ब्लैकबॉक्स कर देगा और लॉग स्टेटमेंट का असल सोर्स दिखाएगा. [crbug.com/231007]
कुछ और छोटे, लेकिन असरदार बदलाव
डाइनैमिक तौर पर JavaScript इवेंट लिसनर जोड़ने या हटाने के बाद, एलिमेंट पैनल में इवेंट लिसनर पैनल को रीफ़्रेश करें. [crbug.com/341044]
Ctrl+का इस्तेमाल करके, कंसोल इनपुट पर फ़ोकस किया जा सकता है. यह सुविधा, DevTools में सिर्फ़ कीबोर्ड वर्कफ़्लो के लिए काम की हो सकती है. [crbug.com/144943]वैल्यू (बिंदीदार, डैश वाली, डबल, ग्रूव) के लिए, बॉर्डर-स्टाइल ऑटोकंप्लीट सुझाव को स्पेसिफ़िकेशन के हिसाब से अपडेट किया गया है. [crbug.com/349998]
सेटिंग पैनल में डिफ़ॉल्ट सेटिंग वापस लाएं और फिर से लोड करें बटन **जोड़ा गया है. यह बटन ठीक वैसा ही काम करता है जैसा कि इसके नाम से पता चलता है. [crbug.com/135451]
फ़िलहाल, यह सुविधा एक्सपेरिमेंट के तौर पर उपलब्ध है. बाईं ओर डॉक करें सुविधा को आज़माकर, देखें कि यह आपके वर्कफ़्लो के लिए सही है या नहीं. लेआउट के अन्य मोड में, मुख्य विंडो (दाईं या नीचे) में डॉक करना और अलग विंडो में अनडॉक करना शामिल है. [crbug.com/134282]
"wheel" को अब इवेंट लिस्नर ब्रेकपॉइंट के तौर पर ऑफ़र किया जाता है. यह सामान्य क्लिक, माउस मूव, माउस बटन दबाने वगैरह के इवेंट के अलावा है. [crbug.com/347562]
अभी के लिए बस इतना ही, पढ़ने के लिए धन्यवाद!