كيفية الإبلاغ عن خطأ جيد في المتصفِّح

إنّ إبلاغ مورّدي المتصفّحات بالمشاكل التي تواجهها في المتصفّح هو جزء لا يتجزأ من تحسين منصة الويب.

تم الإبلاغ عن خلل جيد، ولكن يتطلّب بعض العمل. يجب أن يكون هدفك هو تسهيل العثور على المشكلة وتحديد السبب الأساسي لها وحلّها على مهندسي المتصفّحات قدر الإمكان. إنّ الأخطاء التي تؤدي إلى تقدّم سريع يمكن تكرارها بسرعة مع سلوك متوقّع واضح.

الخطوة الأولى هي تحديد السلوك "الصحيح".

اطّلِع على مستندات واجهة برمجة التطبيقات ذات الصلة على MDN، أو حاوِل العثور على المواصفات ذات الصلة. يمكن أن تساعدك هذه المعلومات في تحديد واجهة برمجة التطبيقات التي تتعذّر استخدامها، ومكان حدوث المشكلة، والسلوك المتوقّع.

هل يعمل في متصفّح آخر؟

بشكل عام، يتم منح الأولوية بشكل أكبر للسلوك الذي يختلف بين المتصفّحات باعتباره مشكلة في التشغيل التفاعلي، خاصةً عندما يكون المتصفّح الذي يتضمّن الخطأ هو المتصفّح الوحيد الذي يختلف عن غيره. حاوِل إجراء الاختبار على أحدث إصدارات Chrome وFirefox وSafari وEdge، باستخدام أداة مثل BrowserStack على سبيل المثال.

تأكَّد، إن أمكن، من أنّ الصفحة لا تتصرف بشكل مختلف عن قصد بسبب استنشاق وكيل المستخدم. في "أدوات مطوري البرامج في Chrome"، جرِّب ضبط سلسلة User-Agent على متصفّح آخر.

هل حدثت المشكلة في إصدار حديث؟

هل كان هذا يعمل على النحو المتوقّع في السابق، ولكن توقّف عن العمل في إصدار حديث من المتصفّح؟ يمكن معالجة هذه التراجعات بشكل أسرع بكثير، خاصةً إذا قدّمت رقمًا للإصدار الذي عمل فيه الاختبار وآخر تعذّر فيه. يمكنك استخدام أدوات، مثل BrowserStack، للتحقّق من إصدارات المتصفّح القديمة. استخدِم أدوات مثل أداة bisect-builds (لنظام التشغيل Chromium) للبحث عن التغيير.

إذا كانت المشكلة ناتجة عن تراجع في الأداء ويمكن إعادة إظهارها، يمكن عادةً العثور على السبب الأساسي وحلّه بسرعة.

هل يواجه الآخرون المشكلة نفسها؟

إذا كنت تواجه مشاكل، من المرجّح أنّ المطوّرين الآخرين يواجهونها أيضًا. أولاً، حاوِل البحث عن الخطأ على Stack Overflow. قد يساعدك ذلك في ترجمة مشكلة مجردة إلى واجهة برمجة تطبيقات معيّنة متعطّلة، وقد يساعدك في العثور على حلّ بديل قصير المدى إلى أن يتم حلّ الخطأ.

هل تم الإبلاغ عن هذا المحتوى من قبل؟

بعد أن تتبيّن لك المشكلة، يمكنك البحث في قاعدة بيانات أخطاء المتصفّح لمعرفة ما إذا سبق أن تم الإبلاغ عن الخطأ.

إذا عثرت على خطأ حالي يصف المشكلة، يمكنك التعبير عن دعمك من خلال وضع علامة عليه كخطأ مهم أو إضافة تعليق عليه أو إضافته إلى المفضلة. وفي العديد من المواقع الإلكترونية، يمكنك إضافة نفسك إلى قائمة النسخة الاحتياطية والحصول على آخر المعلومات عند تغيير الخطأ.

إذا قرّرت التعليق على الخطأ، يُرجى تضمين معلومات عن كيفية تأثير الخطأ في موقعك الإلكتروني. تجنَّب إضافة تعليقات بأسلوب "+1"، لأنّ أدوات تتبُّع الأخطاء عادةً ما ترسل رسائل إلكترونية بشأن كل تعليق.

الإبلاغ عن الخطأ

إذا لم يتم الإبلاغ عن الخطأ من قبل، عليك إبلاغ موفِّر المتصفّح بهذا الخطأ.

إنشاء نموذج اختبار مُبسَّط

تقدّم Mozilla مقالة رائعة عن كيفية إنشاء نموذج اختبار مصغر. باختصار، على الرغم من أنّ وصف المشكلة يشكّل بداية رائعة، لا يوجد ما هو أفضل من تقديم عرض توضيحي مرتبط في الخطأ يوضّح المشكلة. لزيادة فرص تحقيق تقدّم سريع، يجب أن يحتوي المثال على الحد الأدنى من الرمز البرمجي المطلوب لعرض المشكلة. إنّ توفير رمز برمجي أساسي هو أهم إجراء يمكنك اتّخاذه لزيادة احتمالات حلّ الخطأ.

في ما يلي بعض النصائح لتقليل عدد حالات الاختبار:

  • نزِّل صفحة الويب وأضِف إليها <base href="https://original.url"> وتأكَّد من توفّر الخطأ على الجهاز. قد يتطلّب ذلك خادم HTTPS مباشرًا إذا كان عنوان URL يستخدم بروتوكول HTTPS.
  • اختبِر الملفات المحلية على أحدث إصدارات أكبر عدد ممكن من المتصفّحات.
  • حاوِل تجميع كل المحتوى في ملف واحد.
  • أزِل الرمز البرمجي (بدءًا من العناصر التي تعرف أنّها غير ضرورية) إلى أن يتم معالجة الخطأ.
  • استخدِم ميزة التحكّم في الإصدارات حتى تتمكّن من حفظ عملك وإلغاء أي أخطاء تقع فيها.

استضافة حالة اختبارية مصغرة

إذا كنت تبحث عن مكان جيد لاستضافة نموذج الاختبار المصغّر، تتوفّر عدة أماكن جيدة:

يُرجى العِلم أنّ العديد من هذه المواقع الإلكترونية تعرض المحتوى في إطار 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)

لمزيد من المعلومات، يمكنك الاطّلاع على إرشادات كتابة تقارير الأخطاء على MDN.

إضافة لقطة شاشة أو تسجيل شاشة للمشكلة

على الرغم من أنّه ليس مطلوبًا، إلا أنّه غالبًا ما يكون من المفيد إضافة لقطة شاشة أو تسجيل رقمي للشاشة يعرضان المشكلة. ويُعدّ ذلك مفيدًا بشكل خاص عند حدوث أخطاء بعد عدة خطوات أو عند حدوث نشاط غير معتاد. يمكن أن توضّح لقطات الشاشة وتسجيلات الشاشة مهندسي المتصفّحات ما حدث في كثير من الأحيان بشكل أفضل.

تضمين تفاصيل عن البيئة

لا يمكن إعادة إنتاج بعض الأخطاء إلا على أنظمة تشغيل معيّنة أو على أنواع معيّنة من الشاشات فقط (على سبيل المثال، شاشات بدرجة كثافة بكسل منخفضة أو عالية). احرص على تضمين تفاصيل أي بيئات اختبار استخدمتها.

إرسال الخطأ

أخيرًا، أرسِل الخطأ. يُرجى مراجعة بريدك الإلكتروني للاطّلاع على الردود بشأن الخطأ. قد يطرح المهندسون عادةً أسئلة إضافية أثناء التحقيق. إذا الصعوبة في إعادة إنتاج المشكلة، قد يتواصل معك الفريق.