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

झलक देखने की सुविधा: सीएसएस की खास जानकारी वाला नया पैनल

सीएसएस की खास जानकारी वाले नए पैनल का इस्तेमाल करके, अपने पेज पर सीएसएस में किए जा सकने वाले सुधारों की पहचान करें. सीएसएस की खास जानकारी पैनल खोलें. इसके बाद, अपने पेज की सीएसएस की रिपोर्ट जनरेट करने के लिए, खास जानकारी कैप्चर करें पर क्लिक करें.

जानकारी में और ड्रिल-डाउन किया जा सकता है. उदाहरण के लिए, एक जैसे रंग लागू करने वाले एलिमेंट की सूची देखने के लिए, रंग सेक्शन में किसी रंग पर क्लिक करें. एलिमेंट पैनल में एलिमेंट खोलने के लिए, एलिमेंट पर क्लिक करें.

सीएसएस की खास जानकारी पैनल, झलक की सुविधा है. हमारी टीम अब भी इस पर काम कर रही है. इसमें सुधार करने के लिए, हमें आपके सुझाव, शिकायत या राय का इंतज़ार है.

सीएसएस की खास जानकारी पैनल के बारे में ज़्यादा जानने के लिए, यह लेख पढ़ें.

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

सीएसएस की लंबाई में बदलाव और कॉपी करने के अनुभव को पहले जैसा और बेहतर किया गया

सीएसएस को कॉपी करें और टेक्स्ट के तौर पर बदलाव करें सुविधा को लंबे समय वाली सीएसएस प्रॉपर्टी के लिए वापस लाया जाता है. इन अनुभवों के बारे में पिछली रिलीज़ में बताया गया है.

इसके अलावा, यूनिट की वैल्यू को अडजस्ट करने के लिए खींचें और छोड़ें. साथ ही, ड्रॉपडाउन की मदद से यूनिट टाइप को अपडेट करें. ऐड-ऑन की लंबाई वाले टेक्स्ट लिखने की सुविधा का असर, मुख्य बदलाव पर नहीं पड़ेगा.

अगर आपको कोई समस्या मिलती है, तो कृपया goo.gle/length-feedback पर जाएं.

इसे बंद करने के लिए, सेटिंग > एक्सपेरिमेंट > स्टाइल पैनल में, सीएसएस की लंबाई के ऑथरिंग टूल चालू करें.

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

टैब के अपडेट रेंडर करना

सीएसएस प्राथमिकता-कंट्रास्ट मीडिया सुविधा को एम्युलेट करें

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

कमांड मेन्यू खोलें, रेंडरिंग दिखाएं कमांड चलाएं. इसके बाद, सीएसएस मीडिया फ़ीचर प्राथमिकता देने का ड्रॉपडाउन सेट करें.

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

Chrome की ऑटो डार्क थीम सुविधा को एम्युलेट करें

अपने-आप गहरे रंग वाली थीम को एम्युलेट करने के लिए, DevTools का इस्तेमाल करें. इससे, Chrome में ऑटो गहरे रंग वाली थीम चालू होने पर, आपका पेज आसानी से दिखेगा.

Chrome 96 की मदद से, Android पर ऑटो डार्क थीम के लिए, ऑरिजिन ट्रायल की सुविधा लॉन्च की गई है. इस सुविधा के साथ ब्राउज़र, हल्के रंग वाली थीम वाली साइटों पर अपने-आप जनरेट होने वाली गहरे रंग वाली थीम लागू करता है. ऐसा तब होता है, जब उपयोगकर्ता ने ऑपरेटिंग सिस्टम में गहरे रंग वाली थीम के लिए ऑप्ट इन किया है.

कमांड मेन्यू खोलें, रेंडरिंग दिखाएं कमांड चलाएं. इसके बाद, अपने-आप गहरे रंग वाले मोड को एमुलेट करें ड्रॉपडाउन सेट करें.

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

स्टाइल पैनल में, एलानों को JavaScript के तौर पर कॉपी करें

संदर्भ मेन्यू में दो नए विकल्प जोड़े गए हैं. इनकी मदद से, सीएसएस के नियमों को JavaScript प्रॉपर्टी के तौर पर आसानी से कॉपी किया जा सकता है. ये शॉर्टकट विकल्प खास तौर पर उन डेवलपर के लिए काम के हैं जो CSS-in-JS लाइब्रेरी के साथ काम कर रहे हैं.

स्टाइल पैनल में, किसी सीएसएस नियम पर राइट क्लिक करें. किसी एक नियम को कॉपी करने के लिए, एलान के तौर पर कॉपी करें को चुनें या सभी नियमों को कॉपी करने के लिए, सभी एलानों को JS के तौर पर कॉपी करें चुनें.

उदाहरण के लिए, नीचे दिए गए उदाहरण में paddingLeft: '1.5rem' को क्लिपबोर्ड पर कॉपी किया जाएगा.

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

नेटवर्क पैनल में नया पेलोड टैब

पेलोड के साथ नेटवर्क के अनुरोध की जांच करने पर, नेटवर्क पैनल में नए पेलोड टैब का इस्तेमाल करें. इससे पहले, पेलोड की जानकारी हेडर टैब में उपलब्ध होती थी.

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

प्रॉपर्टी पैनल में प्रॉपर्टी दिखाने की सुविधा बेहतर बनाई गई

प्रॉपर्टी पैनल में, इंस्टेंस की सभी प्रॉपर्टी दिखाने के बजाय, अब सिर्फ़ काम की प्रॉपर्टी दिखती हैं. DOM प्रोटोटाइप और मेथड अब हटा दिए गए हैं.

Chrome 95 के प्रॉपर्टी पैनल में बेहतर बनाने की सुविधा की मदद से, अब काम की प्रॉपर्टी आसानी से ढूंढी जा सकती हैं.

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

कंसोल से जुड़े अपडेट

कंसोल में सीओआरएस की गड़बड़ियों को छिपाने का विकल्प

कंसोल में जाकर, सीओआरएस से जुड़ी गड़बड़ियों को छिपाया जा सकता है. सीओआरएस से जुड़ी गड़बड़ियों को अब 'समस्याएं' टैब में रिपोर्ट किया जाता है. इसलिए, सीओआरएस की गड़बड़ियों को कंसोल में छिपाने से, फ़ाइलों को व्यवस्थित करने में मदद मिल सकती है.

कंसोल में, सेटिंग आइकॉन पर क्लिक करें. इसके बाद, कंसोल में सीओआरएस से जुड़ी गड़बड़ियां दिखाएं चेकबॉक्स से सही का निशान हटाएं.

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

कंसोल में, Intl ऑब्जेक्ट की सही तरीके से झलक और आकलन की सुविधा

अब Intl ऑब्जेक्ट की सही झलक देखी जा सकती है और इसका कंसोल में तेज़ी से आकलन किया जाता है. पहले, Intl ऑब्जेक्ट की जांच तेज़ी से नहीं की जाती थी.

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

एक ही तरह के एक साथ काम नहीं करने वाले स्टैक ट्रेस

अब Console, async फ़ंक्शन के लिए async स्टैक ट्रेस की रिपोर्ट देता है, ताकि ये अन्य एक साथ काम नहीं करने वाले टास्क से मेल खाते रहें. साथ ही, यह फ़ंक्शन कॉल स्टैक में दिखाए गए टास्क से मेल खाता हो.

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

Console साइडबार को बनाए रखें

अब कंसोल साइडबार का इस्तेमाल किया जा सकता है. Chrome 94 में, हमने कंसोल साइडबार के आने वाले समय में बंद होने का एलान किया था. साथ ही, हमने डेवलपर से सुझाव, शिकायत या राय और समस्याओं के बारे में पूछा था.

अब हमें सुविधा बंद होने के नोटिस से काफ़ी सुझाव मिल गए हैं. हम साइडबार को हटाने के बजाय इसे बेहतर बनाने पर काम करेंगे.

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

ऐप्लिकेशन पैनल में ऐसे ऐप्लिकेशन का कैश पैनल जो अब काम नहीं करता

ऐप्लिकेशन पैनल में मौजूद ऐप्लिकेशन कैश पैनल को हटा दिया गया है, क्योंकि Chrome और Chromium पर आधारित दूसरे ब्राउज़र से AppCache की सुविधा हटा दी गई है.

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

[प्रयोग के तौर पर] ऐप्लिकेशन पैनल में नया Reporting API पैनल

Reporting API को इस तरह से डिज़ाइन किया गया है कि आप अपने पेज के सुरक्षा उल्लंघनों, काम न करने वाले एपीआई कॉल वगैरह की निगरानी कर सकें.

इस प्रयोग के चालू होने पर, अब ऐप्लिकेशन पैनल के नए Reporting API पैनल में रिपोर्ट की स्थिति देखी जा सकती है.

कृपया ध्यान दें कि एंडपॉइंट सेक्शन पर अभी काम चल रहा है. फ़िलहाल, इसमें रिपोर्टिंग एंडपॉइंट नहीं दिख रहा है.

इस लेख की मदद से, Reporting API के बारे में ज़्यादा जानें.

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

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

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

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

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

• crbug.com के ज़रिए हमें कोई सुझाव या फ़ीडबैक सबमिट करें.
• ज़्यादा विकल्प   > का इस्तेमाल करके DevTools से जुड़ी समस्या की शिकायत करें सहायता > DevTools में DevTools से जुड़ी समस्याओं की शिकायत करें.
• @ChromeDevTools पर ट्वीट करें.
• DevTools YouTube वीडियो या DevTools के बारे में सलाह YouTube वीडियो में नया क्या है, इस पर टिप्पणी करें.

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

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