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

पब्लिश होने की तारीख: 7 अप्रैल, 2026

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

एआई की मदद से काम करने के दौरान, कॉन्टेक्स्ट अपने-आप चुने जाने की सुविधा

एआई असिस्टेंट के अपडेट किए गए पैनल की शुरुआती स्क्रीन.

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

  • "इस पेज पर सबसे धीमे नेटवर्क अनुरोध कौनसे हैं?" पहले, ऐसा नहीं किया जा सकता था, क्योंकि आपको किसी नेटवर्क के अनुरोध को चुनना होता था.
  • "पेज पर परफ़ॉर्मेंस से जुड़ी कौनसी समस्याएं मौजूद हैं?" DevTools अब आपकी चुनी गई सेटिंग के साथ ट्रेस को अपने-आप रिकॉर्ड करेगा, ताकि इस सवाल का जवाब दिया जा सके.
  • "मैं ऐनिमेशन पैनल का इस्तेमाल कैसे करूं?" या "DevTools में ज़्यादा कंट्रास्ट वाली सेटिंग कहां है?" जैसे सवालों के जवाब देकर, DevTools के इस्तेमाल में सीधे तौर पर मदद करता है.

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

एजेंट के लिए DevTools

Chrome DevTools MCP सर्वर और सीएलआई को 0.21.0 वर्शन में अपडेट कर दिया गया है. इससे मल्टी-एजेंट वर्कफ़्लो, Lighthouse के ज़रिए ऑडिट करने की नई सुविधाओं, और बेहतर स्किल सेट में काफ़ी सुधार हुआ है.

पिछले अपडेट के बाद से जोड़ी गई मुख्य सुविधाएं:

  • Lighthouse ऑडिट को इंटिग्रेट किया गया: अब सीधे तौर पर एमसीपी के ज़रिए Lighthouse ऑडिट किए जा सकते हैं. इससे, एजेंट के वर्कफ़्लो में परफ़ॉर्मेंस और क्वालिटी की जांच अपने-आप हो जाती है.
  • मेमोरी लीक का पता लगाने की सुविधा: take_memory_snapshot टूल का इस्तेमाल करके, मेमोरी लीक का पता लगाने के लिए एक नई सुविधा जोड़ी गई है.
  • सुलभता से जुड़ी स्किल में सुधार: सुलभता से जुड़ी डीबग करने की स्किल को बेहतर बनाया गया है, ताकि Lighthouse का बेहतर तरीके से इस्तेमाल किया जा सके और ज़्यादा सटीक आउटपुट मिल सके.
  • इस्तेमाल करने से जुड़ी सामान्य जानकारी: Chrome DevTools MCP सर्वर या सीएलआई को इस्तेमाल करने के तरीके के बारे में खास जानकारी. साथ ही, इंस्टॉलेशन से जुड़ी समस्याओं को हल करने के तरीके के बारे में जानकारी. इससे आपका एजेंट, एजेंट के लिए उपलब्ध DevTools का ज़्यादा से ज़्यादा फ़ायदा उठा पाएगा.
  • एक से ज़्यादा एजेंट वाले वर्कफ़्लो के लिए सहायता: pageId राउटिंग की सुविधा उपलब्ध होने से, एक से ज़्यादा एजेंट एक साथ किसी खास ब्राउज़र पेज को टारगेट कर सकते हैं और उससे इंटरैक्ट कर सकते हैं.

इन सुविधाओं का इस्तेमाल शुरू करने के लिए, GitHub रिपॉज़िटरी देखें. इसमें रिलीज़ से जुड़ी पूरी जानकारी दी गई है.

कोड जनरेट करना

Chrome 142 में, हमने कंसोल और सोर्स पैनल में Gemini की मदद से कोड के सुझाव पाने की सुविधा लॉन्च की थी. Chrome 147 में, इस सुविधा को अपग्रेड करके कोड जनरेट करने की पूरी सुविधा दी गई है.

कोड जनरेट करने के लिए, सामान्य भाषा में एक टिप्पणी लिखें. इसमें उस लॉजिक के बारे में बताएं जिसकी आपको ज़रूरत है (उदाहरण के लिए, // Loop to check all img elements for valid alt attributes). इसके बाद, जनरेट करना शुरू करने के लिए, Cmd+I (Mac) या Ctrl+I (Windows/Linux) दबाएं.

डिवाइस मोड का अपडेट किया गया टूलबार

डिवाइस मोड टूलबार को आधुनिक बनाया गया है, ताकि आपको बेहतर और एक जैसा अनुभव मिल सके:

  • स्टैंडर्ड कंट्रोल: डिवाइस चुनने, ज़ूम लेवल, और डिवाइस पिक्सल रेशियो (डीपीआर) के लिए अब DevTools के स्टैंडर्ड यूज़र इंटरफ़ेस (यूआई) कॉम्पोनेंट का इस्तेमाल किया जाता है. इससे इस्तेमाल करने में आसानी होती है.
  • ज़ूम करने की सुविधा को बेहतर बनाया गया है: ज़ूम मेन्यू को अब और बेहतर बनाया गया है. साथ ही, "विंडो के हिसाब से फ़िट करें" विकल्प को सीधे तौर पर प्रतिशत की सूची में इंटिग्रेट कर दिया गया है. "ज़ूम लेवल का अपने-आप ठीक होना" सुविधा को, टूलबार के अलग बटन में ले जाया गया है.
  • ओरिएंटेशन लॉक करने की सुविधा: DevTools अब डिवाइस इम्यूलेशन में screen.orientation.lock() API को हैंडल करता है. जब कोई पेज ओरिएंटेशन को लॉक करता है, तो लॉक किए गए ओरिएंटेशन से मेल खाने के लिए, डिवाइस अपने-आप घूम जाता है. साथ ही, लॉक चालू होने पर, मैन्युअल तरीके से घुमाने वाला बटन बंद हो जाता है.

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

डिकोड किए गए कंप्रेस किए गए मुख्य हिस्से

कंप्रेस किए गए संसाधनों से जुड़ी समस्याओं का पता लगाना अब बहुत आसान हो गया है. इससे पहले, अगर किसी एचटीटीपी अनुरोध में Content-Encoding: gzip या deflate का इस्तेमाल किया जाता था, तो नेटवर्क पैनल में पेलोड व्यू में डिकोड किए गए कॉन्टेंट के बजाय, गड़बड़ किया गया बाइनरी डेटा दिखता था.

Chrome 147 में, DevTools इन कंप्रेस किए गए डेटा को अपने-आप डिकोड करता है. साथ ही, पढ़े जा सकने वाले कॉन्टेंट को सीधे Payload में दिखाता है.

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

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

स्टाइल के लिए रेगुलर एक्सप्रेशन फ़िल्टर

स्टाइल पैनल में नया रेगुलर एक्सप्रेशन फ़िल्टर.

अब स्टाइल, कैलकुलेट किया गया, और प्रॉपर्टी पैनल के फ़िल्टर बार में रेगुलर एक्सप्रेशन का इस्तेमाल किया जा सकता है. रेगुलर एक्सप्रेशन की सुविधा चालू करने के लिए, नए रेगुलर एक्सप्रेशन टॉगल बटन (.*) पर क्लिक करें. इसके बाद, उदाहरण के लिए padding|border टाइप करके, सभी padding और border प्रॉपर्टी हाइलाइट करें.

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

अनुमान के हिसाब से यूआरएल लोड होने की सुविधा से जुड़े बेहतर तरीके

ऐप्लिकेशन > अनुमान के आधार पर लोड होने वाले पेज पैनल में मौजूद नई सुविधाओं की मदद से, प्रीलोडिंग को ज़्यादा आसानी से डीबग किया जा सकता है:

  • टेक्स्ट फ़िल्टर करना: अब नियमों और कोशिशों की सूची को फ़िल्टर करने के लिए, फ़्री टेक्स्ट या कीवर्ड वाले फ़िल्टर (जैसे, url:, action:, status:) का इस्तेमाल किया जा सकता है. साथ ही, एक से ज़्यादा शब्दों के बीच AND लॉजिक का इस्तेमाल किया जा सकता है.
  • 'मिटाएं' बटन: 'मिटाएं' बटन की मदद से, प्रीलोडिंग मॉडल को रीसेट किया जा सकता है. साथ ही, दिखाए गए नियमों और कोशिशों को मिटाया जा सकता है.
  • एचटीटीपी स्टेटस कोड: प्रीफ़ेच करने की प्रोसेस पूरी न होने पर, DevTools अब स्टेटस कॉलम और जानकारी वाले पैनल, दोनों में सामान्य गड़बड़ी के मैसेज के बजाय, असली एचटीटीपी स्टेटस कोड (जैसे, 404) दिखाता है.

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

अन्य सूचनाएं

इस रिलीज़ में, कुछ अहम गड़बड़ियों को ठीक किया गया है और कुछ नई सुविधाएं जोड़ी गई हैं:

  • कंसोल: जब किसी गड़बड़ी के सभी इनलाइन स्टैक फ़्रेम को अनदेखा की जाने वाली सूची में शामिल किया जाता है, लेकिन कॉल स्टैक में अनदेखा न किए गए फ़्रेम शामिल होते हैं, तो अब एक टॉगल दिखता है. इससे आपको कार्रवाई किए जा सकने वाले कोड पर फ़ोकस करने में मदद मिलती है. साथ ही, लाइब्रेरी के ज़्यादा जानकारी वाले ट्रेस छिपाने में मदद मिलती है (379788109).
  • परफ़ॉर्मेंस: साइडबार की स्थिति (खुला/बंद) अब सेव हो जाती है. अगर आपने साइडबार बंद कर दिया है, तो यह बाद की सभी रिकॉर्डिंग में बंद रहेगा (437340219).
  • सेटिंग: DevTools अब कुछ एक्सपेरिमेंटल सेटिंग टॉगल करते समय, आपको ब्राउज़र को फिर से चालू करने के लिए सूचना दे सकता है. यह सूचना, इंफ़ोबार के ज़रिए दी जाती है.
  • ऑब्जेक्ट की जांच करना: ऑब्जेक्ट व्यू में, कॉन्टेक्स्ट मेन्यू में "सभी दिखाएं" विकल्प जोड़ा गया है. इसकी मदद से, शून्य (null या undefined) प्रॉपर्टी की दृश्यता को टॉगल किया जा सकता है (41187256).
  • तत्व: "विज्ञापन" अडॉर्नर अब सिर्फ़ iframe तक सीमित नहीं है. इसे अब ऐसे किसी भी एलिमेंट के लिए दिखाया जा सकता है जिसे बैकएंड (485493202) ने विज्ञापन से जुड़ा टैग किया है.
  • निर्देश नोड: प्रोसेसिंग निर्देश नोड (जैसे कि <?xml-stylesheet ... ?>) अब DOM ट्री में दिखते हैं और उनमें बदलाव किया जा सकता है (484891675)

सुलभता

इस रिलीज़ में, सुलभता से जुड़ी कई सुविधाएं जोड़ी गई हैं:

  • परफ़ॉर्मेंस: परफ़ॉर्मेंस मेट्रिक कार्ड में मौजूद, टाइटल की मदद पाने वाला बटन अब हमेशा दिखता है. साथ ही, इसे कीबोर्ड से ऐक्सेस किया जा सकता है. पहले यह बटन सिर्फ़ कर्सर घुमाने पर दिखता था (487613506).
  • सोर्स: इवेंट लिसनर के ब्रेकपॉइंट को अब Space कुंजी का इस्तेमाल करके चुना या हटाया जा सकता है (478890182).
  • सेटिंग: Home और End बटन अब शॉर्टकट की सूची के पहले और आखिरी आइटम पर जाने के लिए काम करते हैं (481747256).
  • Lighthouse: कैटगरी ग्रुप के लिए स्क्रीन रीडर की सूचनाओं को बेहतर बनाया गया है. साथ ही, चेकबॉक्स (477643909) को भी बेहतर बनाया गया है.