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

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

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

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

सीएसएस की खास जानकारी पैनल, सिर्फ़ झलक देखने की सुविधा है. हमारी टीम अब भी इस सुविधा पर लगातार काम कर रही है. इसे और बेहतर बनाने के लिए, हमें आपका सुझाव चाहिए.

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

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

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

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

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

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

इसे बंद करने के लिए, सेटिंग > प्रयोग > स्टाइल पैनल में सीएसएस की लंबाई तय करने वाले टूल चालू करें चेकबॉक्स पर जाएं.

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

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

सीएसएस की prefers-contrast मीडिया फ़ीचर को एम्युलेट करना

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

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

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

Chrome की अपने-आप गहरे रंग वाली थीम की सुविधा को एम्युलेट करना

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

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

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

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

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

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

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

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

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

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

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

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

प्रॉपर्टी पैनल में प्रॉपर्टी के डिसप्ले को बेहतर बनाया गया

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

Chrome 95 में प्रॉपर्टी पैनल के बेहतर होने के साथ-साथ, अब काम की प्रॉपर्टी को आसानी से ढूंढा जा सकता है.

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

Console से जुड़े अपडेट

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

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

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

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

Console में Intl ऑब्जेक्ट की सही झलक और आकलन

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

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

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

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

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

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

कंसोल साइडबार अब भी उपलब्ध है. Chrome 94 में, हमने Console के साइडबार को बंद करने का एलान किया था. साथ ही, डेवलपर से सुझाव, शिकायत या राय देने के लिए कहा था.

साइडबार को बंद करने की सूचना के बाद, हमें काफ़ी सुझाव, राय, और शिकायतें मिली हैं. इसलिए, हम साइडबार को हटाने के बजाय उसे बेहतर बनाने पर काम करेंगे.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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