اکثر مرورگرها با ابزارهای توسعه دهنده داخلی عرضه می شوند. این ابزارهای توسعه دهنده معمولاً شامل یک کنسول هستند. کنسول اطلاعاتی در مورد صفحه ای که در حال حاضر در حال اجرا است به شما می دهد.
پیام های وارد شده در کنسول یا از طرف توسعه دهندگان وب که صفحه را ساخته اند یا از خود مرورگر می آیند. همه پیام‌های کنسول دارای سطح شدت هستند: Verbose ، Info ، Warning یا Error . پیام Error به این معنی است که مشکلی در صفحه شما وجود دارد که باید آن را برطرف کنید.
چگونه ممیزی خطای مرورگر Lighthouse شکست می خورد
Lighthouse تمام خطاهای مرورگر ثبت شده در کنسول را علامت گذاری می کند:
نحوه رفع خطاهای مرورگر
هر خطای مرورگری را که Lighthouse گزارش می‌کند برطرف کنید تا اطمینان حاصل شود که صفحه شما مطابق انتظار برای همه کاربران شما اجرا می‌شود.
Chrome DevTools شامل چند ابزار برای کمک به ردیابی علت خطاها است:
- در زیر متن هر خطا، DevTools Console پشته تماسی را نشان می دهد که باعث اجرای کد مشکل ساز شده است.
- پیوندی در سمت راست بالای هر خطا، کدی را که باعث ایجاد خطا شده است را به شما نشان می دهد.
به عنوان مثال، این اسکرین شات صفحه ای را با دو خطا نشان می دهد:
در مثال، اولین خطا از یک توسعه‌دهنده وب از فراخوانی به console.error() می‌آید. خطای دوم از مرورگر می آید و نشان می دهد که متغیر مورد استفاده در یکی از اسکریپت های صفحه وجود ندارد.
در زیر متن هر خطا، DevTools Console پشته تماسی که خطا در آن ظاهر می شود را نشان می دهد. به عنوان مثال، برای اولین خطا، کنسول نشان می دهد که یک تابع (anonymous) به نام تابع init ، که تابع doStuff را نامیده است. با کلیک بر روی پیوند pen.js:9 در سمت راست بالای آن خطا، کد مربوطه را به شما نشان می دهد.
بررسی کد مربوطه برای هر خطا از این طریق می تواند به شما در شناسایی و رفع مشکلات احتمالی کمک کند.
اگر نمی توانید علت یک خطا را بفهمید، سعی کنید متن خطا را در موتور جستجو وارد کنید. اگر نمی توانید راه حلی برای مشکل خود بیابید، سؤالی را در Stack Overflow بپرسید.
اگر نمی‌توانید خطا را برطرف کنید، آن را در یک عبارت try…catch بپیچید تا به صراحت در کد نشان دهید که از مشکل آگاه هستید. همچنین می توانید از بلوک catch استفاده کنید تا خطا را با ظرافت بیشتری مدیریت کنید.