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

Kayce Basques

ध्यान दें: क्या आपको DevTools को बेहतर बनाने में मदद चाहिए? Google के उपयोगकर्ताओं पर होने वाली रिसर्च में हिस्सा लेने के लिए, यहां साइन अप करें.

Chrome 66 में DevTools में आने वाली नई सुविधाओं और बड़े बदलावों में ये शामिल हैं:

• नेटवर्क पैनल में स्क्रिप्ट को अनदेखा करें
• डिवाइस मोड में ज़ूम इन करके अपने-आप अडजस्ट होने की सुविधा
• झलक और जवाब टैब में सुंदर प्रिंट करना
• झलक टैब में एचटीएमएल कॉन्टेंट की झलक देखना
• एचटीएमएल के अंदर मौजूद स्टाइल की मदद से, स्थानीय बदलाव

ध्यान दें: chrome://version पर देखें कि Chrome के किस वर्शन का इस्तेमाल किया जा रहा है. अगर पुराना वर्शन इस्तेमाल किया जा रहा है, तो ये सुविधाएं उपलब्ध नहीं होंगी. अगर आप बाद का वर्शन चला रहे हैं, तो हो सकता है कि ये सुविधाएं बदल गई हों. Chrome हर छह हफ़्तों में नए मेजर वर्शन पर अपने-आप अपडेट होता है.

यहां दी गई रिलीज़ नोट को पढ़ें या उसका वीडियो वर्शन देखें.

नेटवर्क पैनल में स्क्रिप्ट को अनदेखा करें

नेटवर्क पैनल में शुरू करने वाला कॉलम आपको बताता है कि संसाधन का अनुरोध क्यों किया गया था. उदाहरण के लिए, अगर JavaScript की वजह से किसी इमेज को फ़ेच किया जाता है, तो शुरू करने वाला कॉलम आपको JavaScript कोड की वह लाइन दिखाता है जिसकी वजह से अनुरोध किया गया था.

ध्यान दें: टेबल हेडर पर राइट क्लिक करके, नेटवर्क पैनल में कॉलम छिपा या दिखाए जा सकते हैं.

पहले, अगर आपके फ़्रेमवर्क में नेटवर्क के अनुरोधों को रैपर में रैप किया जाता था, तो Initiator कॉलम से काम का नहीं होता था. सभी नेटवर्क अनुरोध, रैपर कोड की एक ही लाइन पर ले जाते हैं.

इस स्थिति में आपको असल में वह ऐप्लिकेशन कोड देखना है जिसकी वजह से अनुरोध किया गया है. अब यह संभव है:

1. शुरू करने वाले कॉलम पर कर्सर घुमाएं. अनुरोध की वजह बनने वाली कॉल स्टैक की जानकारी, पॉप-अप में दिखती है.
2. उस कॉल पर राइट क्लिक करें जिसे आपको शुरू करने वाले के नतीजों से छिपाना है.
3. स्क्रिप्ट को अनदेखा करने की सूची में जोड़ें चुनें. शुरू करने वाला कॉलम, अब स्क्रिप्ट के उन सभी कॉल को छिपा देता है जिन्हें आपने अनदेखा किया है.

पहला डायग्राम. requests.js को अनदेखा किया जा रहा है

सेटिंग में जाकर, सूची को अनदेखा करें टैब से, अनदेखा की गई स्क्रिप्ट को मैनेज करें.

स्क्रिप्ट को अनदेखा करने के बारे में ज़्यादा जानने के लिए, स्क्रिप्ट या स्क्रिप्ट के पैटर्न को अनदेखा करें लेख देखें.

'झलक देखें' और 'जवाब दें' टैब में प्रिटी-प्रिंटिंग

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

दूसरा डायग्राम. झलक टैब में analytics.js के कॉन्टेंट को डिफ़ॉल्ट रूप से बहुत प्रिंट किया जा सकता है

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

तीसरी इमेज. फ़ॉर्मैट बटन की मदद से, analytics.js के कॉन्टेंट को मैन्युअल तरीके से प्रिंट करना

'झलक देखें' टैब में एचटीएमएल कॉन्टेंट की झलक देखना

पहले, नेटवर्क पैनल में झलक देखें टैब में कुछ खास स्थितियों में एचटीएमएल रिसॉर्स का कोड दिखाया जाता था. वहीं दूसरी ओर एचटीएमएल की झलक को रेंडर करते समय भी ऐसा किया जाता था. झलक टैब अब हमेशा एचटीएमएल की बुनियादी रेंडरिंग करता है. यह एक संपूर्ण ब्राउज़र नहीं है, इसलिए हो सकता है कि यह आपकी उम्मीद के मुताबिक HTML न दिखाए. अगर आपको एचटीएमएल कोड देखना है, तो रिस्पॉन्स टैब पर क्लिक करें या किसी संसाधन पर राइट क्लिक करके, सोर्स पैनल में खोलें को चुनें.

चौथी इमेज. झलक टैब में एचटीएमएल की झलक देखना

डिवाइस मोड में ज़ूम करने की सुविधा को अपने-आप अडजस्ट करें

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

स्थानीय बदलाव अब एचटीएमएल में तय की गई कुछ स्टाइल के साथ काम करते हैं

जब DevTools ने Chrome 65 में स्थानीय बदलाव लॉन्च किए थे, तब एक सीमा यह थी कि यह एचटीएमएल में तय किए गए स्टाइल में किए गए बदलावों को ट्रैक नहीं कर सकता था. उदाहरण के लिए, इमेज 7 में दस्तावेज़ के head में एक स्टाइल नियम है, जो h1 एलिमेंट के लिए font-weight: bold के बारे में बताता है.

पांचवी इमेज. एचटीएमएल में तय की गई स्टाइल का उदाहरण

Chrome 65 में, अगर आपने DevTools स्टाइल पैनल के ज़रिए font-weight एलान को बदला है, तो लोकल बदलाव इस बदलाव को ट्रैक नहीं करेंगे. दूसरे शब्दों में, अगली बार फिर से लोड करने पर, स्टाइल वापस font-weight: bold में बदल जाएगा. हालांकि, Chrome 66 में इस तरह के बदलाव अब सभी पेज लोड पर लागू होते हैं.

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

बोनस के लिए सलाह: इवेंट लिसनर ब्रेकपॉइंट को ज़्यादा काम का बनाने के लिए, फ़्रेमवर्क स्क्रिप्ट को अनदेखा करें

ध्यान दें: यह सेक्शन Chrome 66 से जुड़ा नहीं है. यह किसी मौजूदा सुविधा के बारे में बस एक बोनस सलाह है, जो आपके काम की हो सकती है.

जब मैंने JavaScript को डीबग करना शुरू करें वीडियो बनाया, तब कुछ दर्शकों ने टिप्पणी की कि इवेंट लिसनर ब्रेकपॉइंट, फ़्रेमवर्क पर आधारित ऐप्लिकेशन के लिए काम के नहीं हैं. ऐसा इसलिए, क्योंकि इवेंट सुनने वाले अक्सर फ़्रेमवर्क कोड में रैप किए जाते हैं. उदाहरण के लिए, इमेज 8 में मैंने DevTools में click ब्रेकपॉइंट सेट अप किया है. डेमो में मौजूद बटन पर क्लिक करने पर, लिसनर कोड की पहली लाइन में, DevTools अपने-आप रुक जाता है. इस मामले में, यह लाइन 1802 पर Vue.js का रैपर कोड रुक जाता है.

छठी इमेज. click ब्रेकपॉइंट, Vue.js के रैपर कोड में रुक जाता है

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

सातवीं इमेज. कॉल स्टैक पैनल से Vue.js स्क्रिप्ट को अनदेखा करना

अगली बार जब भी मैं बटन पर क्लिक करके click ब्रेकपॉइंट ट्रिगर करता/करती हूं, तो यह Vue.js कोड को बिना किसी रुकावट के एक्ज़ीक्यूट करता है. इसके बाद, मेरे ऐप्लिकेशन के लिसनर में, कोड की पहली लाइन पर रुक जाता है. यहीं पर मुझे इसे पूरा रोकना था.

आठवीं इमेज. click ब्रेकपॉइंट अब ऐप्लिकेशन के लिसनर कोड पर रुक जाता है

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

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

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

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

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

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

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

Chrome 123

• एक छिपी हुई मज़ाक़िया चीज़ ढूंढें
• एलिमेंट पैनल से जुड़े अपडेट
• एलिमेंट > स्टाइल में फ़ोकस किए गए पेज को एम्युलेट करना
• var() फ़ॉलबैक में कलर पिकर, ऐंगल घड़ी, और ईज़िंग एडिटर की सुविधा
• सीएसएस की लंबाई वाला टूल अब काम नहीं करता
• परफ़ॉर्मेंस > मुख्य ट्रैक में, चुने गए खोज नतीजे के लिए पॉपओवर
• नेटवर्क पैनल से जुड़े अपडेट
• नेटवर्क > EventStream टैब में, 'मिटाएं' बटन और खोज फ़िल्टर
• नेटवर्क > कुकी में तीसरे पक्ष की कुकी को छूट देने की वजहों के साथ टूलटिप
• सोर्स में सभी ब्रेकपॉइंट चालू और बंद करना
• Node.js के लिए DevTools में लोड की गई स्क्रिप्ट देखें
• Lighthouse 11.5.0
• सुलभता सुविधाओं में सुधार
• अलग-अलग तरह की हाइलाइट

Chrome 122

• Recorder एक्सटेंशन का आधिकारिक कलेक्शन लाइव है
• नेटवर्क में सुधार
• स्टेटस कॉलम में, काम न करने की वजह
• 'कॉपी करने का बेहतर तरीका' सबमेन्यू
• परफ़ॉर्मेंस में सुधार
• टाइमलाइन में मौजूद ब्रेडक्रंब
• मुख्य ट्रैक में इवेंट शुरू करने वाले लोग
• Node.js DevTools के लिए JavaScript वीएम इंस्टेंस सिलेक्टर मेन्यू
• सोर्स में नया शॉर्टकट और कमांड
• एलिमेंट में सुधार
• अब स्टाइल में, ::view-transition pseudo-element में बदलाव किया जा सकता है
• ब्लॉक कंटेनर के लिए, अलाइन-कॉन्टेंट प्रॉपर्टी से जुड़ी सहायता
• फ़ोल्ड किए जा सकने वाले नकली डिवाइसों के लिए पॉस्चर की सुविधा
• डाइनैमिक थीमिंग
• नेटवर्क और ऐप्लिकेशन पैनल पर तीसरे पक्ष की कुकी के फ़ेज़आउट से जुड़ी चेतावनियां
• Lighthouse 11.4.0
• सुलभता सुविधाओं में सुधार
• अलग-अलग तरह की हाइलाइट

Chrome 121

• एलिमेंट में सुधार
• नेटवर्क पैनल में व्यवस्थित फ़िल्टर बार
• @font-palette-values सहायता
• इस्तेमाल किया जा सकने वाला केस: किसी दूसरी कस्टम प्रॉपर्टी के फ़ॉलबैक के तौर पर कस्टम प्रॉपर्टी
• सोर्स मैप की बेहतर सहायता
• परफ़ॉर्मेंस पैनल में सुधार
• बेहतर इंटरैक्शन ट्रैक
• बॉटम-अप, कॉल ट्री, और इवेंट लॉग टैब में बेहतर फ़िल्टर करना
• सोर्स पैनल में इंडेंट मार्कर
• नेटवर्क पैनल में, बदले गए हेडर और कॉन्टेंट के लिए उपयोगी टूलटिप
• अनुरोध को ब्लॉक करने वाले पैटर्न जोड़ने और हटाने के लिए, निर्देश मेन्यू के नए विकल्प
• सीएसपी के उल्लंघनों से जुड़ा एक्सपेरिमेंट हटा दिया गया है
• Lighthouse 11.3.0
• सुलभता सुविधाओं में सुधार
• अलग-अलग तरह की हाइलाइट

Chrome 120

• तीसरे पक्ष की कुकी के फ़ेज़आउट
• प्राइवसी सैंडबॉक्स विश्लेषण टूल की मदद से, अपनी वेबसाइट की कुकी का विश्लेषण करना
• अनदेखा करने की बेहतर सुविधा की लिस्टिंग
• node_modules के लिए डिफ़ॉल्ट एक्सक्लूज़न पैटर्न
• अगर कोई ऐसा कोड मिलता है जिसे अनदेखा नहीं किया गया है, तो पकड़ में आने वाले अपवाद के तौर पर, एक्ज़ीक्यूशन रोक दिया जाता है
• सोर्स मैप में x_google_ignoreList का नाम बदलकर ignoreList किया गया
• रिमोट डीबगिंग के दौरान नया इनपुट मोड टॉगल
• एलिमेंट पैनल अब #document नोड के लिए यूआरएल दिखाता है
• ऐप्लिकेशन पैनल में कॉन्टेंट की सुरक्षा से जुड़ी लागू नीति
• ऐनिमेशन को डीबग करने की बेहतर सुविधा
• 'क्या आपको इस कोड पर भरोसा है?' वाला डायलॉग बॉक्स और Console में खुद को XSS से जुड़ी चेतावनी का मैसेज दिखता है
• वेब वर्कर और वर्कलेट में इवेंट लिसनर ब्रेकपॉइंट
• <audio> और <video> के लिए नया मीडिया बैज
• पहले से लोड करने की प्रक्रिया का नाम बदलकर, अनुमान के हिसाब से यूआरएल लोड होने की सुविधा में बदल दिया गया है
• Lighthouse 11.2.0
• सुलभता सुविधाओं में सुधार
• अलग-अलग तरह की हाइलाइट

Chrome 119

• एलिमेंट > स्टाइल में बेहतर @property सेक्शन
• बदलाव किया जा सकने वाला @property नियम
• अमान्य @property नियमों से जुड़ी समस्याओं की शिकायत की जाती है
• सिम्युलेट किए जाने वाले डिवाइसों की अपडेट की गई सूची
• सोर्स में स्क्रिप्ट टैग में सुंदर इनलाइन JSON
• कंसोल में जाकर निजी फ़ील्ड के अपने-आप पूरा होने की सुविधा
• Lighthouse 11.1.0
• सुलभता सुविधाओं में सुधार
• वेब एसक्यूएल का इस्तेमाल बंद होना
• ऐप्लिकेशन > मेनिफ़ेस्ट में स्क्रीनशॉट के आसपेक्ट रेशियो की पुष्टि करना
• अलग-अलग तरह की हाइलाइट

Chrome 118

• एलिमेंट > स्टाइल में कस्टम प्रॉपर्टी के लिए नया सेक्शन
• स्थानीय बदलावों में और सुधार
• बेहतर खोज की सुविधा
• बेहतर सोर्स पैनल
• सोर्स पैनल में व्यवस्थित किया गया फ़ाइल फ़ोल्डर
• सोर्स में पैनल का क्रम बदलना
• कई तरह की स्क्रिप्ट के लिए, सिंटैक्स हाइलाइट करने और प्रिंट करने की सुविधा
• कम की गई पारदर्शिता मीडिया सुविधा को प्राथमिकता देना
• लाइटहाउस 11
• सुलभता सुविधाओं में सुधार
• अलग-अलग तरह की हाइलाइट

Chrome 117

• नेटवर्क पैनल में सुधार
• वेब कॉन्टेंट को अपने डिवाइस पर ज़्यादा तेज़ी से बदलना
• XHR का कॉन्टेंट बदलना और अनुरोधों को फ़ेच करना
• Chrome एक्सटेंशन के अनुरोध छिपाना
• ऐसे एचटीटीपी स्टेटस कोड जिन्हें कोई भी व्यक्ति आसानी से पढ़ सकता है

• JSON के सब-टाइप के लिए सुंदर जवाब

• परफ़ॉर्मेंस: नेटवर्क इवेंट के लिए, फ़ेच करने की प्राथमिकता में हुए बदलाव देखें

• सोर्स की सेटिंग डिफ़ॉल्ट रूप से चालू होती हैं: कोड फ़ोल्ड करने और अपने-आप फ़ाइल ज़ाहिर करने की सुविधा

• तीसरे पक्ष की कुकी से जुड़ी समस्याओं को डीबग करने की बेहतर सुविधा

• नए रंग

• Lighthouse 10.4.0

• ऐप्लिकेशन पैनल में, पेजों को पहले से लोड करने से जुड़ी सेटिंग को डीबग करना

• DevTools के लिए C/C++ WebAssembly डीबग करने वाला एक्सटेंशन अब ओपन सोर्स है

• अलग-अलग तरह की हाइलाइट

• (प्रयोग के तौर पर) रेंडर करने के लिए नया एम्युलेटर: प्राथमिकता-reduced-transparency

• (प्रयोग के तौर पर) बेहतर प्रोटोकॉल मॉनिटर

Chrome 116

• जो स्टाइलशीट नहीं हैं उन्हें डीबग करने की बेहतर सुविधा
• एलिमेंट > स्टाइल > ईज़िंग एडिटर में लीनियर टाइमिंग सहायता
• स्टोरेज बकेट सपोर्ट और मेटाडेटा व्यू
• Lighthouse 10.3.0
• सुलभता: कीबोर्ड के निर्देश और स्क्रीन पर मौजूद कॉन्टेंट को बेहतर तरीके से पढ़ने की सुविधा
• अलग-अलग तरह की हाइलाइट

Chrome 115

• एलिमेंट में सुधार
• नया सीएसएस सबग्रिड बैज
• टूलसलाह में सिलेक्टर की खास जानकारी
• टूलटिप में कस्टम सीएसएस प्रॉपर्टी की वैल्यू
• सोर्स में सुधार
• सीएसएस सिंटैक्स को हाइलाइट करना
• शर्त के साथ ब्रेकपॉइंट सेट करने के लिए शॉर्टकट
• ऐप्लिकेशन > बाउंस ट्रैकिंग पर लागू होने वाली पाबंदियां
• Lighthouse 10.2.0
• कॉन्टेंट स्क्रिप्ट को डिफ़ॉल्ट रूप से अनदेखा करना
• नेटवर्क > रिस्पॉन्स में सुधार
• अलग-अलग तरह की हाइलाइट

Chrome 114

• WebAssembly डीबग करने की सहायता
• Wsm ऐप्लिकेशन में स्टेपिंग के बेहतर तरीके
• एलिमेंट पैनल और समस्याएं टैब का इस्तेमाल करके, अपने-आप जानकारी भरने की सुविधा को डीबग करना
• Recorder में किए गए दावे
• Lighthouse 10.1.1
• परफ़ॉर्मेंस बेहतर बनाना
• performance.mark(), परफ़ॉर्मेंस > टाइमिंग में कर्सर घुमाने पर दिखने वाला समय दिखाता है
• profile() कमांड, परफ़ॉर्मेंस > मुख्य की जानकारी अपने-आप भर देता है
• उपयोगकर्ता के धीमे इंटरैक्शन के लिए चेतावनी
• वेबसाइट की परफ़ॉर्मेंस की जानकारी से जुड़े अपडेट
• JavaScript प्रोफ़ाइलर को बंद करना: तीसरा चरण
• अलग-अलग तरह की हाइलाइट

Chrome 113

• नेटवर्क रिस्पॉन्स हेडर बदलना
• Nuxt, Vite, और रोलअप डीबग करने की प्रोसेस में सुधार
• एलिमेंट > स्टाइल में सीएसएस में सुधार
• अमान्य सीएसएस प्रॉपर्टी और वैल्यू
• ऐनिमेशन की शॉर्टहैंड प्रॉपर्टी में मुख्य फ़्रेम के लिंक
• कंसोल की नई सेटिंग: Enter पर अपने-आप पूरा होना
• कमांड मेन्यू में, लिखी गई फ़ाइलों पर ज़ोर दिया जाता है
• JavaScript प्रोफ़ाइलर को बंद करना: दूसरा चरण
• अलग-अलग तरह की हाइलाइट

Chrome 112

• Recorder से जुड़े अपडेट
• Recorder के रीप्ले एक्सटेंशन
• पियर्स सिलेक्टर की मदद से रिकॉर्ड करें
• लाइटहाउस विश्लेषण की मदद से रिकॉर्डिंग को Puppeteer स्क्रिप्ट के तौर पर एक्सपोर्ट करना
• Recorder के लिए एक्सटेंशन पाना
• एलिमेंट > स्टाइल से जुड़े अपडेट
• स्टाइल पैनल में सीएसएस दस्तावेज़
• सीएसएस नेस्टिंग सहायता
• कंसोल में लॉगपॉइंट और शर्त के साथ ब्रेकपॉइंट मार्क करना
• डीबग करते समय, उन स्क्रिप्ट को अनदेखा करना जो काम की नहीं हैं
• JavaScript प्रोफ़ाइलर का इस्तेमाल बंद होने की प्रोसेस शुरू हो गई है
• कम कंट्रास्ट को एम्युलेट करें
• लाइटहाउस 10
• अलग-अलग तरह की हाइलाइट

Chrome 111

• स्टाइल पैनल की मदद से, एचडी के रंग को डीबग करना
• बेहतर ब्रेकपॉइंट UX
• Recorder के पसंद के मुताबिक बनाए जा सकने वाले शॉर्टकट
• Angular के लिए बेहतर सिंटैक्स हाइलाइट
• ऐप्लिकेशन पैनल में कैश मेमोरी को फिर से व्यवस्थित करना
• अलग-अलग तरह की हाइलाइट

Chrome 110

• फिर से लोड करने पर, परफ़ॉर्मेंस पैनल को हटाना
• Recorder से जुड़े अपडेट
• Recorder में अपने यूज़र फ़्लो के कोड को देखना और उसे हाइलाइट करना
• रिकॉर्डिंग के टाइप को पसंद के मुताबिक बनाना
• रिकॉर्डिंग के दौरान यूज़र फ़्लो में बदलाव करना
• अपने-आप होने वाली फ़ोटो के प्रिंट की सुविधा
• Vue, SCSS वगैरह के लिए, सिंटैक्स को बेहतर तरीके से हाइलाइट करने और इनलाइन झलक देखने की सुविधा
• कंसोल में आसान और एक ही तरह के ऑटोकंप्लीट की सुविधा
• अलग-अलग तरह की हाइलाइट

Chrome 109

• Recorder: चरणों, इन-पेज फिर से चलाने, और चरण के संदर्भ मेन्यू के विकल्पों के तौर पर कॉपी करें
• परफ़ॉर्मेंस की रिकॉर्डिंग में फ़ंक्शन के असल नाम दिखाना
• कंसोल और सोर्स पैनल में नए कीबोर्ड शॉर्टकट
• JavaScript को डीबग करने की बेहतर सुविधा
• अलग-अलग तरह की हाइलाइट
• [प्रयोग के तौर पर] ब्रेकपॉइंट मैनेज करने के लिए, बेहतर उपयोगकर्ता अनुभव
• [प्रयोग के तौर पर] फ़ोटो की क्वालिटी अपने-आप सेव होने की सुविधा के बारे में जानकारी

Chrome 108

• ऐसी सीएसएस प्रॉपर्टी के लिए संकेत जो चालू नहीं हैं
• रिकॉर्डर पैनल में, XPath और टेक्स्ट सिलेक्टर का अपने-आप पता लगाना
• कॉमा लगाकर अलग किए गए एक्सप्रेशन का इस्तेमाल करना
• 'सूची को अनदेखा करने' की बेहतर सेटिंग
• अलग-अलग तरह की हाइलाइट

Chrome 107

• DevTools में कीबोर्ड शॉर्टकट को पसंद के मुताबिक बनाना
• कीबोर्ड शॉर्टकट की मदद से, हल्के और गहरे रंग वाली थीम टॉगल करें
• मेमोरी इंस्पेक्टर में C/C++ ऑब्जेक्ट हाइलाइट करें
• HAR इंपोर्ट के लिए, शुरू करने वाले की पूरी जानकारी दें
• Enter दबाने के बाद DOM खोज शुरू करें
• align-content सीएसएस फ़्लेक्सबॉक्स प्रॉपर्टी के लिए, start और end आइकॉन दिखाएं
• अलग-अलग तरह की हाइलाइट

Chrome 106

• लिखे गए / सोर्स पैनल में डिप्लॉय किए गए के हिसाब से फ़ाइलों को ग्रुप में रखें
• एसिंक्रोनस ऑपरेशन के लिए लिंक किए गए स्टैक ट्रेस
• तीसरे पक्ष की उन स्क्रिप्ट को अपने-आप अनदेखा करना जिनकी पहचान की जा चुकी है
• डीबग करने के दौरान बेहतर कॉल स्टैक
• सोर्स पैनल में, नज़रअंदाज़ किए जाने वाले सोर्स छिपाना
• कमांड मेन्यू में, नज़रअंदाज़ किए जाने वाले फ़ाइलों को छिपाना
• परफ़ॉर्मेंस पैनल में नए इंटरैक्शन ट्रैक
• परफ़ॉर्मेंस की अहम जानकारी वाले पैनल में एलसीपी टाइमिंग का ब्रेकडाउन
• Recorder पैनल में रिकॉर्डिंग के लिए, डिफ़ॉल्ट नाम अपने-आप जनरेट होना
• अलग-अलग तरह की हाइलाइट

Chrome 105

• Recorder में सिलसिलेवार तरीके से फिर से चलाने की सुविधा
• Recorder पैनल में, इवेंट के ऊपर माउस ले जाने की सुविधा उपलब्ध है
• परफ़ॉर्मेंस की अहम जानकारी वाले पैनल में, सबसे बड़ा कॉन्टेंटफ़ुल पेंट (एलसीपी)
• लेआउट में बदलाव होने की मुख्य वजहों के तौर पर, टेक्स्ट के फ़्लैश (FOIT, FOUT) का पता लगाना
• मेनिफ़ेस्ट पैनल में प्रोटोकॉल हैंडलर
• एलिमेंट पैनल में सबसे ऊपर वाली लेयर का बैज
• रनटाइम के दौरान Wasm को डीबग करने की जानकारी अटैच करना
• डीबग के दौरान लाइव बदलाव करना
• स्टाइल पैनल में नियमों पर @scope को देखना और उसमें बदलाव करना
• सोर्स मैप में किए गए सुधार
• अलग-अलग तरह की हाइलाइट

Chrome 104

• डीबग करने के दौरान फ़्रेम को रीस्टार्ट करना
• रिकॉर्डर पैनल में, वीडियो को फिर से चलाने की धीमी सुविधा के विकल्प
• Recorder पैनल के लिए एक्सटेंशन बनाना
• लिखे गए / सोर्स पैनल में डिप्लॉय किए गए के हिसाब से फ़ाइलों को ग्रुप में रखें
• परफ़ॉर्मेंस की अहम जानकारी वाले पैनल में नए उपयोगकर्ता समय ट्रैक
• एलिमेंट के असाइन किए गए स्लॉट को दिखाना
• परफ़ॉर्मेंस रिकॉर्डिंग के लिए, हार्डवेयर एक साथ चलने की सुविधा को सिम्युलेट करना
• सीएसएस वैरिएबल के अपने-आप पूरा होने की सुविधा के दौरान, बिना रंग वाली वैल्यू की झलक देखना
• बैक/फ़ॉरवर्ड कैश मेमोरी पैनल में, ब्लॉक करने वाले फ़्रेम की पहचान करना
• JavaScript ऑब्जेक्ट के लिए, अपने-आप पूरा होने वाले बेहतर सुझाव
• सोर्स मैप में सुधार
• अलग-अलग तरह की हाइलाइट

Chrome 103

• Recorder पैनल में, दो बार क्लिक और राइट क्लिक इवेंट कैप्चर करना
• लाइटहाउस पैनल में नया टाइमस्पैन और स्नैपशॉट मोड
• परफ़ॉर्मेंस की अहम जानकारी वाले पैनल में ज़ूम कंट्रोल करने की बेहतर सुविधा
• परफ़ॉर्मेंस की रिकॉर्डिंग मिटाने के लिए पुष्टि करना
• एलिमेंट पैनल में पैनल का क्रम बदलना
• ब्राउज़र के बाहर से रंग चुनना
• डीबग करने के दौरान इनलाइन वैल्यू की बेहतर झलक देखी जा सकती है
• वर्चुअल तौर पर पुष्टि करने वाले ऐप्लिकेशन के लिए, बड़े ब्लॉब की सुविधा दें
• सोर्स पैनल में नए कीबोर्ड शॉर्टकट
• सोर्स मैप में सुधार

Chrome 102

• झलक दिखाने की सुविधा: परफ़ॉर्मेंस से जुड़ी अहम जानकारी वाला नया पैनल
• हल्के और गहरे रंग वाली थीम को एम्युलेट करने के लिए नए शॉर्टकट
• Network Preview टैब पर बेहतर सुरक्षा
• ब्रेकपॉइंट पर फिर से लोड करने की बेहतर सुविधा
• कंसोल से जुड़े अपडेट
• शुरुआत में यूज़र फ़्लो की रिकॉर्डिंग को रद्द करना
• स्टाइल पैनल में, इनहेरिट किए गए हाइलाइट छो़ड़ एलिमेंट को दिखाना
• अलग-अलग तरह की हाइलाइट
• [प्रयोग के तौर पर] सीएसएस में किए गए बदलावों को कॉपी करें
• [प्रयोग के तौर पर] ब्राउज़र के बाहर रंग चुनना

Chrome 101

• रिकॉर्ड किए गए यूज़र फ़्लो को JSON फ़ाइल के तौर पर इंपोर्ट और एक्सपोर्ट करना
• स्टाइल पैनल में कैस्केड लेयर देखना
• hwb() कलर फ़ंक्शन के लिए सहायता
• निजी प्रॉपर्टी को दिखाने की बेहतर सुविधा
• अलग-अलग तरह की हाइलाइट
• [प्रयोग के तौर पर] लाइटहाउस पैनल में नया टाइमस्पैन और स्नैपशॉट मोड

Chrome 100

• स्टाइल पैनल में नियमों पर @supports की जानकारी देखना और उसमें बदलाव करना
• सामान्य सिलेक्टर की सुविधा डिफ़ॉल्ट रूप से काम करें
• रिकॉर्डिंग के सिलेक्टर को पसंद के मुताबिक बनाना
• किसी रिकॉर्डिंग का नाम बदलना
• होवर करने पर क्लास/फ़ंक्शन प्रॉपर्टी की झलक देखना
• परफ़ॉर्मेंस पैनल में दिखाए गए कुछ फ़्रेम
• अलग-अलग तरह की हाइलाइट

Chrome 99

• WebSocket के अनुरोधों को कम करना
• ऐप्लिकेशन पैनल में नया Reporting API पैनल
• रिकॉर्डर पैनल में एलिमेंट के दिखने या क्लिक किए जाने तक इंतज़ार करने की सुविधा का इस्तेमाल करना
• कंसोल की बेहतर स्टाइलिंग, फ़ॉर्मैटिंग, और फ़िल्टर करने की सुविधा
• सोर्स मैप फ़ाइलों की मदद से, Chrome एक्सटेंशन को डीबग करना
• सोर्स पैनल में बेहतर सोर्स फ़ोल्डर ट्री
• सोर्स पैनल में, वर्कर की सोर्स फ़ाइलें दिखाना
• Chrome में गहरे रंग वाली थीम के बारे में Chrome में अपडेट
• टच में इस्तेमाल होने वाला कलर पिकर और स्प्लिट पैनल
• अलग-अलग तरह की हाइलाइट

Chrome 98

• झलक दिखाने वाली सुविधा: पूरे पेज पर दिखने वाला सुलभता ट्री
• 'बदलाव' टैब में ज़्यादा सटीक बदलाव
• यूज़र फ़्लो रिकॉर्डिंग के लिए, ज़्यादा समय तक टाइम आउट सेट करना
• बैक-फ़ॉरवर्ड कैश मेमोरी टैब की मदद से, पक्का करें कि आपके पेजों को कैश मेमोरी में सेव किया जा सकता हो
• नया प्रॉपर्टी पैनल फ़िल्टर
• सीएसएस फ़ोर्स-कलर मीडिया फ़ीचर को एम्युलेट करना
• होवर करने वाले निर्देश पर रूलर दिखाना
• Flexbox एडिटर में, row-reverse और column-reverse के साथ काम करें
• XHR को फिर से चलाने और खोज के सभी नतीजों को बड़ा करने के लिए, नए कीबोर्ड शॉर्टकट
• Lighthouse पैनल में Lighthouse 9
• बेहतर सोर्स पैनल
• अलग-अलग तरह की हाइलाइट
• [प्रयोग के तौर पर] Reporting API पैनल में एंडपॉइंट

Chrome 97

• झलक दिखाने की सुविधा: नया रिकॉर्डर पैनल
• डिवाइस मोड में डिवाइस की सूची रीफ़्रेश करना
• 'एचटीएमएल के रूप में बदलाव करें' की मदद से ऑटोकंप्लीट करना
• कोड डीबग करने का बेहतर अनुभव
• सभी डिवाइसों पर DevTools सेटिंग सिंक करना

Chrome 96

• झलक दिखाने की सुविधा: सीएसएस की खास जानकारी देने वाला नया पैनल
• सीएसएस की लंबाई में बदलाव करने और उसे कॉपी करने का अनुभव पहले जैसा किया गया और बेहतर किया गया
• सीएसएस befores-Conrast मीडिया की सुविधा को एम्युलेट करना
• Chrome में, ऑटो डार्क थीम की सुविधा को बेहतर बनाना
• स्टाइल पैनल में, एलानों को JavaScript के तौर पर कॉपी करना
• नेटवर्क पैनल में नया पेलोड टैब
• प्रॉपर्टी पैनल में प्रॉपर्टी दिखाने की सुविधा को बेहतर बनाया गया
• कंसोल में सीओआरएस से जुड़ी गड़बड़ियों को छिपाने का विकल्प
• कंसोल में, Intl ऑब्जेक्ट की सही झलक और जांच करना
• एक साथ काम नहीं करने वाले स्टैक ट्रेस
• कंसोल के साइडबार को बनाए रखना
• ऐप्लिकेशन पैनल में ऐप्लिकेशन कैश मेमोरी पैनल अब काम नहीं करता
• [प्रयोग के तौर पर] ऐप्लिकेशन पैनल में नया Reporting API पैनल

Chrome 95

• सीएसएस की लंबाई वाले नए टूल
• 'समस्याएं' टैब में समस्याएं छिपाना
• प्रॉपर्टी दिखाने की सुविधा को बेहतर बनाया गया
• Lighthouse पैनल में Lighthouse 8.4
• सोर्स पैनल में स्निपेट को क्रम से लगाना
• प्रॉडक्ट की जानकारी का अनुवाद करने के नए लिंक और अनुवाद से जुड़ी गड़बड़ी की शिकायत करना
• DevTools कमांड मेन्यू के लिए बेहतर यूज़र इंटरफ़ेस (यूआई)

Chrome 94

• अपनी पसंदीदा भाषा में DevTools का इस्तेमाल करना
• डिवाइसों की सूची में शामिल नए Nest Hub डिवाइस
• फ़्रेम की जानकारी वाले व्यू में, ऑरिजिन ट्रायल
• सीएसएस कंटेनर क्वेरी का नया बैज
• नेटवर्क फ़िल्टर को बदलने के लिए नया चेकबॉक्स
• Console के साइडबार को रोकने की सुविधा
• समस्याएं टैब और नेटवर्क पैनल में रॉ Set-Cookies हेडर दिखाएं
• कंसोल में, नेटिव ऐक्सेसर को अपनी प्रॉपर्टी के तौर पर लगातार दिखाना
• #sourceURL वाली इनलाइन स्क्रिप्ट के लिए, सही गड़बड़ी वाले स्टैक ट्रेस
• कंप्यूटेड पैनल में कलर फ़ॉर्मैट बदलना
• कस्टम टूलटिप को नेटिव एचटीएमएल टूलटिप से बदलें
• [प्रयोग के तौर पर] समस्याएं टैब में समस्याओं को छिपाना

Chrome 93

• स्टाइल पैनल में मौजूद सीएसएस कंटेनर क्वेरी में बदलाव किया जा सकता है
• नेटवर्क पैनल में वेब बंडल की झलक
• Attribution Reporting API को डीबग करना
• कंसोल में स्ट्रिंग को बेहतर तरीके से हैंडल करने के बारे में जानकारी
• सीओआरएस को बेहतर तरीके से डीबग करना
• लाइटहाउस 8.1
• मेनिफ़ेस्ट पैनल में नए नोट का यूआरएल
• सीएसएस मैच करने वाले सिलेक्टर को ठीक किया गया
• नेटवर्क पैनल में JSON के शानदार जवाब

Chrome 92

• सीएसएस ग्रिड एडिटर
• कंसोल में, const के लिए फिर से एलान करने से जुड़ी सहायता
• सोर्स ऑर्डर व्यूअर
• फ़्रेम की जानकारी देखने के लिए नया शॉर्टकट
• सीओआरएस को डीबग करने की बेहतर सहायता
• XHR लेबल का नाम बदलकर 'फ़ेच/XHR' करें
• नेटवर्क पैनल में Wasm के रिसॉर्स टाइप को फ़िल्टर करना
• नेटवर्क की शर्तें टैब में मौजूद डिवाइसों के लिए उपयोगकर्ता-एजेंट क्लाइंट हिंट
• समस्याएं टैब में जाकर, क्वर्क मोड (पुराने वर्शन पर काम करने की सुविधा) से जुड़ी समस्याओं की शिकायत करना
• परफ़ॉर्मेंस पैनल में कंप्यूट इंटरसेक्शन शामिल करना
• लाइटहाउस पैनल में Lighthouse 7.5
• कॉल स्टैक में मौजूद "फ़्रेम रीस्टार्ट करें" संदर्भ मेन्यू पर काम न करना
• [प्रयोग के तौर पर] प्रोटोकॉल मॉनिटर
• [प्रयोग के तौर पर] Puppeteer Recorder

Chrome 91

• वेबसाइट की परफ़ॉर्मेंस की जानकारी का पॉप-अप
• नया मेमोरी इंस्पेक्टर
• सीएसएस स्क्रोल-स्नैप को विज़ुअलाइज़ करना
• बैज की सेटिंग का नया पैनल
• आसपेक्ट रेशियो (लंबाई-चौड़ाई का अनुपात) की जानकारी के साथ इमेज की बेहतर झलक
• Content-Encoding को कॉन्फ़िगर करने के विकल्पों के साथ नई नेटवर्क शर्तों का बटन
• कैलकुलेट की गई वैल्यू देखने का शॉर्टकट
• accent-color कीवर्ड
• रंग और आइकॉन के हिसाब से, समस्याओं को अलग-अलग कैटगरी में बांटना
• Trust टोकन मिटाना
• फ़्रेम की जानकारी वाले व्यू में, ब्लॉक की गई सुविधाएं
• एक्सपेरिमेंट की सेटिंग में एक्सपेरिमेंट फ़िल्टर करना
• कैश मेमोरी पैनल में नया Vary Header कॉलम
• JavaScript की निजी ब्रैंड की जांच में मदद करना
• ब्रेकपॉइंट डीबग करने के लिए बेहतर सहायता
• [] नोटेशन के साथ, कर्सर घुमाने पर दिखने वाली झलक का इस्तेमाल करें
• एचटीएमएल फ़ाइलों की बेहतर आउटलाइन
• Wsm डीबग करने के लिए, गड़बड़ी वाले स्टैक ट्रेस की सही जानकारी

Chrome 90

• सीएसएस फ़्लेक्सबॉक्स को डीबग करने वाले नए टूल
• वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी देने वाला नया ओवरले
• समस्या की गिनती को कंसोल के स्टेटस बार में ले जाया गया
• भरोसेमंद वेब गतिविधि से जुड़ी समस्याओं की शिकायत करना
• कंसोल में स्ट्रिंग को (मान्य) JavaScript स्ट्रिंग लिटरल के तौर पर फ़ॉर्मैट करना
• ऐप्लिकेशन पैनल में नया ट्रस्ट टोकन पैनल
• सीएसएस कलर-गामट मीडिया सुविधा का इस्तेमाल करना
• प्रोग्रेसिव वेब ऐप्लिकेशन के लिए पहले से बेहतर टूलिंग
• नेटवर्क पैनल में नया Remote Address Space कॉलम
• परफ़ॉर्मेंस में सुधार
• फ़्रेम की जानकारी वाले व्यू में, अनुमति वाली/अस्वीकार की गई सुविधाएं दिखाना
• कुकी पैनल में नया SameParty कॉलम
• बिना स्टैंडर्ड वाली fn.displayName सहायता
• सेटिंग मेन्यू में Don't show Chrome Data Saver warning का इस्तेमाल बंद होना
• [प्रयोग के तौर पर] समस्याएं टैब में, कम कंट्रास्ट वाली समस्या की अपने-आप रिपोर्ट होने की सुविधा
• [प्रयोग के तौर पर] एलिमेंट पैनल में सुलभता के पूरे ट्री व्यू

Chrome 89

• भरोसेमंद तरह के उल्लंघनों के लिए सहायता को डीबग करना
• व्यूपोर्ट के अलावा, नोड का स्क्रीनशॉट लेना
• नेटवर्क अनुरोधों के लिए नया ट्रस्ट टोकन टैब
• Lighthouse पैनल में Lighthouse 7
• सीएसएस :target की स्थिति को ज़बरदस्ती लागू करने की सुविधा
• डुप्लीकेट एलिमेंट का नया शॉर्टकट
• कस्टम सीएसएस प्रॉपर्टी के लिए कलर पिकर
• सीएसएस प्रॉपर्टी कॉपी करने के लिए नए शॉर्टकट
• डिकोड की गई यूआरएल कुकी दिखाने का नया विकल्प
• सिर्फ़ दिखने वाली कुकी मिटाना
• स्टोरेज पैनल में तीसरे पक्ष की कुकी मिटाने का नया विकल्प
• पसंद के मुताबिक बनाए गए डिवाइसों के लिए, उपयोगकर्ता एजेंट क्लाइंट हिंट में बदलाव करना
• "नेटवर्क लॉग रिकॉर्ड करें" सेटिंग को बनाए रखें
• नेटवर्क पैनल में WebTransport कनेक्शन देखें
• "ऑनलाइन" का नाम बदलकर "कोई थ्रॉटलिंग नहीं" किया गया
• कंसोल, सोर्स पैनल, और स्टाइल पैनल में कॉपी करने के नए विकल्प
• फ़्रेम की जानकारी वाले व्यू में, नए सर्विस वर्कर की जानकारी
• फ़्रेम की जानकारी वाले व्यू में, मेमोरी की जानकारी मापना
• 'समस्याएं' टैब में जाकर सुझाव/राय देना या शिकायत करना
• परफ़ॉर्मेंस पैनल में छोड़े गए फ़्रेम
• डिवाइस मोड में फ़ोल्ड किए जा सकने वाले डिवाइस और ड्यूअल-स्क्रीन पर सबको बेहतर अनुभव देना
• [प्रयोग के तौर पर] Puppeteer Recorder से ब्राउज़र टेस्टिंग को ऑटोमेट करना
• [प्रयोग के तौर पर] स्टाइल पैनल में फ़ॉन्ट एडिटर
• [प्रयोग के तौर पर] सीएसएस फ़्लेक्सबॉक्स डीबग करने वाले टूल
• [प्रयोग के तौर पर] सीएसपी के उल्लंघन से जुड़ा नया टैब
• [प्रयोग के तौर पर] कलर कंट्रास्ट की नई कैलकुलेशन - ऐडवांस पर्सेप्चुअल कंट्रास्ट एल्गोरिदम (एपीसीए)

Chrome 88

• DevTools चालू करना
• सीएसएस के ऐंगल विज़ुअलाइज़ेशन के नए टूल
• काम न करने वाली इमेज टाइप को एम्युलेट करें
• स्टोरेज पैनल में स्टोरेज कोटा के साइज़ को सिम्युलेट करना
• परफ़ॉर्मेंस पैनल में, वेबसाइट की परफ़ॉर्मेंस की जानकारी देने वाली नई लेन
• नेटवर्क पैनल में सीओआरएस से जुड़ी गड़बड़ियों की शिकायत करना
• फ़्रेम के ब्यौरे वाले व्यू में क्रॉस-ऑरिजिन आइसोलेशन की जानकारी
• फ़्रेम की जानकारी वाले व्यू में, नए वेब वर्कर की जानकारी
• खुली विंडो के लिए, ओपनर फ़्रेम की जानकारी दिखाना
• सर्विस वर्कर पैनल से नेटवर्क पैनल खोलना
• प्रॉपर्टी की वैल्यू कॉपी करें
• नेटवर्क शुरू करने वाले के लिए स्टैकट्रेस को कॉपी करें
• माउसओवर पर Wasm वैरिएबल की वैल्यू की झलक देखना
• कंसोल में Wasm वैरिएबल का आकलन करना
• फ़ाइल/मेमोरी के साइज़ के लिए मेज़रमेंट की एक जैसी इकाइयां
• एलिमेंट पैनल में झूठे एलिमेंट हाइलाइट करना
• [प्रयोग के तौर पर] सीएसएस Flexbox को डीबग करने वाले टूल
• [प्रयोग के तौर पर] कॉर्ड कीबोर्ड शॉर्टकट को पसंद के मुताबिक बनाएं

Chrome 87

• सीएसएस ग्रिड को डीबग करने वाले नए टूल
• नया WebAuthn टैब
• टूल को सबसे ऊपर और सबसे नीचे मौजूद पैनल के बीच एक जगह से दूसरी जगह ले जाना
• स्टाइल पैनल में, कंप्यूटेड साइडबार वाला नया पैनल
• कंप्यूटेड पैनल में सीएसएस प्रॉपर्टी को ग्रुप में बांटना
• Lighthouse पैनल में Lighthouse 6.3
• समय सेक्शन में performance.mark() इवेंट
• नेटवर्क पैनल में नए resource-type और url फ़िल्टर
• फ़्रेम की जानकारी वाले व्यू से जुड़े अपडेट
• ज़्यादा टूल मेन्यू में Settings को बंद किया गया
• [प्रयोग के तौर पर] सीएसएस की खास जानकारी वाले पैनल में, कलर कंट्रास्ट से जुड़ी समस्याएं देखना और उन्हें ठीक करना
• [प्रयोग के तौर पर] DevTools में कीबोर्ड शॉर्टकट को पसंद के मुताबिक बनाना

Chrome 86

• नया मीडिया पैनल
• एलिमेंट पैनल के संदर्भ मेन्यू का इस्तेमाल करके नोड के स्क्रीनशॉट कैप्चर करना
• समस्याएं टैब के अपडेट
• जो लोकल फ़ॉन्ट मौजूद नहीं हैं उन्हें एम्युलेट करें
• इनऐक्टिव उपयोगकर्ताओं को एम्युलेट करना
• prefers-reduced-data को एम्युलेट करें
• JavaScript की नई सुविधाओं के लिए सहायता
• Lighthouse पैनल में Lighthouse 6.2
• सर्विस वर्कर पैनल में "अन्य ऑरिजिन" लिस्टिंग को बंद करना
• फ़िल्टर किए गए आइटम के लिए कवरेज की खास जानकारी दिखाना
• ऐप्लिकेशन पैनल में फ़्रेम की जानकारी वाला नया व्यू
• स्टाइल पैनल में रंगों का ऐक्सेस किया जा सकने वाला सुझाव
• एलिमेंट पैनल में प्रॉपर्टी पैनल को फिर से चालू करना
• नेटवर्क पैनल में X-Client-Data हेडर की ऐसी वैल्यू जिन्हें इंसान पढ़ सकते हैं
• स्टाइल पैनल में पसंद के मुताबिक फ़ॉन्ट अपने-आप पूरा होना
• नेटवर्क पैनल में संसाधन का टाइप लगातार दिखाना
• एलिमेंट और नेटवर्क पैनल में मौजूद बटन हटाना

Chrome 85

• CSS-in-JS फ़्रेमवर्क के लिए स्टाइल में बदलाव
• Lighthouse पैनल में Lighthouse 6
• फ़र्स्ट मीनिंगफ़ुल पेंट (एफ़एमपी) का इस्तेमाल बंद होना
• JavaScript की नई सुविधाओं के लिए सहायता
• मेनिफ़ेस्ट पैनल में ऐप्लिकेशन शॉर्टकट के लिए नई चेतावनियां
• समय टैब में सर्विस वर्कर respondWith के इवेंट
• कंप्यूटेड पैनल का लगातार डिसप्ले
• WebAssembly फ़ाइलों के लिए बाइट कोड ऑफ़सेट
• सोर्स पैनल में लाइन के हिसाब से कॉपी और कट करें
• कंसोल सेटिंग से जुड़े अपडेट
• परफ़ॉर्मेंस पैनल से जुड़े अपडेट
• ब्रेकपॉइंट, शर्त के साथ ब्रेकपॉइंट, और लॉगपॉइंट के लिए नए आइकॉन

Chrome 84

• 'समस्याओं' के नए टैब में, साइट की समस्याएं ठीक करना
• जांच मोड के टूलटिप में सुलभता की जानकारी देखना
• परफ़ॉर्मेंस पैनल से जुड़े अपडेट
• कंसोल में उपलब्ध, प्रॉमिस के लिए ज़्यादा सटीक शब्दावली
• स्टाइल पैनल से जुड़े अपडेट
• एलिमेंट पैनल में प्रॉपर्टी पैनल का बंद होना
• मेनिफ़ेस्ट पैनल में ऐप्लिकेशन शॉर्टकट की सुविधा

Chrome 83

• देखने की क्षमता में कमी को दूर करना
• भाषाओं को एम्युलेट करें
• क्रॉस-ऑरिजिन एम्बेडर नीति (सीओईपी) को डीबग करना
• ब्रेकपॉइंट, शर्त के साथ ब्रेकपॉइंट, और लॉगपॉइंट के लिए नए आइकॉन
• किसी खास कुकी को सेट करने वाले नेटवर्क के अनुरोध देखना
• कमांड मेन्यू से बाईं ओर डॉक करें
• मुख्य मेन्यू में मौजूद 'सेटिंग' विकल्प को अब अलग कर दिया गया है
• ऑडिट पैनल अब लाइटहाउस पैनल है
• फ़ोल्डर में मौजूद सभी स्थानीय बदलावों को मिटाना
• लंबे टास्क का यूज़र इंटरफ़ेस (यूआई) अपडेट किया गया
• मेनिफ़ेस्ट पैनल में, मास्केबल आइकॉन की सुविधा

Chrome 82

Chrome 82 रद्द कर दिया गया है.

Chrome 81

• डिवाइस मोड में Moto G4 की सहायता टीम
• कुकी से जुड़े अपडेट
• वेब ऐप्लिकेशन मेनिफ़ेस्ट के ज़्यादा सटीक आइकॉन
• एस्केप्ड वैल्यू देखने के लिए, सीएसएस content प्रॉपर्टी पर कर्सर घुमाएं
• कंसोल में सोर्स मैप से जुड़ी गड़बड़ियां
• फ़ाइल खत्म होने से पहले स्क्रोल करने की सुविधा बंद करने की सेटिंग

Chrome 80

• कंसोल में let और class को फिर से एलान करने से जुड़ी सहायता
• WebAssembly डीबग करने की बेहतर सुविधा
• शुरू करने वाले टैब में, इनिशिएटर चेन का अनुरोध करें
• खास जानकारी में, चुने गए नेटवर्क अनुरोध को हाइलाइट करना
• नेटवर्क पैनल में यूआरएल और पाथ कॉलम
• अपडेट की गई उपयोगकर्ता एजेंट स्ट्रिंग
• नया ऑडिट पैनल कॉन्फ़िगरेशन यूज़र इंटरफ़ेस (यूआई)
• हर फ़ंक्शन या हर ब्लॉक कोड कवरेज के मोड
• अब पेज को फिर से लोड करके कोड कवरेज शुरू करना ज़रूरी है

Chrome 79

• कुकी ब्लॉक होने की वजह डीबग करना
• कुकी की वैल्यू देखना
• पसंद के हिसाब से रंग की अलग-अलग स्कीम और प्राथमिकता से कम किए गए मोशन से जुड़ी प्राथमिकताओं को सिम्युलेट करें
• कोड कवरेज से जुड़े अपडेट
• नेटवर्क रिसॉर्स के अनुरोध की वजह डीबग करना
• कंसोल और सोर्स पैनल, इंडेंट की सेटिंग को फिर से लागू करते हैं
• कर्सर नेविगेशन के लिए नए शॉर्टकट

Chrome 78

• ऑडिट पैनल में एक से ज़्यादा क्लाइंट वाली सहायता
• पेमेंट हैंडलर को डीबग करना
• ऑडिट पैनल में Lighthouse 5.2
• परफ़ॉर्मेंस पैनल में सबसे बड़ा कॉन्टेंटफ़ुल पेंट
• मुख्य मेन्यू में मौजूद DevTools से जुड़ी समस्याएं हल करें

Chrome 77

• एलिमेंट स्टाइल कॉपी करना
• लेआउट शिफ़्ट को विज़ुअलाइज़ करना
• ऑडिट पैनल में Lighthouse 5.1
• ओएस की थीम सिंक करना
• ब्रेकपॉइंट एडिटर खोलने के लिए कीबोर्ड शॉर्टकट
• नेटवर्क पैनल में कैश मेमोरी को प्रीफ़ेच करें
• ऑब्जेक्ट देखते समय निजी प्रॉपर्टी
• ऐप्लिकेशन पैनल में सूचनाएं और पुश मैसेज

Chrome 76

• सीएसएस वैल्यू की मदद से ऑटोकंप्लीट करना
• नेटवर्क सेटिंग के लिए नया यूज़र इंटरफ़ेस (यूआई)
• HAR एक्सपोर्ट में WebSocket मैसेज
• HAR इंपोर्ट और एक्सपोर्ट करें बटन
• रीयल-टाइम में मेमोरी का इस्तेमाल
• सर्विस वर्कर के रजिस्ट्रेशन पोर्ट नंबर
• बैकग्राउंड फ़ेच और बैकग्राउंड सिंक इवेंट की जांच करना
• Firefox के लिए Puppeteer

Chrome 75

• सीएसएस फ़ंक्शन अपने-आप पूरे होने पर, काम के प्रीसेट
• कमांड मेन्यू से साइट डेटा मिटाना
• सभी IndexedDB डेटाबेस देखें
• होवर करने पर संसाधन का कंप्रेस नहीं किया गया साइज़ देखना
• ब्रेकपॉइंट पैनल में इनलाइन ब्रेकपॉइंट
• IndexedDB और कैश रिसॉर्स की संख्या
• जांच करने के बारे में ज़्यादा जानकारी देने वाले टूलटिप को बंद करने की सेटिंग
• एडिटर में टैब इंडेंट को टॉगल करने की सेटिंग

Chrome 74

• सीएसएस प्रॉपर्टी से जिन नोड पर असर पड़ा है उन्हें हाइलाइट करना
• ऑडिट पैनल में Lighthouse v4
• WebSocket बाइनरी मैसेज व्यूअर
• कमांड मेन्यू में एरिया का स्क्रीनशॉट कैप्चर करें
• नेटवर्क पैनल में सर्विस वर्कर फ़िल्टर
• परफ़ॉर्मेंस पैनल से जुड़े अपडेट
• परफ़ॉर्मेंस पैनल की रिकॉर्डिंग में लंबे टास्क
• समय सेक्शन में फ़र्स्ट पेंट
• बोनस सलाह: आरजीबी और एचएसएल कलर कोड देखने के लिए शॉर्टकट (वीडियो)

Chrome 73

• लॉगपॉइंट
• जांच मोड में, ज़्यादा जानकारी देने वाले टूलटिप
• कोड कवरेज का डेटा एक्सपोर्ट करना
• कीबोर्ड की मदद से कंसोल पर नेविगेट करना
• कलर पिकर में AAA के कंट्रास्ट अनुपात की लाइन
• पसंद के मुताबिक जियोलोकेशन के बदलाव सेव करें
• कोड फ़ोल्डिंग
• फ़्रेम टैब का नाम बदलकर मैसेज टैब किया गया
• बोनस के लिए सलाह: प्रॉपर्टी के हिसाब से नेटवर्क पैनल फ़िल्टर करना (वीडियो)

Chrome 72

• परफ़ॉर्मेंस पैनल में परफ़ॉर्मेंस मेट्रिक को विज़ुअलाइज़ करना
• डीओएम ट्री में टेक्स्ट नोड हाइलाइट करें
• डीओएम नोड में JS पाथ कॉपी करें
• ऑडिट पैनल अपडेट, जिसमें एक नया ऑडिट शामिल है जो कमांड मेन्यू से ऑडिट पैनल को ऐक्सेस करने के लिए JS लाइब्रेरी और नए कीवर्ड का पता लगाता है
• बोनस के लिए सलाह: मीडिया क्वेरी की जांच करने के लिए डिवाइस मोड का इस्तेमाल करें (वीडियो)

Chrome 71

• डीओएम नोड को हाइलाइट करने के लिए, लाइव एक्सप्रेशन के नतीजे पर कर्सर घुमाएं
• डीओएम नोड को ग्लोबल वैरिएबल के तौर पर स्टोर करना
• शुरू करने वाले और प्राथमिकता की जानकारी अब HAR इंपोर्ट और एक्सपोर्ट में
• मुख्य मेन्यू में जाकर निर्देश मेन्यू ऐक्सेस करना
• पिक्चर में पिक्चर ब्रेकपॉइंट
• बोनस के लिए सलाह: कंसोल में नोड के ट्रिगर हुए इवेंट को लॉग करने के लिए, monitorEvents() का इस्तेमाल करें (वीडियो)

Chrome 70

• कंसोल में लाइव एक्सप्रेशन
• ईगर इवैलुएशन के दौरान डीओएम नोड को हाइलाइट करना
• परफ़ॉर्मेंस पैनल को ऑप्टिमाइज़ करना
• ज़्यादा भरोसेमंद डीबग करना
• कमांड मेन्यू से, नेटवर्क थ्रॉटलिंग चालू करना
• शर्त के साथ ब्रेकपॉइंट अपने-आप पूरा होने की सुविधा
• AudioContext इवेंट के बारे में ब्रेक
• ndb की मदद से Node.js ऐप्लिकेशन को डीबग करना
• बोनस सलाह: User Timing API की मदद से असल दुनिया के उपयोगकर्ता इंटरैक्शन को मेज़र करें

Chrome 68

• एगर इवैलुएशन
• आर्ग्युमेंट से जुड़े संकेत
• फ़ंक्शन अपने-आप पूरा होना
• ES2017 के कीवर्ड
• ऑडिट पैनल में Lighthouse 3.0
• BigInt की सहायता
• वॉच पैनल में प्रॉपर्टी पाथ जोड़ना
• "टाइमस्टैंप दिखाएं" को 'सेटिंग' में ले जाया गया
• बोनस के लिए सलाह: कंसोल के ऐसे तरीके जिन्हें कम लोग जानते हैं (वीडियो)

Chrome 67

• सभी नेटवर्क हेडर में खोजना
• सीएसएस के वैरिएबल की वैल्यू की झलक
• फ़ेच के तौर पर कॉपी करें
• नए ऑडिट, डेस्कटॉप कॉन्फ़िगरेशन के विकल्प, और व्यू ट्रेस
• इनफ़ाइनाइट लूप को रोकना
• परफ़ॉर्मेंस टैब में उपयोगकर्ता समय की जानकारी
• JavaScript वीएम इंस्टेंस की जानकारी, मेमोरी पैनल में साफ़ तौर पर दिखती है
• नेटवर्क टैब का नाम बदलकर पेज टैब किया गया
• गहरे रंग वाली थीम के अपडेट
• सुरक्षा पैनल में सर्टिफ़िकेट की पारदर्शिता से जुड़ी जानकारी
• परफ़ॉर्मेंस पैनल में साइट आइसोलेशन की सुविधाएं
• बोनस के लिए सलाह: लेयर पैनल + ऐनिमेशन इंस्पेक्टर (वीडियो)

Chrome 66

• नेटवर्क पैनल में ब्लैकबॉक्सिंग
• डिवाइस मोड में ज़ूम करने की सुविधा में अपने-आप बदलाव होना
• झलक और जवाब टैब में सुंदर-प्रिंटिंग
• झलक टैब में एचटीएमएल कॉन्टेंट की झलक देखना
• एचटीएमएल के अंदर मौजूद स्टाइल के लिए, लोकल ओवरराइड की सुविधा
• बोनस के लिए सलाह: इवेंट लिसनर ब्रेकपॉइंट को ज़्यादा काम का बनाने के लिए, Blackbox फ़्रेमवर्क स्क्रिप्ट का इस्तेमाल करना

Chrome 65

• स्थानीय बदलाव
• नए सुलभता टूल
• बदलाव टैब
• एसईओ और परफ़ॉर्मेंस के नए ऑडिट
• परफ़ॉर्मेंस पैनल में एक से ज़्यादा रिकॉर्डिंग
• एक साथ काम नहीं करने वाले कोड में कर्मचारियों के साथ काम करने वाला भरोसेमंद कोड
• बोनस के लिए सलाह: Puppeteer की मदद से DevTools से जुड़ी अपने-आप होने वाली कार्रवाइयां (वीडियो)

Chrome 64

• परफ़ॉर्मेंस मॉनिटर
• कंसोल साइडबार
• Console के मिलते-जुलते मैसेज का ग्रुप बनाना
• बोनस के लिए सलाह: गलत क्लास को टॉगल करें (वीडियो)

Chrome 63

• एक से ज़्यादा क्लाइंट वाले रिमोट को डीबग करने की सुविधा
• फ़ाइल फ़ोल्डर 2.0
• चार नए ऑडिट
• कस्टम डेटा की मदद से पुश नोटिफ़िकेशन सिम्युलेट करना
• कस्टम टैग की मदद से, बैकग्राउंड सिंक इवेंट ट्रिगर करना
• बोनस के लिए सलाह: इवेंट लिसनर के लिए ब्रेकपॉइंट (वीडियो)

Chrome 62

• कंसोल में टॉप-लेवल के लोगों का इंतज़ार करना
• स्क्रीनशॉट का नया वर्कफ़्लो
• सीएसएस ग्रिड को हाइलाइट करने की सुविधा
• ऑब्जेक्ट की क्वेरी के लिए एक नया Console एपीआई
• नए कंसोल फ़िल्टर
• नेटवर्क पैनल में HAR इंपोर्ट
• झलक में दिखने वाली कैश मेमोरी के संसाधन
• कैश मेमोरी को डीबग करने के अनुमान के बारे में ज़्यादा जानकारी
• ब्लॉक-लेवल के कोड का कवरेज

Chrome 61

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

Chrome 60

• नया ऑडिट पैनल
• तीसरे पक्ष के बैज
• 'यहां पर जारी रखें' के लिए नया जेस्चर
• एक साथ काम नहीं करने वाली प्रोसेस में जाएं
• कंसोल में ज़्यादा जानकारी देने वाले ऑब्जेक्ट की झलक
• कंसोल में ज़्यादा जानकारी देने वाला कॉन्टेक्स्ट चुनना
• कवरेज टैब में रीयल-टाइम अपडेट
• नेटवर्क को कंट्रोल करने के आसान विकल्प
• एक साथ काम नहीं करने वाली स्टैक, डिफ़ॉल्ट रूप से चालू रहती हैं

Chrome 59

• सीएसएस और जेएस कोड कवरेज
• पूरे पेज के स्क्रीनशॉट
• अनुरोधों को ब्लॉक करना
• एक साथ सिंक करने के इंतज़ार में हैं
• यूनिफ़ाइड कमांड मेन्यू