يُعد إبلاغ موردي المتصفحات بالمشكلات التي تجدها في المتصفح جزءًا لا يتجزأ من تحسين نظام الويب الأساسي!
إنّ الإبلاغ عن خطأ جيد ليس بالأمر الصعب، ولكنه يتطلب بعض الجهد. الهدف هو تسهيل العثور على العناصر المعطّلة، والوصول إلى السبب الجذري، والأهم من ذلك، إيجاد طريقة لإصلاحها. غالبًا ما يكون من السهل إعادة إنتاج الأخطاء التي تحرز تقدمًا سريعًا من خلال سلوك متوقع واضح.
التحقق من أنه خطأ
الخطوة الأولى هي معرفة السلوك "الصحيح".
ما السلوك الصحيح؟
راجِع مستندات واجهة برمجة التطبيقات ذات الصلة على MDN، أو حاوِل العثور على المواصفات ذات الصلة. ويمكن أن تساعدك هذه المعلومات في تحديد واجهة برمجة التطبيقات المعطلة وتحديد موضعها والسلوك المتوقَّع.
هل يعمل في متصفّح آخر؟
يحظى السلوك المختلف بين المتصفحات بأولوية أعلى عادةً باعتباره مشكلة في إمكانية التشغيل التفاعلي، وخاصةً عندما يكون المتصفح الذي يحتوي على الخطأ فريدًا من نوعه. جرِّب اختبار أحدث الإصدارات من Chrome وFirefox وSafari وEdge ربما باستخدام أداة مثل BrowserStack.
إذا أمكن، تأكَّد من أنّ الصفحة لا تتصرف بشكل مختلف عن قصد بسبب سرقة وكيل المستخدم. في "أدوات مطوري البرامج في Chrome"، جرِّب ضبط سلسلة User-Agent على متصفّح آخر.
هل تعطّل التطبيق في إصدار حديث؟
هل نجح ذلك في تحقيق النتائج المرجوّة في السابق، إلا أنّه تعطّل في إصدار حديث من المتصفّح؟ يمكن تنفيذ مثل هذه "الانحدارات" بشكل أسرع بكثير، خاصةً إذا قمت بتوفير رقم الإصدار الذي تم تنفيذ المهمة فيه وإصدار لم ينجح. يمكن لأدوات مثل BrowserStack تسهيل التحقُّق من إصدارات المتصفّح القديمة، في حين تتيح أداة Bisect-builds (في Chromium) إمكانية البحث عن التغيير بكفاءة عالية.
إذا كانت المشكلة هي تراجع ويمكن تكرارها، يمكن عادةً تحديد السبب الجذري وإصلاحها بسرعة.
هل يواجه الآخرون المشكلة نفسها؟
إذا واجهت مشكلات، فهناك احتمال كبير أن يواجهها مطورون آخرون. أولاً، جرِّب البحث عن الخطأ في Stack Overflow. وقد يساعدك ذلك في تحويل مشكلة مجردة إلى واجهة برمجة تطبيقات معطلة محددة، وقد يساعدك في العثور على حل بديل على المدى القصير إلى أن يتم إصلاح الخطأ.
هل تم الإبلاغ عنه من قبل؟
عندما تصبح لديك فكرة عن ماهية الخطأ، يحين وقت للتحقق مما إذا كان قد تم الإبلاغ عن الخطأ من قبل من خلال البحث في قاعدة بيانات أخطاء المتصفح.
- المتصفّحات المستندة إلى Chromium: https://crbug.com
- Firefox: https://bugzilla.mozilla.org/
- المتصفّحات المستنِدة إلى Safari وWebKit: https://bugs.webkit.org/
إذا عثرت على خطأ حالي يصف المشكلة، يمكنك تقديم الدعم من خلال تمييز الخطأ بنجمة أو إضافته إلى المحتوى المفضّل أو التعليق عليه. وفي العديد من المواقع الإلكترونية، يمكنك إضافة نفسك إلى قائمة "نسخة إلى" والحصول على إشعارات عند تغيّر الخطأ.
إذا قررت التعليق على الخطأ، ضمِّن معلومات حول تأثير الخطأ في موقعك الإلكتروني. تجنب إضافة تعليقات نمط "+1"، حيث ترسل أدوات تتبع الأخطاء عادةً رسائل البريد الإلكتروني لكل تعليق.
الإبلاغ عن الخطأ
إذا لم يتم الإبلاغ عن الخطأ من قبل، يحين وقت إخبار مورد المتصفح به.
إنشاء حالة اختبار مصغّرة
لدى Mozilla مقالة رائعة حول كيفية إنشاء حالة اختبار مصغَّرة. لإنشاء قصة طويلة، في حين أنّ وصف المشكلة بداية رائعة، لا يفوتك تقديم عرض توضيحي مرتبط في الخطأ الذي يُظهر المشكلة. لزيادة فرصة التقدم السريع، يجب أن يحتوي المثال على الحد الأدنى الممكن من التعليمة البرمجية اللازمة لتوضيح المشكلة. الحد الأدنى من عينة التعليمات البرمجية هو أول إجراء يمكنك القيام به لزيادة احتمالات إصلاح الخطأ.
في ما يلي بعض النصائح لتقليل حالة اختبار:
- نزِّل صفحة الويب وأضِف
<base href="https://original.url">وتحقَّق من وجود الخطأ على الجهاز. وقد يتطلّب ذلك توفّر خادم HTTPS نشط إذا كان عنوان URL يستخدم بروتوكول HTTPS. - اختبِر الملفات المحلية على أحدث إصدارات من أكبر عدد ممكن من المتصفّحات.
- حاول اختصار كل شيء في ملف واحد.
- أزل الرمز (بدءًا بالأشياء التي تعرف أنها غير ضرورية) حتى يختفي الخطأ.
- يمكنك استخدام التحكم في الإصدار حتى تتمكن من حفظ عملك والتراجع عن الأشياء التي تسوءت.
استضافة حالة اختبار مصغّرة
إذا كنت تبحث عن مكان جيد لاستضافة حالة الاختبار المصغر، فهناك العديد من الأماكن الجيدة المتاحة:
ويجب الانتباه إلى أنّ العديد من هذه المواقع الإلكترونية تعرض محتوى في إطار iframe، ما قد يؤدي إلى اختلاف أداء الميزات أو الأخطاء.
جارٍ الإبلاغ عن المشكلة
عندما تحصل على نسخة اختبارية مصغَّرة، ستكون مستعدًا لتسجيل هذا الخطأ. انتقِل إلى الموقع الإلكتروني الصحيح لتتبُّع الأخطاء وأنشئ مشكلة جديدة.
- المتصفّحات المستندة إلى Chromium - https://crbug.com/new
- Firefox - https://bugzilla.mozilla.org/
- المتصفّحات المستنِدة إلى Safari وWebKit: 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.
ميزة إضافية: إضافة لقطة شاشة أو تسجيل رقمي للشاشة للمشكلة
قد يكون من المفيد في بعض الحالات إضافة لقطة شاشة أو تسجيل رقمي للشاشة للمشكلة، على الرغم من أنّ هذا الإجراء ليس مطلوبًا. يكون هذا مفيدًا بشكل خاص في الحالات التي قد تتطلب فيها الأخطاء بعض الخطوات الغريبة لإعادة إنتاجها. يمكن أن تكون القدرة على رؤية ما يحدث في التسجيل الرقمي للشاشة أو لقطة شاشة مفيدة في كثير من الأحيان.
تضمين تفاصيل البيئة
بعض الأخطاء يمكن تكرارها على أنظمة تشغيل معيّنة فقط، أو على أنواع محدّدة من الشاشات فقط (على سبيل المثال، وحدات العرض ذات النقاط المنخفضة أو النقاط العالية لكل بوصة). تأكد من تضمين تفاصيل أي بيئات اختبار استخدمتها.
إرسال الخطأ
أخيرًا، أرسل الخطأ. بعد ذلك، تذكر مراقبة بريدك الإلكتروني بحثًا عن أي ردود على الخطأ. عادةً ما أثناء التحقيق وعند إصلاح الخطأ، قد يكون لدى المهندسين أسئلة إضافية، أو إذا واجهوا صعوبة في إعادة إظهار المشكلة، فقد يتواصلون.