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

بالإضافة إلى ذلك، ستظهر الأخطاء المُسجَّلة أيضًا في تسجيل الجلسة ضمن علامة التبويب ‘Console’ في DevTools:

يدعم متتبّع OpenReplay تسجيل 3 أنواع من الأخطاء:

• الاستثناءات المُلتقَطة - Error
• الوعود المرفوضة - PromiseRejectionEvent
• أحداث الأخطاء (onError) - ErrorEvent

يمكن الإبلاغ عن جميع الأنواع المذكورة أعلاه باستخدام طريقة واحدة:

tracker.handleError(error, metaObject); // metaObject is optional and is a flat object

لنراجع مثالًا لكل نوع من أنواع الأخطاء:

بشكل افتراضي، لا تُسجَّل الاستثناءات المُلتقَطة في علامة التبويب ‘Console’. للإبلاغ عن خطأ، يمكننا القيام بما يلي:

try {
    // application code
}
catch(err) {
    // application code that handles the error
    tracker.handleError(error, metaObject); // metaObject is optional and is a flat object
}

إذا تم رفض وعد (Promise) وأردنا الإبلاغ عن الخطأ إلى OpenReplay، يمكننا القيام بما يلي:

function myFunc() {
    doSomeAsyncStuff()
    .then((result) => {
        // application code
    })
    .catch(promiseRejectionErr => {
        // application code to handle the error
        tracker.handleError(promiseRejectionErr, metaObject); // metaObject is optional and is a flat object     
    })
}

سيوضّح هذا المثال كيفية الإبلاغ عن خطأ في حال فشل تحميل عنصر <img>:

<img id="myImg" src="image.gif">
<p id="demo"></p>

document.getElementById("myImg").addEventListener("error", myFunction);

function myFunction(errorEvent) {
  document.getElementById("demo").innerHTML = "The image could not be loaded.";
  tracker.handleError(errorEvent, { context: "demo" });
}

إذا كانت لديك أي أسئلة حول هذه العملية، فلا تتردد في التواصل معنا عبر Slack الخاص بنا أو زيارة المنتدى الخاص بنا.