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

रिकॉर्डर में सिलसिलेवार तरीके से फिर से चलाने की सुविधा

अब आपके पास ब्रेकपॉइंट सेट करने और Recorder पैनल में, यूज़र फ़्लो को सिलसिलेवार तरीके से फिर से चलाने का विकल्प है.

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

इस सुविधा की मदद से, अपने यूज़र फ़्लो को आसानी से पूरी तरह से विज़ुअलाइज़ और डीबग किया जा सकता है.

ज़्यादा जानकारी के लिए Recorder की सुविधाओं का रेफ़रंस देखें.

Chromium की समस्या: 1257499

रिकॉर्डर पैनल में, इवेंट के ऊपर माउस ले जाने की सुविधा उपलब्ध है

अब Recorder की मदद से, किसी रिकॉर्डिंग में माउस ओवर (होवर) स्टेप को मैन्युअल तरीके से जोड़ा जा सकता है.

इस डेमो में, कर्सर घुमाने पर पॉप-अप मेन्यू दिखता है. यूज़र फ़्लो रिकॉर्ड करने की कोशिश करें और किसी मेन्यू आइटम पर क्लिक करें.

अगर यूज़र फ़्लो को अभी फिर से चलाया जाता है, तो यह प्रोसेस नहीं होगा. इसकी वजह यह है कि रिकॉर्डिंग के दौरान Recorder, इवेंट पर अपने-आप माउस कैप्चर नहीं करता. इसे ठीक करने के लिए, मेन्यू आइटम पर क्लिक करने से पहले सिलेक्टर पर कर्सर घुमाने के लिए, मैन्युअल तरीके से कोई चरण जोड़ें.

Chromium की समस्या: 1257499

परफ़ॉर्मेंस की अहम जानकारी वाले पैनल में, सबसे बड़े एलिमेंट को रेंडर करने में लगने वाला समय (एलसीपी)

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

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

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

Chromium की समस्या: 1326481

टेक्स्ट के फ़्लैश (FOIT, FOUT) में होने वाले लेआउट में बदलाव की संभावित वजहों के तौर पर पहचान करना

परफ़ॉर्मेंस की अहम जानकारी पैनल, अब लेआउट शिफ़्ट की मुख्य वजहों के तौर पर, न दिखने वाले टेक्स्ट (एफ़ओआईटी) के फ़्लैश और बिना स्टाइल वाले टेक्स्ट के फ़्लैश (FOUT) का पता लगाता है.

लेआउट शिफ़्ट की संभावित मुख्य वजहों को देखने के लिए, लेआउट शिफ़्ट ट्रैक में स्क्रीनशॉट पर क्लिक करें.

लेआउट शिफ़्ट को रोकने की तकनीक जानने के लिए, WebFont की लोडिंग और रेंडरिंग को ऑप्टिमाइज़ करें देखें.

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

मेनिफ़ेस्ट पैनल में प्रोटोकॉल हैंडलर

अब प्रोग्रेसिव वेब ऐप्लिकेशन (PWA) के लिए, यूआरएल प्रोटोकॉल हैंडलर के रजिस्ट्रेशन की जांच करने के लिए, DevTools का इस्तेमाल किया जा सकता है.

यूआरएल प्रोटोकॉल हैंडलर रजिस्ट्रेशन की मदद से, इंस्टॉल किए गए PWA उन लिंक को हैंडल कर सकते हैं जो ज़्यादा इंटिग्रेटेड अनुभव के लिए, किसी खास प्रोटोकॉल (जैसे, magnet, web+example) का इस्तेमाल करते हैं.

ऐप्लिकेशन > मेनिफ़ेस्ट पैनल के ज़रिए प्रोटोकॉल हैंडलर सेक्शन पर जाएं. यहां सभी उपलब्ध प्रोटोकॉल देखे जा सकते हैं और उनकी जांच की जा सकती है.

उदाहरण के लिए, इस डेमो PWA को इंस्टॉल करें. PWA में कॉफ़ी पेज खोलने के लिए, प्रोटोकॉल हैंडलर सेक्शन में “Americano” टाइप करें और प्रोटोकॉल की जांच करें पर क्लिक करें.

Chromium से जुड़ी समस्याएं: 1300613

एलिमेंट पैनल में टॉप लेयर बैज

टॉप लेयर बैज का इस्तेमाल करके, टॉप लेयर के कॉन्सेप्ट को समझें और देखें कि टॉप लेयर के कॉन्टेंट में क्या बदलाव होता है.

हाल ही में, <dialog> एलिमेंट सभी ब्राउज़र पर एक जैसा हो गया है. जब कोई डायलॉग खोला जाता है, तो वह टॉप लेयर में चला जाता है. टॉप लेवल का कॉन्टेंट, बाकी सभी कॉन्टेंट के ऊपर रेंडर होता है.

इस डेमो में, डायलॉग खोलें पर क्लिक करें.

टॉप लेयर के एलिमेंट को विज़ुअलाइज़ करने के लिए, DevTools डीओएम ट्री में टॉप लेयर कंटेनर (#top-layer) जोड़ता है. यह क्लोज़िंग </html> टैग के बाद रहता है.

सबसे ऊपर की लेयर के कंटेनर एलिमेंट से टॉप लेयर ट्री एलिमेंट पर जाने के लिए, एलिमेंट या उसके ऊपर मौजूद लेयर के कंटेनर में उसके बैकड्रॉप के आगे मौजूद दिखाएं बटन पर क्लिक करें.

टॉप लेयर ट्री एलिमेंट (जैसे, डायलॉग एलिमेंट) के बगल में मौजूद, टॉप लेयर कंटेनर पर जाने के लिए, टॉप-लेयर बैज पर क्लिक करें.

Chromium की समस्या: 1313690

रनटाइम के दौरान, Wasm को डीबग करने की जानकारी अटैच करें

अब रनटाइम के दौरान, Wasm के लिए DWARF डीबग की जानकारी अटैच की जा सकती है. पहले, सोर्स पैनल सिर्फ़ JavaScript और Wasm फ़ाइलों में सोर्स मैप अटैच करने की सुविधा देता था.

सोर्स पैनल में कोई Wasm फ़ाइल खोलें. मांग पर डीबग करने की जानकारी अटैच करने के लिए, एडिटर में राइट क्लिक करें और DWARF डीबग की जानकारी जोड़ें... चुनें.

Chromium की समस्या: 1341255

डीबग करने के दौरान लाइव बदलाव करने में मदद पाना

अब डीबगर को रीस्टार्ट किए बिना, स्टैक पर सबसे ऊपर मौजूद फ़ंक्शन में बदलाव किया जा सकता है.

Chrome 104 में, DevTools फ़्रेम को रीस्टार्ट करें सुविधा को फिर से उपलब्ध कराता है. हालांकि, आप उस फ़ंक्शन को संपादित नहीं कर सके, जिसमें आपको वर्तमान में रोका गया है. डेवलपर आम तौर पर किसी फ़ंक्शन को ब्रेक करते हैं और फिर रोकने के बाद उस फ़ंक्शन में बदलाव करते हैं.

इस अपडेट के बाद, डीबगर नीचे दी गई पाबंदियों के साथ अपने-आप फ़ंक्शन को रीस्टार्ट करता है:

• रोके जाने पर, सिर्फ़ सबसे ऊपर वाले फ़ंक्शन में बदलाव किया जा सकता है
• एक ही फ़ंक्शन पर स्टैक में और नीचे कोई रिकर्सिव कॉल नहीं है

Chromium की समस्या: 1334484

स्टाइल पैनल में, नियमों में @scope को देखें और उसमें बदलाव करें

अब स्टाइल पैनल में, सीएसएस @scope के नियमों को देखा जा सकता है और उनमें बदलाव किया जा सकता है.

नियमों का @scope, सीएसएस कैस्केडिंग और इनहेरिटेंस लेवल 6 की खास बातों का हिस्सा है. इन नियमों की मदद से, डेवलपर सीएसएस में स्टाइल के नियमों का दायरा बढ़ा सकते हैं.

इस डेमो पेज को खोलें और <div class=”dark-theme”> एलिमेंट में हाइपरलिंक की जांच करें. स्टाइल पैनल में, @scope at-नियमों को देखें. नियम के एलान पर क्लिक करके उसमें बदलाव करें.

Chromium की समस्या: 1337777

सोर्स मैप में किए गए सुधार

डीबगिंग के अनुभव को बेहतर बनाने के लिए, यहां सोर्स मैप को ठीक करने के कुछ तरीके बताए गए हैं:

• DevTools अब विराम चिह्न के साथ सोर्स मैप आइडेंटिफ़ायर का सही तरीके से समाधान करता है. कुछ आधुनिक मिनीफ़ायर (उदाहरण के लिए, esbuild) ऐसे सोर्स मैप बनाते हैं जो आइडेंटिफ़ायर को बाद में विराम चिह्न (कॉमा, ब्रैकेट, सेमीकोलन) के साथ मर्ज करते हैं.
• DevTools अब super कॉल की मदद से, कंस्ट्रक्टर के लिए सोर्स मैप के नामों को रिज़ॉल्व करता है.
• डुप्लीकेट कैननिकल यूआरएल के लिए, सोर्स मैप यूआरएल को इंडेक्स करने की प्रोसेस को ठीक किया गया. पहले, डुप्लीकेट कैननिकल यूआरएल की वजह से कुछ फ़ाइलों में ब्रेकपॉइंट चालू नहीं किए जाते थे.

Chromium की समस्या: 1335338, 1333411

अन्य हाइलाइट

इस रिलीज़ में ये कुछ अहम सुधार हैं:

• जब डिवाइस को मिटाया जाए, तब ऐप्लिकेशन > लोकल स्टोरेज पैनल में मौजूद टेबल में से, लोकल स्टोरेज की-वैल्यू पेयर को सही तरीके से हटाएं. (1339280)
• सोर्स पैनल में सीएसएस फ़ाइलें देखते समय, रंग की झलक अब सही तरीके से दिखती हैं. पहले, उनकी पोज़िशन गलत थी. (1340062)
• लेआउट पैनल में सीएसएस फ़्लेक्स और ग्रिड आइटम को लगातार दिखाएं. साथ ही, उन्हें एलिमेंट पैनल में बैज के रूप में दिखाएं. इससे पहले, फ़्लेक्सिबल और ग्रिड वाले आइटम दोनों जगहों पर बिना किसी क्रम के उपलब्ध नहीं थे. (1340441, 1273992)
• अगर DevTools ऐसी स्क्रिप्ट मिली है जिसकी वजह से फ़्रेम को विज्ञापन के तौर पर लेबल किया गया था, तो विज्ञापन फ़्रेम के लिए एक नया क्रिएटर विज्ञापन स्क्रिप्ट लिंक उपलब्ध है. ऐप्लिकेशन > फ़्रेम की मदद से किसी फ़्रेम को खोला जा सकता है. (1217041)

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

अपने डिफ़ॉल्ट डेवलपमेंट ब्राउज़र के तौर पर, 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

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