ब्राउज़र की गड़बड़ी को ठीक करने का तरीका

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

किसी अच्छे बग को ठीक करना कठिन तो नहीं है, लेकिन थोड़ी सी मेहनत लगती है. इसका मकसद है कि गड़बड़ी की पहचान आसानी से करना, असल वजह तक पहुंचना, और उसे ठीक करने का तरीका खोजना. तेज़ी से काम करने वाली गड़बड़ियां, साफ़ तौर पर उम्मीद के मुताबिक व्यवहार के साथ आसानी से मिल जाती हैं.

पुष्टि करें कि यह गड़बड़ी है

सबसे पहले यह पता लगाएं कि "सही" व्यवहार क्या होना चाहिए.

सही व्यवहार क्या है?

MDN पर काम के एपीआई दस्तावेज़ देखें या इससे जुड़ी जानकारी खोजने की कोशिश करें. इस जानकारी से आपको यह तय करने में मदद मिल सकती है कि कौनसा एपीआई असल में काम नहीं कर रहा है, कहां काम नहीं कर रहा है, और असल में कैसा व्यवहार हो रहा है.

क्या यह किसी दूसरे ब्राउज़र में काम करता है?

अलग-अलग ब्राउज़र के काम करने के तरीके में आम तौर पर, इंटरऑपरेबिलिटी (दूसरे सिस्टम के साथ काम करना) की समस्या के तौर पर प्राथमिकता को प्राथमिकता दी जाती है. खास तौर पर तब, जब गड़बड़ी वाले ब्राउज़र में गड़बड़ी होती है. Chrome, Firefox, Safari, और Edge के नए वर्शन पर जांच करके देखें. इसके लिए, आपको BrowserStack जैसे टूल का इस्तेमाल किया जा सकता है.

अगर हो सके, तो यह देख लें कि उपयोगकर्ता एजेंट को स्निफ़िंग की वजह से, पेज जान-बूझकर अलग काम तो नहीं कर रहा है. Chrome DevTools में, User-Agent स्ट्रिंग को किसी दूसरे ब्राउज़र पर सेट करने की कोशिश करें.

क्या हाल ही में रिलीज़ किए गए वीडियो में यह समस्या आई है?

क्या यह पहले की उम्मीद के मुताबिक काम करता था, लेकिन हाल ही में ब्राउज़र रिलीज़ के दौरान यह काम करना बंद कर देता है? ऐसे "रिग्रेशन" पर तेज़ी से कार्रवाई की जा सकती है, खास तौर पर तब, जब आप ऐसा वर्शन नंबर दें जहां वह काम करता हो और वह वर्शन उपलब्ध न हो जहां वह काम नहीं करता. BrowserStack जैसे टूल से पुराने ब्राउज़र वर्शन को देखना आसान हो सकता है. साथ ही, bisect-builds टूल (Chromium के लिए) की मदद से, बदलाव को आसानी से खोजा जा सकता है.

अगर कोई समस्या रिग्रेशन है और इसे फिर से बनाया जा सकता है, तो इसकी असल वजह का पता लगाकर उसे जल्द से जल्द ठीक किया जा सकता है.

क्या दूसरे लोगों को भी यही समस्या दिख रही है?

अगर आपको समस्याएं आ रही हैं, तो हो सकता है कि दूसरे डेवलपर को भी समस्याएं आ रही हों. सबसे पहले, Stack Overflow पर गड़बड़ी को खोजें. इससे आपको किसी ऐब्सट्रैक्ट समस्या को, काम न करने वाले एपीआई में अनुवाद करने में मदद मिल सकती है. साथ ही, जब तक गड़बड़ी ठीक नहीं हो जाती, तब तक आपको थोड़ी-बहुत दिक्कतों को दूर करने में भी मदद मिल सकती है.

क्या इसकी शिकायत पहले की गई है?

जब आपको बग के बारे में पता हो, तो यह देखने का समय हो जाता है कि क्या ब्राउज़र बग डेटाबेस में खोज करके बग की रिपोर्ट पहले ही की जा चुकी है.

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

अगर आपको गड़बड़ी के बारे में टिप्पणी करनी है, तो इस बारे में जानकारी दें कि वह गड़बड़ी आपकी वेबसाइट पर क्या असर डालती है. "1" स्टाइल वाली टिप्पणियां जोड़ने से बचें, क्योंकि गड़बड़ी को ट्रैक करने वाले टूल आम तौर पर हर टिप्पणी के लिए ईमेल भेजते हैं.

गड़बड़ी की शिकायत करें

अगर गड़बड़ी की शिकायत पहले नहीं की गई थी, तो ब्राउज़र वेंडर को इसके बारे में बताएं.

छोटा किया गया टेस्ट केस बनाएं

Mozilla के पास एक छोटा टेस्ट केस बनाने के तरीके के बारे में एक बढ़िया लेख है. एक लंबी कहानी को छोटा करने के लिए, समस्या के बारे में बताने का मतलब एक शानदार शुरुआत होती है. समस्या की जानकारी देने वाली गड़बड़ी का लिंक दिया गया डेमो देना अच्छा होता है. तेज़ी से आगे बढ़ने की संभावना को बढ़ाने के लिए, उदाहरण में समस्या को दिखाने के लिए ज़रूरी कम से कम कोड शामिल होना चाहिए. कम से कम कोड सैंपल वह है जिससे आपकी गड़बड़ी के ठीक होने की संभावना बढ़ सकती है.

टेस्ट केस को छोटा करने के लिए, यहां कुछ सलाह दी गई हैं:

  • वेब पेज डाउनलोड करें, <base href="https://original.url"> जोड़ें, और पुष्टि करें कि गड़बड़ी स्थानीय डिवाइस पर मौजूद है. अगर यूआरएल, एचटीटीपीएस का इस्तेमाल करता है, तो इसके लिए लाइव एचटीटीपीएस सर्वर की ज़रूरत पड़ सकती है.
  • ज़्यादा से ज़्यादा ब्राउज़र के नए बिल्ड पर लोकल फ़ाइलों की जांच करें.
  • सब कुछ एक फ़ाइल में शामिल करने की कोशिश करें.
  • जब तक गड़बड़ी ठीक नहीं हो जाती, तब तक कोड (ऐसी चीज़ों से शुरू करते हुए जिन्हें ग़ैर-ज़रूरी माना जाता है) हटाएं.
  • वर्शन कंट्रोल का इस्तेमाल करें, ताकि आप अपने काम को सेव कर सकें और गलत काम को पहले जैसा कर सकें.

छोटा किया गया टेस्ट केस होस्ट करना

अगर आपको छोटा किया गया टेस्ट केस होस्ट करने के लिए कोई अच्छी जगह चाहिए, तो ऐसी कई अच्छी जगहें उपलब्ध हैं:

ध्यान रखें कि उनमें से कई साइटें iframe में कॉन्टेंट दिखाती हैं. इस वजह से, सुविधाएं या गड़बड़ियां अलग तरह से काम कर सकती हैं.

समस्या दर्ज करना

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

समस्या के बारे में साफ़ तौर पर बताएं. साथ ही, यह भी बताएं कि इस समस्या को हल करने के लिए क्या कदम उठाने होंगे

सबसे पहले, साफ़ तौर पर जानकारी दें, ताकि इंजीनियर आसानी से समझ सकें कि समस्या क्या है और उसे प्राथमिकता के हिसाब से निपटाने में मदद मिलेगी.

When installing a PWA using the `beforeinstallprompt.prompt()`, the
`appinstalled` event fires before the call to `prompt()` resolves.

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

What steps will reproduce the problem?
1. Go to https://basic-pwa.glitch.me/, open DevTools and look at the
   console tab.
2. Click the Install button in the page, you might need to interact with
   the page a bit before it becomes enabled.
3. Click Install on the browser modal install confirmation.

और आखिर में, उम्मीद के मुताबिक और असल नतीजे के बारे में बताएं.

What is the expected result? In the console:
0. INSTALL: Available (logged when `beforeinstallprompt` event fired)
1. INSTALL_PROMPT_RESPONSE: {outcome: "accepted", platform: "web"}
   (logged when beforeinstallprompt.prompt()` resolves)
2. INSTALL: Success (logged when `appinstalled` event fired)

What is the actual result? In the console:
0. INSTALL: Available (logged when `beforeinstallprompt` event fired)
1. INSTALL: Success (logged when `appinstalled` event fired)
2. INSTALL_PROMPT_RESPONSE: {outcome: "accepted", platform: "web"}
   (logged when beforeinstallprompt.prompt()` resolves)

ज़्यादा जानकारी के लिए, एमडीएन पर गड़बड़ी की रिपोर्ट लिखने से जुड़े दिशा-निर्देश देखें.

बोनस: समस्या का स्क्रीनशॉट या स्क्रीनकास्ट जोड़ें

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

पर्यावरण की जानकारी शामिल करें

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

गड़बड़ी की जानकारी सबमिट करें

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