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

Trusted Type के उल्लंघनों को डीबग करने में मदद

Trusted Type के उल्लंघनों पर ब्रेकपॉइंट

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

Trusted Types API की मदद से, डीओएम पर आधारित क्रॉस-साइट स्क्रिप्टिंग से जुड़ी जोखिम से बचा जा सकता है. Trusted Types की मदद से, डीओएम एक्सएसएस (क्लाइंट-साइड स्क्रिप्ट इंजेक्शन) की कमज़ोरियों से मुक्त ऐप्लिकेशन लिखने, उनकी समीक्षा करने, और उन्हें मैनेज करने का तरीका यहां जानें.

सोर्स पैनल में, डीबगर साइडबार पैनल खोलें. सीएसपी उल्लंघन के ब्रेकपॉइंट सेक्शन को बड़ा करें. इसके बाद, अपवादों पर रोक लगाने के लिए, भरोसेमंद टाइप के उल्लंघन चेकबॉक्स को चालू करें. इस डेमो पेज पर जाकर, इसे खुद आज़माएं.

Trusted Type के उल्लंघनों पर ब्रेकपॉइंट

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

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

सोर्स पैनल में मौजूद समस्या को समस्याओं वाले टैब से लिंक करना

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

व्यूपोर्ट से बाहर के नोड का स्क्रीनशॉट लेना

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

एलिमेंट पैनल में, किसी एलिमेंट पर दायां क्लिक करें और नोड का स्क्रीनशॉट कैप्चर करें चुनें.

व्यूपोर्ट से बाहर के नोड का स्क्रीनशॉट लेना

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

नेटवर्क अनुरोधों के लिए नया ट्रस्ट टोकन टैब

ट्रस्ट टोकन टैब में जाकर, ट्रस्ट टोकन नेटवर्क के अनुरोधों की जांच करें.

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

डीबग करने से जुड़ी ज़्यादा मदद, अगली रिलीज़ में मिलेगी.

नेटवर्क अनुरोधों के लिए नया ट्रस्ट टोकन टैब

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

लाइटहाउस पैनल में Lighthouse 7

Lighthouse पैनल अब Lighthouse 7 पर काम कर रहा है. बदलावों की पूरी सूची के लिए, रिलीज़ नोट देखें.

लाइटहाउस पैनल में Lighthouse 7

Lighthouse 7 में नए ऑडिट:

  • सबसे बड़े कॉन्टेंटफ़ुल पेंट (एलसीपी) वाली इमेज को पहले से लोड करें. यह ऑडिट करता है कि एलसीपी एलिमेंट में मौजूद इमेज को पहले से लोड किया गया है या नहीं, ताकि एलसीपी लोड होने में लगने वाला समय कम किया जा सके.
  • Issues पैनल में मौजूद समस्याएं. Issues पैनल में, हल नहीं की गई समस्याओं की सूची दिखाता है.
  • प्रोग्रेसिव वेब ऐप्लिकेशन (PWA). PWA कैटगरी में काफ़ी बदलाव हुए हैं.
  • इंस्टॉल किया जा सकने वाला ग्रुप, अब पूरी तरह से उन सुविधाओं की जांच पर आधारित है जो Chrome के इंस्टॉल करने से जुड़ी शर्तों को पूरा करती हैं. ये वही सिग्नल हैं जो मेनिफ़ेस्ट पैनल में दिखते हैं.

    • "सेवा वर्कर रजिस्टर करता है…" ऑडिट, PWA ऑप्टिमाइज़ किया गया ग्रुप में चला जाता है. साथ ही, "एचटीटीपीएस का इस्तेमाल करता है" ऑडिट को अब "इंस्टॉल करने से जुड़ी ज़रूरी शर्तों" ऑडिट के हिस्से के तौर पर शामिल किया गया है.
    • तेज़ और भरोसेमंद ग्रुप हटा दिया गया है. नए "इंस्टॉल करने से जुड़ी ज़रूरी शर्तों" के ऑडिट में, ऑफ़लाइन काम करने की सुविधा की जांच शामिल है. इसलिए, "ऑफ़लाइन होने पर, मौजूदा पेज और start_url, 200 कोड का जवाब देता है" ऑडिट को हटा दिया गया है. "मोबाइल नेटवर्क पर पेज लोड होने की गति ज़रूरत के मुताबिक तेज़ है" ऑडिट को भी हटा दिया गया है.

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

एलिमेंट पैनल से जुड़े अपडेट

सीएसएस :target स्टेटस को फ़ोर्स करने की सुविधा

अब DevTools का इस्तेमाल करके, सीएसएस :target स्टेटस को फ़ोर्स किया जा सकता है और उसकी जांच की जा सकती है.

एलिमेंट पैनल में, कोई एलिमेंट चुनें और एलिमेंट की स्थिति को टॉगल करें. स्टाइल को लागू करने और उनकी जांच करने के लिए, :target चेकबॉक्स को चालू करें.

जब यूआरएल में मौजूद हैश और एलिमेंट का आईडी एक ही हो, तो एलिमेंट को स्टाइल करने के लिए :target स्यूडो-क्लास का इस्तेमाल करें. इसे खुद आज़माने के लिए, यह डेमो देखें. DevTools की इस नई सुविधा की मदद से, यूआरएल को हर बार मैन्युअल तरीके से बदले बिना, ऐसे स्टाइल को टेस्ट किया जा सकता है.

सीएसएस `:target` स्टेटस को फ़ोर्स करना

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

एलिमेंट का डुप्लीकेट बनाने के लिए नया शॉर्टकट

किसी एलिमेंट का तुरंत क्लोन बनाने के लिए, एलिमेंट का डुप्लीकेट बनाएं शॉर्टकट का इस्तेमाल करें.

एलिमेंट पैनल में किसी एलिमेंट पर राइट क्लिक करें. इसके बाद, डुप्लीकेट एलिमेंट चुनें. इसके नीचे एक नया एलिमेंट बन जाएगा.

इसके अलावा, कीबोर्ड शॉर्टकट का इस्तेमाल करके भी एलिमेंट को डुप्लीकेट किया जा सकता है:

  • Mac: Shift + Option + ⬇️
  • Windows/ Linux: Shift + Alt + ⬇️

डुप्लीकेट एलिमेंट

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

कस्टम सीएसएस प्रॉपर्टी के लिए कलर पिकर

स्टाइल पैनल में अब कस्टम सीएसएस प्रॉपर्टी के लिए कलर पिकर दिखते हैं.

इसके अलावा, Shift बटन को दबाकर कलर पिकर पर क्लिक करके, कलर वैल्यू के आरजीबीए, एचएसएलए, और हेक्स वैल्यू के बीच स्विच किया जा सकता है.

कस्टम सीएसएस प्रॉपर्टी के लिए कलर पिकर

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

सीएसएस प्रॉपर्टी कॉपी करने के लिए नए शॉर्टकट

अब कुछ नए शॉर्टकट की मदद से, सीएसएस प्रॉपर्टी को तेज़ी से कॉपी किया जा सकता है.

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

सीएसएस प्रॉपर्टी कॉपी करने के लिए नए शॉर्टकट

सीएसएस क्लास के लिए कॉपी करने के विकल्प:

  • चुने गए आइटम को कॉपी करें. चुनने के लिए मौजूदा टूल का नाम कॉपी करें.
  • नियम कॉपी करें. मौजूदा सिलेक्टर का नियम कॉपी करें.
  • सभी एलान कॉपी करें: मौजूदा नियम के तहत सभी एलान कॉपी करें. इनमें अमान्य और प्रीफ़िक्स वाली प्रॉपर्टी भी शामिल हैं.

सीएसएस प्रॉपर्टी के लिए कॉपी करने के विकल्प:

  • एलान कॉपी करें. मौजूदा लाइन का एलान कॉपी करें.
  • प्रॉपर्टी कॉपी करें. मौजूदा लाइन की प्रॉपर्टी कॉपी करें.
  • वैल्यू कॉपी करें: मौजूदा लाइन की वैल्यू कॉपी करें.

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

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

यूआरएल को डिकोड करके दिखाई गई कुकी दिखाने का नया विकल्प

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

ऐप्लिकेशन पैनल पर जाएं और कुकी पैनल चुनें. सूची में से कोई कुकी चुनें. डिकोड की गई कुकी देखने के लिए, डिकोड किया गया यूआरएल दिखाएं चेकबॉक्स को चालू करें.

यूआरएल-डिकोड की गई कुकी दिखाने का विकल्प

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

सिर्फ़ दिखने वाली कुकी मिटाना

कुकी पैनल में मौजूद सभी कुकी मिटाएं बटन को अब फ़िल्टर की गई कुकी मिटाएं बटन से बदल दिया गया है.

ऐप्लिकेशन पैनल > कुकी पैनल में, कुकी फ़िल्टर करने के लिए टेक्स्ट बॉक्स में टेक्स्ट डालें. यहां दिए गए उदाहरण में, हमने सूची को "PREF" के हिसाब से फ़िल्टर किया है. दिख रही कुकी मिटाने के लिए, फ़िल्टर की गई कुकी मिटाएं बटन पर क्लिक करें. फ़िल्टर टेक्स्ट मिटाएं. ऐसा करने पर, आपको सूची में अन्य कुकी दिखेंगी. पहले, आपके पास सिर्फ़ सभी कुकी मिटाने का विकल्प था.

सिर्फ़ दिखने वाली कुकी मिटाना

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

स्टोरेज पैनल में, तीसरे पक्ष की कुकी मिटाने का नया विकल्प

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

तीसरे पक्ष की कुकी मिटाने का विकल्प

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

कस्टम डिवाइसों के लिए, User-Agent क्लाइंट के हिंट में बदलाव करना

अब कस्टम डिवाइसों के लिए, User-Agent क्लाइंट के हिंट में बदलाव किया जा सकता है.

सेटिंग > डिवाइस पर जाएं और कस्टम डिवाइस जोड़ें... पर क्लिक करें. क्लाइंट के संकेत में बदलाव करने के लिए, उपयोगकर्ता एजेंट के क्लाइंट के संकेत सेक्शन को बड़ा करें.

यूज़र-एजेंट क्लाइंट हिंट में बदलाव करना

User-Agent क्लाइंट हिंट, User-Agent स्ट्रिंग का एक विकल्प है. इसकी मदद से, डेवलपर उपयोगकर्ता के ब्राउज़र की जानकारी को निजता बनाए रखते हुए और आसानी से ऐक्सेस कर सकते हैं. web.dev/user-agent-client-hints/ पर जाकर, यूज़र-एजेंट क्लाइंट हिंट के बारे में ज़्यादा जानें.

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

नेटवर्क पैनल से जुड़े अपडेट

"नेटवर्क लॉग रिकॉर्ड करें" सेटिंग को सेव करना

DevTools अब "नेटवर्क लॉग रिकॉर्ड करें" सेटिंग को सेव रखता है. पहले, जब भी कोई पेज फिर से लोड होता था, तो DevTools उपयोगकर्ता की पसंद को रीसेट कर देता था.

नेटवर्क लॉग रिकॉर्ड करना

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

नेटवर्क पैनल में WebTransport कनेक्शन देखना

नेटवर्क पैनल में अब WebTransport कनेक्शन दिखते हैं.

WebTransport कनेक्शन

WebTransport एक नया एपीआई है, जो कम इंतज़ार के साथ, क्लाइंट-सर्वर मैसेजिंग की सुविधा देता है. इसके इस्तेमाल के उदाहरणों के बारे में ज़्यादा जानें. साथ ही, web.dev/webtransport/ में, इसे आने वाले समय में लागू करने के बारे में सुझाव, शिकायत या राय देने का तरीका जानें.

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

"ऑनलाइन" का नाम बदलकर "बिना किसी थ्रॉटलिंग के" किया गया

नेटवर्क इम्यूलेशन के "ऑनलाइन" विकल्प का नाम अब बदलकर "थ्रॉटल नहीं" कर दिया गया है.

नेटवर्क लॉग रिकॉर्ड करना

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

कंसोल, सोर्स पैनल, और स्टाइल पैनल में कॉपी करने के नए विकल्प

कंसोल और सोर्स पैनल में ऑब्जेक्ट को कॉपी करने के लिए नए शॉर्टकट

अब Console और सोर्स पैनल में नए शॉर्टकट की मदद से, ऑब्जेक्ट की वैल्यू कॉपी की जा सकती हैं. यह तरीका, खास तौर पर तब काम आता है, जब आपको कोई बड़ा ऑब्जेक्ट (जैसे, लंबा कलेक्शन) कॉपी करना हो.

Console में ऑब्जेक्ट कॉपी करना

सोर्स पैनल में ऑब्जेक्ट कॉपी करना

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

सोर्स पैनल और स्टाइल पैनल में फ़ाइल का नाम कॉपी करने के लिए नए शॉर्टकट

अब इन पर राइट क्लिक करके, फ़ाइल का नाम कॉपी किया जा सकता है:

  • सोर्स पैनल में कोई फ़ाइल या
  • एलिमेंट पैनल में, स्टाइल पैनल में फ़ाइल का नाम

फ़ाइल का नाम कॉपी करने के लिए, संदर्भ मेन्यू से फ़ाइल का नाम कॉपी करें को चुनें.

सोर्स पैनल में फ़ाइल का नाम कॉपी करना

स्टाइल पैनल में फ़ाइल का नाम कॉपी करना

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

फ़्रेम की जानकारी वाले व्यू में अपडेट

फ़्रेम की जानकारी वाले व्यू में, नई सेवा वर्कर की जानकारी

DevTools अब उन फ़्रेम के नीचे खास सेवा वर्कर दिखाता है जो उन्हें बनाते हैं.

ऐप्लिकेशन पैनल में, सेवा वर्कर वाले फ़्रेम को बड़ा करें. इसके बाद, जानकारी देखने के लिए सेवा वर्कर ट्री में जाकर कोई सेवा वर्कर चुनें.

फ़्रेम की जानकारी वाले व्यू में, सेवा वर्कर की जानकारी

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

फ़्रेम की ज़्यादा जानकारी वाले व्यू में, 'यादें' की जानकारी मेज़र करना

performance.measureMemory() एपीआई का स्टेटस, अब एपीआई की उपलब्धता सेक्शन में दिखता है.

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

स्टोरेज का पता लगाना

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

'समस्याएं' टैब से सुझाव/राय देना या शिकायत करना

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

सुझाव, शिकायत या राय भेजने का लिंक

परफ़ॉर्मेंस पैनल में, छोड़े गए फ़्रेम

परफ़ॉर्मेंस पैनल में लोड की परफ़ॉर्मेंस का विश्लेषण करते समय, फ़्रेम सेक्शन अब ड्रॉप किए गए फ़्रेम को लाल रंग से मार्क करता है. फ़्रेम रेट जानने के लिए, उस पर कर्सर घुमाएं.

छोड़े गए फ़्रेम

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

डिवाइस मोड में फ़ोल्ड किए जा सकने वाले और ड्यूअल स्क्रीन वाले डिवाइसों को एमुलेट करना

अब DevTools में ड्यूअल स्क्रीन और फ़ोल्ड किए जा सकने वाले डिवाइसों को एमुलेट किया जा सकता है.

डिवाइस टूलबार चालू करने के बाद, इनमें से कोई एक डिवाइस चुनें: Surface Duo या Samsung Galaxy Fold.

एक स्क्रीन या फ़ोल्ड किए गए और दो स्क्रीन या अनफ़ोल्ड किए गए डिसप्ले के बीच टॉगल करने के लिए, नए स्पैन आइकॉन पर क्लिक करें.

सीएसएस मीडिया की नई screen-spanning सुविधा और JavaScript getWindowSegments एपीआई को ऐक्सेस करने के लिए, वेब प्लैटफ़ॉर्म की एक्सपेरिमेंटल सुविधाएं भी चालू की जा सकती हैं. एक्सपेरिमेंटल आइकॉन, एक्सपेरिमेंट के तौर पर उपलब्ध वेब प्लैटफ़ॉर्म की सुविधाओं के फ़्लैग का स्टेटस दिखाता है. फ़्लैग चालू होने पर, आइकॉन हाइलाइट हो जाता है. chrome://flags पर जाएं और फ़्लैग को टॉगल करें.

ड्यूअल स्क्रीन मोड को एम्युलेट करना

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

प्रयोग के तौर पर शुरू की गई सुविधाएं

Puppeteer Recorder की मदद से, ब्राउज़र टेस्टिंग को ऑटोमेट करना

DevTools अब ब्राउज़र के साथ आपके इंटरैक्शन के आधार पर, Puppeteer स्क्रिप्ट जनरेट कर सकता है. इससे, ब्राउज़र की टेस्टिंग को ऑटोमेट करना आपके लिए आसान हो जाता है. Puppeteer एक Node.js लाइब्रेरी है, जो DevTools प्रोटोकॉल की मदद से Chrome या Chromium को कंट्रोल करने के लिए, बेहतर API उपलब्ध कराती है.

इस डेमो पेज पर जाएं. DevTools में सोर्स पैनल खोलें. बाएं पैनल में, रिकॉर्डिंग टैब को चुनें. कोई नई रिकॉर्डिंग जोड़ें और फ़ाइल को कोई नाम दें (उदाहरण के लिए, test01.js).

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

स्क्रिप्ट चलाने के लिए, Puppeteer की आधिकारिक साइट पर शुरू करने के लिए गाइड देखें.

कृपया ध्यान दें कि यह शुरुआती चरण का प्रयोग है. हम समय के साथ, Recorder की सुविधा को बेहतर बनाने और उसे ज़्यादा लोगों तक पहुंचाने की कोशिश करेंगे.

Puppeteer Recorder

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

स्टाइल पैनल में फ़ॉन्ट एडिटर

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

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

स्टाइल पैनल में फ़ॉन्ट एडिटर

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

सीएसएस फ़्लेक्सबॉक्स डीबगिंग टूल

DevTools में, पिछली रिलीज़ के बाद से फ़्लेक्सबॉक्स डीबगिंग के लिए, एक्सपेरिमेंट के तौर पर सहायता जोड़ी गई है.

DevTools अब एक गाइडिंग लाइन बनाता है, ताकि आपको सीएसएस align-items प्रॉपर्टी को बेहतर तरीके से विज़ुअलाइज़ करने में मदद मिल सके. सीएसएस gap प्रॉपर्टी का इस्तेमाल भी किया जा सकता है. हमारे उदाहरण में, सीएसएस gap: 12px; है. हर गैप के लिए, हैचिंग पैटर्न देखें.

फ़्लेक्सबॉक्स

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

सीएसपी उल्लंघन का नया टैब

सीएसपी के उल्लंघन वाले नए टैब में, कॉन्टेंट की सुरक्षा के बारे में नीति (सीएसपी) के सभी उल्लंघन एक नज़र में देखें. यह नया टैब एक एक्सपेरिमेंट है. इससे, ऐसे वेब पेजों के साथ काम करना आसान हो जाएगा जिनमें सीएसपी और भरोसेमंद टाइप के उल्लंघन की संख्या ज़्यादा है.

सीएसपी के उल्लंघन टैब

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

कलर कंट्रास्ट का नया हिसाब लगाने का तरीका - बेहतर परसेप्चुअल कंट्रास्ट एल्गोरिदम (APCA)

बेहतर परसेप्चुअल कंट्रास्ट एल्गोरिदम (APCA), कलर पिकर में AA/AAA के दिशा-निर्देशों के कंट्रास्ट अनुपात की जगह ले रहा है.

APCA, रंग की परसेप्शन पर की गई आधुनिक रिसर्च के आधार पर, कंट्रास्ट का हिसाब लगाने का एक नया तरीका है. एपीएसीए, AA/AAA दिशा-निर्देशों की तुलना में ज़्यादा संदर्भ पर निर्भर करता है. कंट्रास्ट का हिसाब, टेक्स्ट की स्पेस प्रॉपर्टी (फ़ॉन्ट का वज़न और साइज़), रंग (टेक्स्ट और बैकग्राउंड के बीच का हल्कापन), और कॉन्टेक्स्ट (आस-पास की रोशनी, आस-पास का माहौल, टेक्स्ट का मकसद) के आधार पर लगाया जाता है.

कलर पिकर में एपीसीए

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

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

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

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

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

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

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

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