DevTools में नया क्या है (Chrome 107)

Jecelyn Yeen

DevTools में कीबोर्ड शॉर्टकट को पसंद के मुताबिक बनाना

अब DevTools में, अपनी पसंदीदा कमांड के लिए कीबोर्ड शॉर्टकट को पसंद के मुताबिक बनाया जा सकता है.

सेटिंग > शॉर्टकट पर जाएं. इसके बाद, किसी कमांड पर कर्सर घुमाएं और कीबोर्ड शॉर्टकट को पसंद के मुताबिक बनाने के लिए, बदलाव करें बटन (पेन आइकॉन) पर क्लिक करें. आपके पास कॉर्ड (यानी कि एक साथ कई कुंजियां दबाकर इस्तेमाल किए जाने वाले शॉर्टकट) बनाने का विकल्प भी होता है.

DevTools में कीबोर्ड शॉर्टकट को पसंद के मुताबिक बनाएं.

Chromium से जुड़ी समस्याएं: 1335274, 174309

कीबोर्ड शॉर्टकट की मदद से, हल्के और गहरे रंग वाली थीम के बीच टॉगल करना

हल्के और गहरे रंग वाली थीम के बीच आसानी से टॉगल करने के लिए, कीबोर्ड शॉर्टकट कॉन्फ़िगर करें. डिफ़ॉल्ट रूप से, यह कार्रवाई किसी भी कीबोर्ड शॉर्टकट से मैप नहीं होती है.

कीबोर्ड शॉर्टकट की मदद से, हल्के और गहरे रंग वाली थीम के बीच टॉगल करें.

Chromium से जुड़ी समस्याएं: 1280398, 1226363

मेमोरी इंस्पेक्टर में C/C++ ऑब्जेक्ट हाइलाइट करना

मेमोरी इंस्पेक्टर, C/C++ मेमोरी ऑब्जेक्ट के सभी बाइट हाइलाइट करता है.

आस-पास की WebAssembly मेमोरी में किसी ऑब्जेक्ट के बाइट की पहचान करना एक मुश्किल काम था. आपको ऑब्जेक्ट का साइज़ पता होना चाहिए. साथ ही, ऑब्जेक्ट की शुरुआत से बाइट की संख्या गिननी होगी.

इस सुविधा की मदद से, आपको आस-पास की यादों से अलग करने में मदद मिलती है. बदलावों के बारे में ज़्यादा जानने के लिए, C/C++ डीबग करने के लिए मेमोरी इंस्पेक्टर को बढ़ाना लेख पढ़ें.

मेमोरी इंस्पेक्टर में C/C++ ऑब्जेक्ट हाइलाइट करें.

Chromium से जुड़ी समस्या: 1336568

HAR फ़ाइल इंपोर्ट करने के लिए, अनुरोध शुरू करने वाले की पूरी जानकारी देने की सुविधा

अब HAR इंपोर्ट के लिए, Initiator की पूरी जानकारी उपलब्ध है. इससे पहले, इंपोर्ट के दौरान नेटवर्क पैनल में सिर्फ़ कुछ इनिशिएटर की जानकारी दिखती थी.

नेटवर्क अनुरोध की शुरुआत करने वाले व्यक्ति की जानकारी से, डेवलपर को नेटवर्क अनुरोध के सोर्स का पता लगाने और नेटवर्क से जुड़ी समस्याओं की पहचान करने में मदद मिलती है.

HAR फ़ाइल इंपोर्ट करने के लिए, पूरी इनीशिएटर जानकारी का इस्तेमाल किया जा सकता है.

Chromium से जुड़ी समस्या: 1343185

Enter दबाने के बाद, DOM में खोजना शुरू करें

अब टाइप करते समय खोजने की सुविधा सेटिंग को बंद किया जा सकता है. इससे, Enter दबाने के बाद हमेशा DOM खोज शुरू होगी.

Elements पैनल में, Control या Command + F दबाकर, खोज बार को टॉगल करें. खोज टेक्स्ट बॉक्स में क्वेरी टाइप करते समय, DOM ट्री उस पहले एलिमेंट पर चला जाएगा जो क्वेरी से मेल खाता है. साथ ही, यह डिफ़ॉल्ट रूप से हाइलाइट हो जाएगा.

उपयोगकर्ताओं, खासकर उन टेस्टर के लिए यह सुविधा सही नहीं है जो हमेशा लंबी खोज क्वेरी के साथ काम करते हैं. लंबी खोज क्वेरी (जैसे, //div[@id="example"]) टाइप करने पर, DOM ट्री कई बार जंप कर सकता है. इससे गैर-ज़रूरी मोशन बनता है.

डीओएम की खोज.

सेटिंग > प्राथमिकताएं पर जाएं. इसके बाद, टाइप करते समय खोजें सुविधा बंद करें. इस बदलाव के बाद, Enter दबाने पर ही खोज शुरू होगी.

टाइप करते समय खोजने की सुविधा.

Chromium से जुड़ी समस्या: 1344526

align-content सीएसएस फ़्लेक्सबॉक्स प्रॉपर्टी के लिए start और end आइकॉन दिखाएं

स्टाइल पैनल में, display: flex या display: inline-flex का इस्तेमाल करके सीएसएस क्लास में align-content प्रॉपर्टी में बदलाव करें. start और end, आइकॉन के साथ ऑटोकंप्लीट ड्रॉपडाउन में दिखते हैं.

align-content फ़्लेक्सबॉक्स प्रॉपर्टी.

Chromium से जुड़ी समस्या: 1139945

अन्य हाइलाइट

  • Console साइडबार में मैसेज की सही संख्याएं दिखाएं. पहले, कंसोल मैसेज मिटाने पर गिनती रीफ़्रेश नहीं होती थी. (1343311)

झलक दिखाने वाले चैनल डाउनलोड करना

Chrome Canary, Dev या Beta को डिफ़ॉल्ट डेवलपमेंट ब्राउज़र के तौर पर इस्तेमाल करें. इन प्रीव्यू चैनलों से, आपको DevTools की नई सुविधाओं का ऐक्सेस मिलता है. साथ ही, आपको वेब प्लैटफ़ॉर्म के नए एपीआई को आज़माने का मौका मिलता है. इसके अलावा, आपको अपनी साइट पर मौजूद समस्याओं का पता लगाने में मदद मिलती है. इससे पहले कि आपके उपयोगकर्ता उन समस्याओं का पता लगाएं!

Chrome DevTools टीम से संपर्क करना

नई सुविधाओं, अपडेट या DevTools से जुड़ी किसी अन्य चीज़ के बारे में चर्चा करने के लिए, इन विकल्पों का इस्तेमाल करें.

DevTools में नया क्या है

DevTools में नया क्या है सीरीज़ में शामिल किए गए सभी विषयों की सूची.