مسائل: پیدا کردن و رفع مشکلات

پانل مشکلات در Chrome DevTools خستگی اعلان ها و درهم ریختگی کنسول را کاهش می دهد. از آن برای یافتن راه حل برای مشکلات شناسایی شده توسط مرورگر، مانند مشکلات کوکی و محتوای مختلط استفاده کنید.

در حال حاضر، پنل Issues پشتیبانی می کند:

نسخه‌های آینده Chrome از انواع مشکلات بیشتری پشتیبانی خواهند کرد.

پانل Issues را باز کنید

  1. از صفحه ای که مشکلاتی برای رفع آن وجود دارد، مانند samesite-sandbox.glitch.me بازدید کنید.
  2. DevTools را باز کنید .
  3. روی دکمه Open Issues کنار کلیک کنید تنظیمات. تنظیمات در گوشه سمت راست نوار اقدام در بالا. بسته به شدت مشکل، دکمه می تواند قرمز باشد خطا. ، رنگ زرد هشدار. ، یا آبی اطلاعات. آیکون.

    دکمه Open Issues با نماد قرمز.

    از طرف دیگر، Issues را از قسمت انتخاب کنید منوی ابزارهای بیشتر منوی ابزارهای بیشتر

    پانل Issues در منوی More tools.

  4. هنگامی که در پانل مشکلات قرار گرفتید، ممکن است بخواهید صفحه را مجدداً بارگیری کنید تا مشکلات بیشتری را که این بار در حین بارگذاری صفحه رخ می دهد، مشاهده کنید.

    پانل Issues با یک مشکل دیگر پس از بارگیری مجدد صفحه پیدا شد.

کنسول همچنین ممکن است مشکلات گزارش شده توسط مرورگر را به شما نشان دهد. با این حال، متوجه خواهید شد که درک چنین مسائلی (مانند هشدار کوکی در تصویر زیر) دشوار است. مشخص نیست برای رفع آن چه کاری باید انجام دهید.

کنسول با یک هشدار کوکی مبهم.

از طرف دیگر، پنل Issues بینش عملی را در اختیار شما قرار می دهد.

موارد را در پانل مسائل مشاهده کنید

پانل Issues اخطارهای مرورگر را به روشی ساختاریافته، تجمیع‌شده و عملی ارائه می‌دهد.

  1. برای گسترش مشکل و دریافت راهنمایی در مورد نحوه رفع آن و یافتن منابع تحت تأثیر، روی موردی در پانل «مشکلات» کلیک کنید.

    پانل مشکلات با یک مشکل کوکی بین سایتی گسترش یافت.

    هر مورد دارای چهار جزء است:

    • عنوانی که موضوع را توضیح می دهد.
    • شرحی که زمینه و راه حل را ارائه می دهد.
    • یک بخش منابع تحت تأثیر که به منابعی در زمینه DevTools مناسب مانند شبکه ، منابع ، عناصر و پانل های دیگر پیوند دارد.
    • پیوندهایی برای راهنمایی بیشتر
  2. برای مشاهده مسائل در زمینه، روی موارد موجود در منابع تحت تأثیر کلیک کنید.

گروه بندی مسائل بر حسب نوع

پانل Issues تعداد منابع تحت تأثیر را برای هر شماره شمارش می کند و آن را در کنار عنوان آنها نشان می دهد. علاوه بر این، می توانید مسائل را بر اساس شدت آنها در سه نوع گروه سازماندهی کنید:

  • خطا. خطاهای صفحه ای که Chrome گزارش می کند.
  • هشدار. شکستن تغییرات مانند منسوخ شدن.
  • اطلاعات. بهبودهایی که DevTools پیشنهاد می کند.

برای گروه بندی مسائل، بررسی کنید چک باکس. گروه بندی بر اساس نوع در نوار اقدام در بالای پانل مسائل .

مسائل در سه نوع دسته بندی می شوند: خطاهای صفحه، تغییرات شکسته، و بهبودها.

شامل مسائل شخص ثالث

پانل Issues به طور پیش فرض مشکلات کوکی های شخص ثالث را نشان می دهد.

می‌توانید مشکلات کوکی‌های شخص ثالث را در بخش منابع متأثر بدون پیوند بیابید.

کوکی شخص ثالث بدون منبع پیوندی در بخش منابع تحت تأثیر.

برای پنهان کردن چنین مسائلی، روشن کنید پاک کردن مشکلات کوکی شخص ثالث را در نوار اقدام در بالای پانل مشکلات وارد کنید.

مسائل را پنهان کنید

برای مخفی کردن یک مشکل، گزینه Hide مسائلی مانند این را از قسمت انتخاب کنید منوی سه نقطه منوی سه نقطه در کنار شماره.

در منوی سه نقطه‌ای که در کنار یک مشکل قرار دارد، گزینه Hide مسائلی مانند این وجود دارد.

برای دیدن لیست مشکلات پنهان، به قسمت Hidden مسائل اسکرول کرده و آن را گسترش دهید.

بخش مسائل پنهان

برای آشکار کردن همه مشکلات، روی Unhide all کلیک کنید. برای فاش کردن یک مشکل خاص، Unhide Problems like this را از قسمت انتخاب کنید منوی سه نقطه منوی سه نقطه در کنار شماره.

علاوه بر این، با فعال بودن گروه‌بندی ، می‌توانید کل گروه‌های مسائل را با استفاده از همان منوی سه نقطه در کنار یک گروه پنهان کنید.

منوی سه نقطه با گزینه ای برای پنهان کردن گروه Improvements.

مسائل را در زمینه مشاهده کنید

برای بررسی یک موضوع:

  1. در بخش AFFECTED RESOURCES ، روی پیوند منبع کلیک کنید تا مورد را در زمینه مناسب در DevTools مشاهده کنید. در این مثال، روی samesite-sandbox.glitch.me کلیک کنید تا کوکی های پیوست شده به آن درخواست را نشان دهید. پیوند شما را به پنل شبکه می برد.

    بخش Affected Resources با پیوندی به درخواست تحت تأثیر.

  2. برای مشاهده مورد دارای مشکل، پیمایش کنید: در این مورد، کوکی ck02 . ماوس را روی اطلاعات. نماد اطلاعات در سمت راست برای مشاهده مشکل و نحوه رفع آن.

    هنگامی که ماوس را روی نماد اطلاعات می‌برید، پانل شبکه یک راهنمای ابزار را نشان می‌دهد.