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

Sofia Emelianova
Sofia Emelianova
GitHub
Jecelyn Yeen

नेटवर्क रिस्पॉन्स हेडर में बदलाव करना

अब नेटवर्क पैनल में, रिस्पॉन्स हेडर में बदलाव किया जा सकता है. पहले, एचटीटीपी रिस्पॉन्स हेडर के साथ एक्सपेरिमेंट करने के लिए, आपको वेब सर्वर का ऐक्सेस चाहिए होता था.

रिस्पॉन्स हेडर ओवरराइड की मदद से, अलग-अलग हेडर के लिए फ़िक्स किए गए प्रोटोटाइप को स्थानीय तौर पर बनाया जा सकता है. इसमें इनके अलावा, और भी चीज़ें शामिल हो सकती हैं:

किसी हेडर को बदलने के लिए, नेटवर्क > हेडर > रिस्पॉन्स हेडर पर जाएं. इसके बाद, किसी हेडर की वैल्यू पर कर्सर घुमाएं, बदलाव करें पर टैप करें. पर क्लिक करें, और उसमें बदलाव करें.

हेडर को बदलने की सुविधा का इस्तेमाल करके, सीओआरएस से जुड़ी गड़बड़ी को ठीक किया गया.

कस्टम हेडर भी जोड़े जा सकते हैं.

कस्टम हेडर जोड़ा जा रहा है.

सभी ओवरराइड में एक साथ बदलाव करने के लिए, सोर्स > ओवरराइड में जाकर, .headers फ़ाइल में बदलाव करें. यहां, वाइल्डकार्ड (*) का इस्तेमाल करके एक साथ कई अनुरोधों को खारिज करने के लिए, बदलाव करने का नियम जोड़ें पर भी क्लिक किया जा सकता है.

सभी बदलावों में बदलाव किया जा रहा है.

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

Nuxt, Vite, और Rollup की डीबगिंग में सुधार

डीबग करने के दौरान समस्याओं का तुरंत पता लगाने में आपकी मदद करने के लिए, बेहतर स्टैक ट्रेस अब उन फ़्रेम को छिपा देता है जो Nuxt 3.3 या इसके बाद के वर्शन से जनरेट किए गए सोर्स से आते हैं. DevTools ऐसे फ़्रेम छोड़ देता है:

  • Console ट्रेस में, N और फ़्रेम दिखाएं लिंक में.
  • सोर्स > कॉल स्टैक में, चेकबॉक्स. अनदेखा की गई सूची में शामिल फ़्रेम दिखाएं पर जाएं.

तीसरे पक्ष की अनदेखा करने की सूची की सुविधा चालू करने से पहले और बाद का स्टैक ट्रेस.

इन सुधारों को लागू करने के लिए, DevTools, Nuxt, Vite, और Rollup की टीमों ने मिलकर x_google_ignoreList सोर्स मैप एक्सटेंशन को अपनाया है:

DevTools की टीम, Nuxt, Vite, और Rollup की टीमों का शुक्रिया अदा करती है. इन टीमों की वजह से ही यह सुविधा उपलब्ध कराई जा सकी है. हम आपके प्रयासों और सहयोग की सराहना करते हैं. इनकी वजह से ही, इस सुविधा को लागू किया जा सका. आपके योगदान के लिए फिर से धन्यवाद!

Elements > Styles में सीएसएस से जुड़े सुधार

सीएसएस प्रॉपर्टी और वैल्यू अमान्य हैं

सीएसएस से जुड़ी समस्याओं का पता लगाने में आपकी मदद करने के लिए, स्टाइल पैनल अब इन पर क्रॉस का निशान लगाता है:

प्रॉपर्टी का नाम और प्रॉपर्टी की वैल्यू अमान्य है.

DevTools टीम, इस सुधार को लागू करने के लिए Yisi(一丝) का शुक्रिया अदा करती है.

ऐनिमेशन की शॉर्टहैंड प्रॉपर्टी में की-फ़्रेम के लिंक

animation शॉर्टहैंड सीएसएस प्रॉपर्टी में अब इससे जुड़े @keyframes ऐट-रूल के लिंक शामिल हैं. इससे, स्टाइल पैनल पर तेज़ी से नेविगेट किया जा सकता है.

यह ऐनिमेशन शॉर्टहैंड प्रॉपर्टी में मौजूद मुख्य फ़्रेम से लिंक होता है.

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

Console की नई सेटिंग: Enter बटन दबाने पर, अपने-आप पूरा होने वाले सुझाव

पिछले वर्शन (112) से, DevTools Console को इस तरह कॉन्फ़िगर किया जा सकता है कि Enter दबाने पर, अपने-आप पूरा होने वाले सुझाव लागू हो जाएं.

डिफ़ॉल्ट रूप से, अपने-आप पूरा होने वाले सुझाव को स्वीकार करने के लिए, Tab या Arrow right दबाएं. Enter के साथ भी अपने-आप पूरा होने की सुविधा का इस्तेमाल करने के लिए, सेटिंग. सेटिंग > कंसोल > चेकबॉक्स. Enter दबाने पर, अपने-आप पूरा होने का सुझाव स्वीकार करें को चालू करें.

सेटिंग में मौजूद इससे जुड़ा चेकबॉक्स.

इसके अलावा, दूसरी सेटिंग का टेक्स्ट अब ज़्यादा उपयोगकर्ता-अनुकूल है: चेकबॉक्स. कोड की जांच को उपयोगकर्ता की कार्रवाई के तौर पर करें.

Chromium की समस्या: 1276960.

कमांड मेन्यू में, बनाई गई फ़ाइलों को हाइलाइट किया जाता है

कमांड मेन्यू में मौजूद, 'जल्दी से खोलें' डायलॉग बॉक्स में अब तीसरे पक्ष की उन फ़ाइलों को धूसर कर दिया जाता है जिन्हें ignore-listed किया गया है. इससे, आपकी बनाई गई फ़ाइलों पर ज़्यादा ध्यान दिया जा सकेगा.

बदलाव से पहले और बाद में, 'तुरंत खोलें' डायलॉग में अनदेखी की गई स्क्रिप्ट.

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

JavaScript Profiler को बंद करना: दूसरा चरण

DevTools टीम ने Chrome 58 के शुरुआती वर्शन में ही, JavaScript Profiler को बंद करने का फ़ैसला कर लिया था. साथ ही, Node.js और Deno डेवलपर को JavaScript सीपीयू की परफ़ॉर्मेंस की प्रोफ़ाइलिंग के लिए, Performance पैनल का इस्तेमाल करने के लिए कहा था.

DevTools के वर्शन 113 में, चार चरणों में JavaScript Profiler को बंद करने का दूसरा चरण शुरू हो गया है. इस चरण में, पैनल को अब भी खोला जा सकता है. हालांकि, इसका यूज़र इंटरफ़ेस (यूआई) अब उपलब्ध नहीं है.

सीपीयू की परफ़ॉर्मेंस की प्रोफ़ाइल बनाने के लिए, परफ़ॉर्मेंस पैनल पर जाएं पर क्लिक करें.

JavaScript प्रोफ़ाइलर बंद किया जा रहा है.

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

अन्य हाइलाइट

इस रिलीज़ में, इन समस्याओं को ठीक किया गया है:

  • सोर्स पैनल में, यूनिकोड वर्णों वाले वैरिएबल के नामों को गलत तरीके से हैंडल करने की वजह से, प्रीटी-प्रिंटिंग में गड़बड़ी होती थी. इस गड़बड़ी को ठीक कर दिया गया है (1425055).
  • समस्याएं टैब में, नॉन-स्टैंडर्ड एचटीएमएल वैल्यू (1399414) से जुड़ी, अपने-आप भरने की सुविधाओं की समस्याओं के बारे में एक नया मैसेज जोड़ा गया है.

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

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

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

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

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

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