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

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

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

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

اطّلِع على مستندات واجهة برمجة التطبيقات ذات الصلة على 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.

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

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

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

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

إرسال الخطأ

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