ویژگی‌های جدید DevTools (کروم ۱۴۷)

منتشر شده: ۷ آوریل ۲۰۲۶

کروم ۱۴۷ انتخاب خودکار متن برای کمک هوش مصنوعی را معرفی می‌کند، پیشنهادهای کد را به تکمیل کامل کد ارتقا می‌دهد، نوار ابزار حالت دستگاه را مدرن می‌کند، رمزگشایی خودکار بدنه‌های شبکه فشرده را به ارمغان می‌آورد و چندین پیشرفت دیگر را نیز به همراه دارد.

انتخاب خودکار زمینه در دستیار هوش مصنوعی

صفحه شروع به‌روزرسانی‌شده‌ی پنل دستیار هوش مصنوعی.

یکی از مهمترین درخواست‌های ویژگی برای کمک هوش مصنوعی، امکان پرسیدن سوالات بازتر بود. یک عامل انتخاب زمینه جدید اکنون به شما امکان می‌دهد بدون انتخاب زمینه قبلی ، سوالاتی بپرسید، به عنوان مثال:

  • «کندترین درخواست‌های شبکه در این صفحه کدامند؟» پیش از این، این امکان وجود نداشت زیرا مجبور بودید یک درخواست شبکه خاص را انتخاب کنید.
  • «چه مشکلات عملکردی در صفحه وجود دارد؟» DevTools اکنون به طور خودکار ردیابی را با تنظیمات انتخابی شما ثبت می‌کند تا به این سوال پاسخ دهد.
  • «چطور از پنل انیمیشن استفاده کنم؟» یا «تنظیم کنتراست بالا در DevTools کجاست؟»، که مستقیماً در مورد خود DevTools کمک ارائه می‌دهد.

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

ابزارهای توسعه برای نمایندگان

سرور Chrome DevTools MCP و رابط خط فرمان (CLI) به نسخه 0.21.0 به‌روزرسانی شده‌اند که بهبودهای قابل‌توجهی را برای گردش‌های کاری چندعاملی، قابلیت‌های جدید حسابرسی از طریق Lighthouse و مجموعه‌ای از مهارت‌های پیشرفته به ارمغان می‌آورد.

ویژگی‌های کلیدی اضافه شده از آخرین به‌روزرسانی عبارتند از:

  • ممیزی‌های یکپارچه Lighthouse: اکنون می‌توانید ممیزی‌های Lighthouse را مستقیماً از طریق MCP اجرا کنید و بررسی‌های خودکار عملکرد و کیفیت را در گردش‌های کاری agentic خود فعال کنید.
  • مهارت تشخیص نشت حافظه : مهارت جدیدی برای تشخیص نشت حافظه با استفاده از ابزار take_memory_snapshot اضافه شده است.
  • بهبود مهارت‌های دسترسی: مهارت اشکال‌زدایی دسترسی اصلاح شده است تا از Lighthouse بهتر استفاده شود و خروجی قوی‌تری ارائه دهد.
  • مهارت‌های عمومی استفاده: مهارت‌های اختصاصی برای نحوه استفاده از سرور Chrome DevTools MCP یا رابط خط فرمان (CLI) و نحوه عیب‌یابی نصب‌ها به نماینده شما کمک می‌کند تا بیشترین بهره را از DevTools برای نمایندگان ببرد.
  • پشتیبانی از گردش کار چند عاملی: معرفی مسیریابی pageId به چندین عامل اجازه می‌دهد تا به طور دقیق صفحات مرورگر خاص را هدف قرار داده و به طور موازی با آنها تعامل داشته باشند.

برای شروع استفاده از این ویژگی‌ها، مخزن گیت‌هاب را با جزئیات مربوط به یادداشت‌های انتشار بررسی کنید.

تولید کد

در کروم ۱۴۲، ما قابلیت پیشنهاد کد توسط Gemini را در پنل‌های Console و Sources معرفی کردیم. در کروم ۱۴۷، این قابلیت به تولید کامل کد ارتقا یافته است.

برای تولید کد، یک توضیح به زبان طبیعی بنویسید که منطق مورد نیاز شما را توصیف کند (برای مثال، // Loop to check all img elements for valid alt attributes ) و برای شروع تولید، Cmd + I (مک) یا Ctrl + I (ویندوز/لینوکس) را فشار دهید.

نوار ابزار حالت دستگاه به‌روزرسانی‌شده

نوار ابزار حالت دستگاه (Device Mode) مدرن شده است تا تجربه‌ای سازگارتر و ساده‌تر ارائه دهد:

  • کنترل‌های استاندارد : انتخاب دستگاه، سطوح بزرگنمایی و نسبت پیکسل دستگاه (DPR) اکنون از اجزای استاندارد رابط کاربری DevTools استفاده می‌کنند و قابلیت استفاده را بهبود می‌بخشند.
  • بزرگنمایی ساده‌تر : منوی بزرگنمایی اکنون مرتب‌تر شده است و گزینه «Fit to window» مستقیماً در فهرست درصدها ادغام شده است. «Auto-adjust zoom» به دکمه اختصاصی خود در نوار ابزار منتقل شده است.
  • پشتیبانی از قفل جهت‌گیری : DevTools اکنون API مربوط به screen.orientation.lock() را در شبیه‌سازی دستگاه مدیریت می‌کند. وقتی یک صفحه جهت‌گیری را قفل می‌کند، دستگاه شبیه‌سازی شده به طور خودکار می‌چرخد تا با جهت‌گیری قفل شده مطابقت داشته باشد و دکمه چرخش دستی در حین فعال بودن قفل غیرفعال می‌شود.

مشکلات کروم: ۴۰۸۰۷۲۹۰

اجسام فشرده رمزگشایی شده

تشخیص مشکلات مربوط به منابع فشرده‌شده اکنون بسیار آسان‌تر شده است. پیش از این، اگر یک درخواست HTTP از Content-Encoding: gzip یا deflate استفاده می‌کرد، نمای Payload در پنل Network به جای محتوای رمزگشایی‌شده، داده‌های دودویی درهم‌ریخته را نشان می‌داد.

در کروم ۱۴۷، DevTools به طور خودکار این بدنه‌های فشرده را رمزگشایی می‌کند و محتوای قابل خواندن را مستقیماً تحت Payload نمایش می‌دهد.

علاوه بر این، فهرست درخواست‌ها اکنون شامل اطلاعات اندازه انتقال نیز می‌شود که تصویر واضح‌تری از میزان مصرف داده از طریق سیم ارائه می‌دهد - جزئیاتی که دستیار هوش مصنوعی نیز از آن برای انتخاب بهتر درخواست‌ها استفاده می‌کند.

مشکلات کرومیوم: 356158096

فیلترهای عبارات منظم برای استایل‌ها

فیلتر جدید عبارات منظم در پنل Styles.

اکنون می‌توانید از عبارات منظم در نوارهای فیلتر پنل‌های Styles ، Computed و Properties استفاده کنید. برای فعال کردن، روی دکمه‌ی جدید تغییر وضعیت عبارات منظم ( .* ) کلیک کنید. سپس، برای مثال padding|border را تایپ کنید تا تمام ویژگی‌های padding و border هایلایت شوند.

مشکل کرومیوم: ۴۰۷۰۶۷۲۷

بهبود بارهای حدسی

اشکال‌زدایی پیش‌بارگذاری با ویژگی‌های جدید در پنل Application > Speculative loads قوی‌تر شده است:

  • فیلتر کردن متن : اکنون می‌توانید فهرست قوانین و تلاش‌ها را با استفاده از متن آزاد یا فیلترهای کلیددار (مثلاً url: action: status: :) با پشتیبانی از منطق AND بین چندین عبارت، فیلتر کنید.
  • دکمه پاک کردن : یک دکمه پاک کردن جدید به شما امکان می‌دهد مدل پیش‌بارگذاری را مجدداً تنظیم کنید و قوانین و تلاش‌های نمایش داده شده را پاک کنید.
  • کدهای وضعیت HTTP : برای پیش‌واکشی‌های ناموفق، DevTools اکنون به جای یک پیام عمومی مربوط به خرابی، کد وضعیت واقعی HTTP (مثلاً ۴۰۴) را هم در ستون وضعیت و هم در پنل جزئیات نشان می‌دهد.

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

متفرقه

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

  • کنسول : وقتی همه فریم‌های پشته درون‌خطی یک خطا در فهرست نادیده‌گرفته‌شده قرار می‌گیرند اما پشته فراخوانی شامل فریم‌های نادیده‌گرفته‌نشده است، اکنون یک دکمه تغییر وضعیت ظاهر می‌شود که به شما کمک می‌کند تا روی کد قابل اجرا تمرکز کنید و در عین حال ردپاهای کتابخانه‌ای پر سر و صدا را پنهان کنید ( 379788109 ).
  • عملکرد : وضعیت نوار کناری (باز/بسته) اکنون ثابت است؛ اگر نوار کناری را ببندید، در ضبط‌های بعدی بسته می‌ماند ( ۴۳۷۳۴۰۲۱۹ ).
  • تنظیمات : DevTools اکنون می‌تواند هنگام تغییر تنظیمات آزمایشی خاص، از طریق یک نوار اطلاعات از شما بخواهد مرورگر را مجدداً راه‌اندازی کنید.
  • بازرسی اشیاء : گزینه جدید «نمایش همه» در منوی زمینه در نمای اشیاء به شما امکان می‌دهد میزان نمایش ویژگی‌های nullish ( null یا undefined ) ( 41187256 ) را تغییر دهید.
  • عناصر : تزئین‌کننده‌ی «تبلیغات» دیگر محدود به آی‌فریم‌ها نیست و اکنون می‌تواند برای عناصر دلخواهی که توسط بک‌اند ( ۴۸۵۴۹۳۲۰۲ ) به عنوان مرتبط با تبلیغات برچسب‌گذاری شده‌اند، نمایش داده شود.
  • گره‌های دستورالعمل : گره‌های دستورالعمل پردازش (مانند <?xml-stylesheet ... ?> ) اکنون در درخت DOM قابل مشاهده و ویرایش هستند ( ۴۸۴۸۹۱۶۷۵ )

دسترسی‌پذیری

این نسخه چندین بهبود در دسترسی‌پذیری را به همراه دارد:

  • عملکرد : دکمه‌ی راهنمای عنوان در کارت‌های معیار عملکرد، اکنون همیشه قابل مشاهده و از طریق صفحه‌کلید قابل دسترسی است، به جای اینکه فقط با نگه داشتن ماوس ( 487613506 ) ظاهر شود.
  • منابع : اکنون می‌توان نقاط توقف شنونده رویداد را با استفاده از کلید فاصله ( ۴۷۸۸۹۰۱۸۲ ) علامت زد یا علامت آن را برداشت.
  • تنظیمات : کلیدهای Home و End اکنون برای پیمایش به اولین و آخرین موارد لیست میانبر ( ۴۸۱۷۴۷۲۵۶ ) کار می‌کنند.
  • فانوس دریایی : اعلان‌های صفحه‌خوان برای کادرهای انتخاب گروه‌های دسته‌بندی بهبود یافته است ( ۴۷۷۶۴۳۹۰۹ ).