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

جسلین یین

سفارشی‌سازی میانبرهای صفحه‌کلید در DevTools

اکنون می‌توانید میانبرهای صفحه‌کلید را برای دستورات مورد علاقه خود در DevTools سفارشی کنید.

به تنظیمات > میانبرها بروید، ماوس را روی یک دستور نگه دارید و روی دکمه ویرایش (آیکون خودکار) کلیک کنید تا میانبر صفحه کلید را سفارشی کنید. همچنین می‌توانید آکورد (یا میانبرهای فشار دادن چند کلید) ایجاد کنید.

میانبرهای صفحه کلید را در DevTools سفارشی کنید.

مشکلات کرومیوم: ۱۳۳۵۲۷۴ ، ۱۷۴۳۰۹

تغییر تم‌های روشن و تیره با میانبر صفحه‌کلید

یک میانبر صفحه کلید برای تغییر راحت تم‌های روشن و تیره پیکربندی کنید. به طور پیش‌فرض، این عمل به هیچ میانبر صفحه کلیدی نگاشت نمی‌شود.

با استفاده از میانبر صفحه کلید، تم‌های روشن و تیره را تغییر دهید.

مشکلات کرومیوم: ۱۲۸۰۳۹۸ ، ۱۲۲۶۳۶۳

هایلایت کردن اشیاء C/C++ در Memory Inspector

بازرس حافظه تمام بایت‌های یک شیء حافظه C/C++ را هایلایت می‌کند.

تشخیص بایت‌های یک شیء در میان حافظه WebAssembly اطراف، یک مشکل اساسی بود. شما باید اندازه شیء را بدانید و بایت‌ها را از ابتدای شیء بشمارید.

با این ویژگی، به شما کمک می‌کند تا آنها را از حافظه اطراف تشخیص دهید. برای کسب اطلاعات بیشتر در مورد تغییرات، به بخش «گسترش بازرس حافظه برای اشکال‌زدایی C/C++» مراجعه کنید.

اشیاء C/C++ را در Memory Inspector هایلایت کنید.

مشکل کرومیوم: ۱۳۳۶۵۶۸

پشتیبانی از اطلاعات کامل آغازگر برای واردات HAR

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

اطلاعات آغازگر به توسعه‌دهندگان کمک می‌کند تا منشأ درخواست شبکه را ردیابی کرده و مشکلات مربوط به شبکه را شناسایی کنند.

پشتیبانی از اطلاعات کامل آغازگر برای واردات HAR.

مشکل کرومیوم: ۱۳۴۳۱۸۵

شروع جستجوی DOM پس از فشردن Enter

اکنون می‌توانید تنظیم « جستجو هنگام تایپ» را غیرفعال کنید تا همیشه جستجوی DOM پس از فشردن Enter شروع شود.

در پنل عناصر ، نوار جستجو را با Control یا Command + F فعال یا غیرفعال کنید. همانطور که یک عبارت جستجو را در کادر جستجو تایپ می‌کنید، درخت DOM به اولین عنصر منطبق پرش کرده و به طور پیش‌فرض آن را هایلایت می‌کند.

برای کاربران، به خصوص آزمایش‌کنندگانی که همیشه با جستجوهای طولانی کار می‌کنند، این رفتار ایده‌آل نیست. درخت DOM ممکن است هنگام تایپ یک جستجوی طولانی (مثلاً //div[@id="example"] ) چندین بار پرش کند. این رفتار باعث ایجاد حرکت غیرضروری می‌شود.

جستجوی DOM.

به تنظیمات > تنظیمات برگزیده بروید، جستجو هنگام تایپ را غیرفعال کنید. با این تغییر، جستجو فقط پس از فشردن کلید Enter شروع می‌شود.

تنظیمات جستجو هنگام تایپ.

مشکل کرومیوم: ۱۳۴۴۵۲۶

نمایش آیکون‌های start و end برای ویژگی‌های flexbox CSS align-content

در پنل Styles ، ویژگی‌های align-content را در یک کلاس CSS با display: flex یا display: inline-flex ویرایش کنید. start و end در منوی کشویی تکمیل خودکار با آیکون‌ها نمایش داده می‌شوند.

ویژگی‌های flexbox مربوط به align-content.

مشکل کرومیوم: ۱۱۳۹۹۴۵

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

  • تعداد صحیح پیام‌ها را در نوار کناری کنسول نمایش دهید. پیش از این، هنگام پاک کردن پیام‌های کنسول، تعداد پیام‌ها به‌روزرسانی نمی‌شد. ( ۱۳۴۳۳۱۱ )

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

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

با تیم Chrome DevTools تماس بگیرید

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

قابلیت‌های جدید در DevTools

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