چیزهای جدید در DevTools (Chrome 108)

جسلین ین

نکاتی برای ویژگی های غیر فعال CSS

DevTools اکنون سبک‌های CSS را شناسایی می‌کند که معتبر هستند اما اثر قابل مشاهده ندارند. در قسمت Styles ، DevTools ویژگی‌های غیرفعال را محو می‌کند. نشانگر را روی نماد کنار آن نگه دارید تا متوجه شوید که چرا این قانون اثر قابل مشاهده ندارد.

نکاتی برای ویژگی های غیر فعال CSS.

شماره کرومیوم: 1178508

شناسایی خودکار XPath و انتخابگرهای متن در پانل Recorder

اکنون پنل Recorder از XPath و انتخابگرهای متن پشتیبانی می کند. ضبط یک جریان کاربر را شروع کنید و ضبط کننده به طور خودکار XPath و کوتاه ترین متن منحصر به فرد یک عنصر را در صورت وجود به عنوان انتخابگر انتخاب می کند.

انتخابگرهای XPath و متن در پنل Recorder.

مسائل Chromium: 1327206 ، 1327209

از عبارات جدا شده با کاما عبور کنید

اکنون می توانید در حین اشکال زدایی از عبارات جدا شده با کاما عبور کنید. این امر اشکال زدایی کدهای کوچک شده را بهبود می بخشد.

از عبارات جدا شده با کاما عبور کنید.

قبلاً، DevTools فقط از گام برداشتن در عبارات جدا شده با نقطه ویرگول پشتیبانی می کرد.

با توجه به کد زیر،

function foo() {}

function bar() {
  foo();
  foo();
  return 42;
}

ترانسپایلرها و مینی‌فایرها ممکن است آنها را به عبارات جدا شده با کاما تبدیل کنند.

function bar(){return foo(),foo(),42}

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

موضوع کرومیوم: 1370200

تنظیم لیست نادیده گرفتن بهبود یافته است

به Settings > Ignore List بروید. DevTools طراحی را بهبود می بخشد تا به شما کمک کند قوانین را برای نادیده گرفتن یک اسکریپت یا الگوی اسکریپت ها پیکربندی کنید.

تب فهرست نادیده گرفتن.

شماره کرومیوم: 1356517

نکات برجسته متفرقه

اینها برخی از اصلاحات قابل توجه در این نسخه هستند:

  • تکمیل خودکار نام ویژگی CSS در پانل Styles با فشار دادن فاصله. ( 1343316 )
  • اسکرول خودکار را در بخش پنل عنصر حذف کنید. ( 1369734 )

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

استفاده از Chrome Canary ، Dev یا Beta را به عنوان مرورگر توسعه پیش‌فرض خود در نظر بگیرید. این کانال‌های پیش‌نمایش به شما امکان می‌دهند به جدیدترین ویژگی‌های DevTools دسترسی داشته باشید، APIهای پلت‌فرم وب پیشرفته را آزمایش کنید و قبل از اینکه کاربرانتان این کار را انجام دهند، مشکلات موجود در سایت خود را پیدا کنید!

تماس با تیم Chrome DevTools

از گزینه های زیر برای بحث در مورد ویژگی ها و تغییرات جدید در پست یا هر چیز دیگری مربوط به DevTools استفاده کنید.

  • پیشنهاد یا بازخورد خود را از طریق crbug.com برای ما ارسال کنید.
  • با استفاده از گزینه های بیشتر ، مشکل DevTools را گزارش کنیدبیشتر > راهنما > گزارش مشکلات DevTools در DevTools.
  • توییت در @ChromeDevTools .
  • نظرات خود را در مورد ویدیوهای YouTube DevTools یا نکات DevTools در YouTube ما بنویسید.

چیزهای جدید در DevTools

فهرستی از همه چیزهایی که در سری چیزهای جدید در DevTools پوشش داده شده است.