ব্রাউজার বিক্রেতাদের তাদের ব্রাউজারে আপনি যে সমস্যাগুলি খুঁজে পান সে সম্পর্কে বলা ওয়েব প্ল্যাটফর্মকে আরও ভাল করার একটি অবিচ্ছেদ্য অংশ৷
একটি ভাল বাগ ফাইল করা কিন্তু একটু কাজ লাগে. আপনার লক্ষ্য হওয়া উচিত ব্রাউজার প্রকৌশলীদের জন্য যতটা সম্ভব সহজ করে তোলার জন্য যা ভাঙা হয়েছে তা খুঁজে বের করা, মূল কারণ পর্যন্ত পৌঁছানো এবং সবচেয়ে গুরুত্বপূর্ণভাবে, এটি ঠিক করার উপায় খুঁজে বের করা। যে বাগগুলি দ্রুত অগ্রগতি করে সেগুলি একটি স্পষ্ট প্রত্যাশিত আচরণের সাথে দ্রুত পুনরুত্পাদন করতে থাকে।
এটি একটি বাগ যাচাই করুন
প্রথম ধাপ হল "সঠিক" আচরণ কি হওয়া উচিত তা বের করা।
সঠিক আচরণ কি?
MDN- এ প্রাসঙ্গিক API ডক্স চেক করুন, বা সম্পর্কিত চশমা খোঁজার চেষ্টা করুন। এই তথ্যটি আপনাকে ঠিক করতে সাহায্য করতে পারে যে কোন APIটি আসলে ভাঙ্গা হয়েছে, কোথায় এটি ভাঙা হয়েছে এবং প্রত্যাশিত আচরণ কী।
এটি একটি ভিন্ন ব্রাউজারে কাজ করে?
ব্রাউজারগুলির মধ্যে যে আচরণের পার্থক্য হয় তা সাধারণত একটি আন্তঃব্যবহারের সমস্যা হিসাবে উচ্চতর অগ্রাধিকার দেওয়া হয়, বিশেষত যখন বাগ ধারণকারী ব্রাউজারটি অদ্ভুত হয়। ক্রোম, ফায়ারফক্স, সাফারি এবং এজ এর সর্বশেষ সংস্করণে পরীক্ষা করার চেষ্টা করুন, সম্ভবত ব্রাউজারস্ট্যাকের মতো একটি টুল ব্যবহার করে।
যদি সম্ভব হয়, ব্যবহারকারী এজেন্ট স্নিফিংয়ের কারণে পৃষ্ঠাটি ইচ্ছাকৃতভাবে ভিন্ন আচরণ করছে কিনা তা পরীক্ষা করুন। Chrome DevTools-এ, অন্য ব্রাউজারে User-Agent স্ট্রিং সেট করার চেষ্টা করুন।
এটি একটি সাম্প্রতিক রিলিজ বিরতি?
এটি কি অতীতে প্রত্যাশিত হিসাবে কাজ করেছিল, কিন্তু সাম্প্রতিক ব্রাউজার রিলিজে ভেঙে গেছে? এই ধরনের রিগ্রেশন অনেক দ্রুত কাজ করা যেতে পারে, বিশেষ করে যদি আপনি একটি সংস্করণ নম্বর সরবরাহ করেন যেখানে এটি কাজ করে এবং একটি সংস্করণ যেখানে এটি ব্যর্থ হয়। আপনি পুরানো ব্রাউজার সংস্করণ পরীক্ষা করতে BrowserStack এর মতো টুল ব্যবহার করতে পারেন। পরিবর্তনটি অনুসন্ধান করতে দ্বিখণ্ডিত-বিল্ড টুল (ক্রোমিয়ামের জন্য) এর মতো সরঞ্জামগুলি ব্যবহার করুন৷
যদি একটি সমস্যা একটি রিগ্রেশন হয় এবং পুনরুত্পাদন করা যেতে পারে, তবে মূল কারণটি সাধারণত খুঁজে পাওয়া যায় এবং দ্রুত ঠিক করা যায়।
অন্যরা কি একই সমস্যা দেখছেন?
আপনি যদি সমস্যার সম্মুখীন হন, তবে অন্যান্য বিকাশকারীদেরও হওয়ার একটি ভাল সুযোগ রয়েছে। প্রথমে, স্ট্যাক ওভারফ্লোতে বাগ অনুসন্ধান করার চেষ্টা করুন। এটি আপনাকে একটি বিমূর্ত সমস্যাকে একটি নির্দিষ্ট ভাঙা API-তে অনুবাদ করতে সাহায্য করতে পারে এবং বাগ সংশোধন না হওয়া পর্যন্ত এটি আপনাকে একটি স্বল্পমেয়াদী সমাধান খুঁজে পেতে সহায়তা করতে পারে।
এটা আগে রিপোর্ট করা হয়েছে?
বাগটি কী তা একবার আপনার ধারণা হয়ে গেলে, ব্রাউজার বাগ ডাটাবেস অনুসন্ধান করে বাগটি ইতিমধ্যে রিপোর্ট করা হয়েছে কিনা তা পরীক্ষা করার সময়।
- ক্রোমিয়াম-ভিত্তিক ব্রাউজার: https://crbug.com
- ফায়ারফক্স: https://bugzilla.mozilla.org/
- সাফারি এবং ওয়েবকিট-ভিত্তিক ব্রাউজার: https://bugs.webkit.org/
যদি আপনি একটি বিদ্যমান বাগ খুঁজে পান যা সমস্যাটি বর্ণনা করে, তাহলে বাগটিতে তারকাচিহ্নিত, পছন্দ বা মন্তব্য করে আপনার সমর্থন যোগ করুন। এবং, অনেক সাইটে, আপনি নিজেকে CC তালিকায় যুক্ত করতে পারেন এবং বাগ পরিবর্তিত হলে আপডেট পেতে পারেন৷
আপনি বাগ সম্পর্কে মন্তব্য করার সিদ্ধান্ত নিলে, বাগটি কীভাবে আপনার ওয়েবসাইটকে প্রভাবিত করে সে সম্পর্কে তথ্য অন্তর্ভুক্ত করুন। "+1" শৈলী মন্তব্য যোগ করা এড়িয়ে চলুন, কারণ বাগ ট্র্যাকাররা সাধারণত প্রতিটি মন্তব্যের জন্য ইমেল পাঠায়।
বাগ রিপোর্ট করুন
যদি বাগটি আগে রিপোর্ট করা না হয় তবে ব্রাউজার বিক্রেতাকে এটি সম্পর্কে বলার সময় এসেছে৷
একটি মিনিমাইজড টেস্ট কেস তৈরি করুন
কিভাবে একটি মিনিমাইজড টেস্ট কেস তৈরি করা যায় সে সম্পর্কে মজিলার একটি দুর্দান্ত নিবন্ধ রয়েছে৷ একটি দীর্ঘ গল্প সংক্ষিপ্ত করার জন্য, সমস্যাটির বর্ণনা একটি দুর্দান্ত শুরু হলেও, সমস্যাটি দেখায় এমন বাগটিতে একটি লিঙ্কযুক্ত ডেমো প্রদান করে কিছুই নয়। দ্রুত অগ্রগতির সুযোগ বাড়ানোর জন্য উদাহরণটিতে সমস্যাটি প্রদর্শনের জন্য প্রয়োজনীয় ন্যূনতম সম্ভাব্য কোড থাকা উচিত। একটি ন্যূনতম কোড নমুনা হল এক নম্বর জিনিস যা আপনি আপনার বাগ সংশোধন করার সম্ভাবনা বাড়ানোর জন্য করতে পারেন।
এখানে একটি পরীক্ষার ক্ষেত্রে ছোট করার জন্য কয়েকটি টিপস রয়েছে:
- ওয়েব পৃষ্ঠাটি ডাউনলোড করুন,
<base href="https://original.url">যোগ করুন এবং যাচাই করুন যে বাগটি স্থানীয়ভাবে বিদ্যমান। URL HTTPS ব্যবহার করলে এর জন্য একটি লাইভ HTTPS সার্ভারের প্রয়োজন হতে পারে। - আপনি যতটা পারেন ব্রাউজারগুলির সর্বশেষ বিল্ডগুলিতে স্থানীয় ফাইলগুলি পরীক্ষা করুন৷
- 1 ফাইলে সবকিছু ঘনীভূত করার চেষ্টা করুন।
- বাগটি দূর না হওয়া পর্যন্ত কোড সরান (আপনি অপ্রয়োজনীয় বলে জানেন এমন জিনিস দিয়ে শুরু করে)।
- ভার্সন কন্ট্রোল ব্যবহার করুন যাতে আপনি আপনার কাজ সংরক্ষণ করতে পারেন এবং ভুল হয়ে যাওয়া জিনিসগুলিকে পূর্বাবস্থায় ফিরিয়ে আনতে পারেন।
একটি মিনিফাইড টেস্ট কেস হোস্ট করুন
আপনি যদি আপনার মিনিফাইড টেস্ট কেস হোস্ট করার জন্য একটি ভাল জায়গা খুঁজছেন, সেখানে বেশ কয়েকটি ভাল জায়গা উপলব্ধ রয়েছে:
সচেতন থাকুন যে এই সাইটগুলির মধ্যে বেশ কয়েকটি আইফ্রেমে সামগ্রী প্রদর্শন করে, যা বৈশিষ্ট্য বা বাগগুলি ভিন্নভাবে আচরণ করতে পারে৷
আপনার সমস্যা ফাইল করুন
একবার আপনি আপনার মিনিমাইজড টেস্ট কেস পেয়ে গেলে, আপনি সেই বাগ ফাইল করার জন্য প্রস্তুত। সঠিক বাগ ট্র্যাকিং সাইটে যান এবং একটি নতুন সমস্যা তৈরি করুন৷
- ক্রোমিয়াম-ভিত্তিক ব্রাউজার - https://crbug.com/new
- ফায়ারফক্স - https://bugzilla.mozilla.org/
- সাফারি এবং ওয়েবকিট-ভিত্তিক ব্রাউজার - https://bugs.webkit.org/
প্রতিলিপি করার জন্য স্পষ্ট বর্ণনা এবং ধাপ যোগ করুন
প্রথমে, প্রকৌশলীদের সমস্যাটি কী তা দ্রুত বুঝতে এবং সমস্যাটি সমাধান করতে সহায়তা করার জন্য একটি স্পষ্ট বিবরণ প্রদান করুন।
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)
আরও তথ্যের জন্য, MDN-এ বাগ রিপোর্ট লেখার নির্দেশিকা দেখুন।
বোনাস: সমস্যার একটি স্ক্রিনশট বা স্ক্রিনকাস্ট যোগ করুন
প্রয়োজন না হলেও, সমস্যাটির একটি স্ক্রিনশট বা স্ক্রিনকাস্ট যোগ করা প্রায়ই সহায়ক। এটি বিশেষত সহায়ক যখন বেশ কয়েকটি ধাপ বা অস্বাভাবিক কার্যকলাপের পরে বাগ দেখা দেয়। স্ক্রিনকাস্ট এবং স্ক্রিনশটগুলি প্রায়শই ব্রাউজার ইঞ্জিনিয়ারদের কী হয়েছিল তা আরও ভালভাবে প্রদর্শন করতে পারে।
পরিবেশের বিশদ বিবরণ অন্তর্ভুক্ত করুন
কিছু বাগ শুধুমাত্র নির্দিষ্ট অপারেটিং সিস্টেমে বা শুধুমাত্র নির্দিষ্ট ধরনের প্রদর্শনে (উদাহরণস্বরূপ, কম-ডিপিআই বা উচ্চ-ডিপিআই) পুনরুত্পাদনযোগ্য। আপনার ব্যবহার করা যেকোনো পরীক্ষার পরিবেশের বিবরণ অন্তর্ভুক্ত করতে ভুলবেন না।
বাগ জমা দিন
অবশেষে, বাগ জমা দিন। বাগের প্রতিক্রিয়ার জন্য আপনার ইমেইলে নজর রাখুন। সাধারণত তদন্তের সময়, ইঞ্জিনিয়ারদের অতিরিক্ত প্রশ্ন থাকতে পারে। যদি তাদের সমস্যাটি পুনরুত্পাদন করতে অসুবিধা হয় তবে তারা যোগাযোগ করতে পারে।