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

Kayce Basques
Kayce Basques
X GitHub

डिवाइस मोड में Moto G4 के लिए सहायता

डिवाइस टूलबार चालू करने के बाद, अब डिवाइस सूची से Moto G4 के व्यूपोर्ट के डाइमेंशन को सिम्युलेट किया जा सकता है.

Moto G4 के व्यूपोर्ट को सिम्युलेट करना

व्यू पोर्ट के आस-पास Moto G4 का हार्डवेयर दिखाने के लिए, डिवाइस का फ़्रेम दिखाएं पर क्लिक करें.

Moto G4 का हार्डवेयर दिखाया जा रहा है

मिलती-जुलती सुविधाएं:

  • कमांड मेन्यू खोलें और Capture screenshot कमांड चलाएं. इससे, Moto G4 के हार्डवेयर वाले व्यूपोर्ट का स्क्रीनशॉट लिया जा सकेगा. इसके लिए, डिवाइस फ़्रेम दिखाएं को चालू करना होगा.
  • मोबाइल का इस्तेमाल करने वाले व्यक्ति की वेब ब्राउज़िंग की स्थितियों को ज़्यादा सटीक तरीके से सिम्युलेट करने के लिए, नेटवर्क और सीपीयू की स्पीड कम करें.

Chromium की समस्या #924693

कुकी से जुड़े अपडेट

'कुकी' पैनल में ब्लॉक की गई कुकी

ऐप्लिकेशन पैनल में मौजूद कुकी पैन में, अब ब्लॉक की गई कुकी को पीले रंग के बैकग्राउंड में दिखाया जाता है.

ऐप्लिकेशन पैनल के कुकी पैन में ब्लॉक की गई कुकी

नेटवर्क पैनल से मिलते-जुलते यूज़र इंटरफ़ेस (यूआई) को ऐक्सेस करने का तरीका जानने के लिए, कुकी ब्लॉक होने की वजह का पता लगाना लेख भी पढ़ें.

Chromium की समस्या #1030258

कुकी पैन में कुकी की प्राथमिकता

नेटवर्क और ऐप्लिकेशन पैनल में मौजूद कुकी टेबल में अब प्राथमिकता कॉलम शामिल है.

Chromium की समस्या #1026879

सभी कुकी वैल्यू में बदलाव करें

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

कुकी की वैल्यू में बदलाव करना

कुकी का डेटा शामिल करने के लिए, Node.js फ़ेच के तौर पर कॉपी करें

नेटवर्क अनुरोध पर राइट क्लिक करें. इसके बाद, कॉपी करें > Node.js फ़ेच के तौर पर कॉपी करें को चुनें. इससे आपको कुकी का डेटा शामिल करने वाला fetch एक्सप्रेशन मिलेगा.

Node.js फ़ेच के तौर पर कॉपी करें

Chromium की समस्या #1029826

वेब ऐप्लिकेशन के मेनिफ़ेस्ट आइकॉन ज़्यादा सटीक होंगे

इससे पहले, ऐप्लिकेशन पैनल में मौजूद मेनिफ़ेस्ट पैनल, वेब ऐप्लिकेशन मेनिफ़ेस्ट आइकॉन दिखाने के लिए खुद अनुरोध करता था. DevTools अब Chrome के इस्तेमाल किए गए मेनिफ़ेस्ट आइकॉन को दिखाता है.

मेनिफ़ेस्ट पैन में मौजूद आइकॉन

Chromium की समस्या #985402

सीएसएस content प्रॉपर्टी पर कर्सर घुमाकर, अनएस्केप की गई वैल्यू देखें

content प्रॉपर्टी की वैल्यू पर कर्सर घुमाकर, वैल्यू का अनएस्केप किया गया वर्शन देखें.

उदाहरण के लिए, इस डेमो में, p::after स्यूडो-एलिमेंट की जांच करने पर, आपको Styles पैनल में एस्केप की गई स्ट्रिंग दिखेगी:

एस्केप की गई स्ट्रिंग

content वैल्यू पर कर्सर घुमाने पर, आपको अनएस्केप की गई वैल्यू दिखती है:

बिना एस्केप की गई वैल्यू

Console में सोर्स मैप से जुड़ी गड़बड़ियों के बारे में ज़्यादा जानकारी

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

Console में सोर्स मैप लोड करने से जुड़ी गड़बड़ी

फ़ाइल के आखिर तक स्क्रोल करने की सुविधा बंद करने की सेटिंग

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

यहां इस सुविधा का GIF दिया गया है.

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

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

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

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

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

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