الميزات الجديدة في أدوات مطوّري البرامج (Chrome 112)

Sofia Emelianova
Sofia Emelianova
GitHub
Jecelyn Yeen

تحديثات "المسجّلة الذكية"

التوافق مع إضافات إعادة التشغيل

توفّر أداة Recorder خيارات إعادة تشغيل مخصّصة يمكنك تضمينها في "أدوات مطوّري البرامج" باستخدام إضافة.

جرِّب مثال الإضافة. اختَر خيار إعادة التشغيل المخصّصة الجديد لفتح واجهة مستخدم إعادة التشغيل المخصّصة.

واجهة مستخدم مخصّصة لإعادة التشغيل

لتخصيص أداة التسجيل وفقًا لاحتياجاتك ودمجها مع أدواتك، ننصحك بتطوير إضافة خاصة بك: استكشِف واجهة برمجة التطبيقات chrome.devtools.recorder API واطّلِع على المزيد من أمثلة الإضافات.

مشكلة Chromium: ‏ 1400243

التسجيل باستخدام أدوات اختيار المقاطع

بالإضافة إلى أدوات اختيار مخصّصة وCSS وARIA والنص وXPath، يمكنك الآن التسجيل باستخدام أدوات اختيار pierce. تعمل أدوات الاختيار هذه مثل أدوات اختيار CSS، ولكن يمكنها أيضًا اختراق جذور الظل.

ابدأ تسجيلًا جديدًا على صفحة تتضمّن shadow DOM وضَع علامة في المربّع بجانب مربّع اختيار اختراق في أنواع أدوات الاختيار المُستخدَمة أثناء التسجيل. سجِّل تفاعلك مع العناصر في shadow DOM وتحقّق من الخطوة المقابلة.

ضبط "المسجّلة الذكية" لاستخدام أدوات اختيار المقاطع الصوتية، واستخدام أداة اختيار المقاطع الصوتية

مشكلة Chromium: ‏ 1411188

التصدير كنص برمجي من مكتبة Puppeteer مع تحليل Lighthouse

تقدّم المسجّلة الذكية خيارًا جديدًا للتصدير: Puppeteer (بما في ذلك تحليل Lighthouse). باستخدام Puppeteer، يمكنك التشغيل الآلي لمتصفّح Chrome والتحكّم فيه. باستخدام Lighthouse، يمكنك قياس أداء موقعك الإلكتروني وتحسينه.

افتح التسجيل، وانقر على تصدير. تصدير، واختَر الخيار الجديد، واحفظ ملف .js.

تصدير Puppeteer (بما في ذلك تحليل Lighthouse)

شغِّل نص Puppeteer البرمجي للحصول على تقرير Lighthouse في ملف flow.report.html.

تم فتح تقرير Lighthouse في Chrome.

الحصول على الإضافات

استكشِف خيارات تخصيص تجربة المُسجِّل، على سبيل المثال، باستخدام خيارات التصدير المخصّصة. يمكنك الحصول على إضافات للمسجل من خلال النقر على تصدير. تصدير > الحصول على إضافات في أحد التسجيلات.

خيار "الحصول على الإضافات" في القائمة المنسدلة "التصدير"

يمكنك إضافة إضافة خاصة بك إلى قائمة إضافات أداة التسجيل. نتطلّع إلى رؤية تطبيقك في القائمة.

مشاكل Chromium: 1417104 و1413168

العناصر > تعديلات الأنماط

مستندات CSS

كم مرة في اليوم تبحث عن مستندات حول مواقع CSS؟ تعرض لك الآن لوحة العناصر > الأنماط وصفًا موجزًا عند تمرير مؤشر الماوس فوق موقع.

تلميح يتضمن مستندات حول خاصية CSS

تتضمّن التلميح أيضًا رابط مزيد من المعلومات ينقلك إلى مرجع CSS في MDN حول هذا الموقع الإلكتروني.

إذا كنت على دراية بتنسيق CSS جيدًا، قد ترى أنّ نصائح التلميح مزعجة. لإيقاف هذه الإعدادات كلها، ضَع علامة في المربّع مربّع اختيار عدم العرض.

لإعادة تفعيلها، انتقِل إلى الإعدادات. الإعدادات > الإعدادات المفضّلة > العناصر > مربّع اختيار عرض التلميح في مستندات CSS.

مشكلة Chromium: 1401107

إتاحة دمج CSS

تتعرّف الآن لوحة العناصر > الأنماط على بنية تداخل CSS وتطبّق الأنماط المُدمجة على العناصر الصحيحة.

مشكلة في Chromium: 1172985

وضع علامة على نقاط تسجيل البيانات ونقاط الإيقاف المشروطة في وحدة التحكّم

لتحسين تجربة المستخدم المحسّنة لنقاط التوقف، تضع Console الآن علامة على الرسائل التي يتم تشغيلها من خلال نقاط التوقف:

تغييرات على طريقة عرض Console للرسائل التي يتم تشغيلها من خلال نقاط التوقف: باستخدام الرموز ورابط المصدر المناسب

تمنحك وحدة التحكّم الآن روابط مناسبة للعناصر الثابتة إلى نقاط التوقف في الملفات المصدر بدلاً من نصوص برمجية VM<number> التي ينشئها Chrome لتشغيل أي جزء من JavaScript على V8.

انقر على الرابط بجانب رسالة نقطة التوقف للانتقال مباشرةً إلى محرِّر نقاط التوقف.

رابط الربط بجانب رسالة نقطة تسجيل تفتح محرِّر نقاط التوقف

مشكلة Chromium: 1027458

تجاهُل النصوص البرمجية غير ذات الصلة أثناء تصحيح الأخطاء

لمساعدتك في التركيز على الأجزاء الأكثر أهمية من الرمز البرمجي، يمكنك الآن إضافة النصوص البرمجية غير ذات الصلة إلى قائمة التجاهل مباشرةً من شجرة الملفات في لوحة المصادر > الصفحة.

انقر بزر الماوس الأيمن على أي نص برمجي أو مجلد واختَر أحد الخيارات ذات الصلة بالتجاهل. قد تظهر لك خيارات لإضافة النص البرمجي أو المجلد إلى القائمة أو إزالتهما منها. يتجاهل برنامج تصحيح الأخطاء النصوص البرمجية التي تمت إضافتها إلى القائمة ويحذفها من تسلسل استدعاء الدوال البرمجية.

قوائم السياق لمجلد ونص برمجي تتضمّن خيارات متعلّقة بالتجاهل

تظهر جميع النصوص البرمجية والمجلدات المُدرَجة في قائمة التجاهل باللون الرمادي في شجرة الملفات.

تظهر النصوص البرمجية والمجلدات المُدرَجة في قائمة &quot;الملفات التي يتم تجاهلها&quot; باللون الرمادي، ويمكنك إخفاؤها باستخدام خيار تجريبي في القائمة المنسدلة &quot;خيارات إضافية&quot;.

إذا اخترت نصًا برمجيًا تم تجاهله، سينقلك الزر إعداد إلى الإعدادات. الإعدادات > قائمة التجاهل. يمكنك أيضًا إخفاء المصادر التي تم تجاهلها من شجرة الملفات باستخدام قائمة الخيارات الإضافية > إخفاء المصادر المدرَجة بقائمة التجاهل تجريبية..

مشكلة Chromium: ‏ 883325

بدأ إيقاف أداة "تحليل JavaScript" نهائيًا

منذ إصدار Chrome 58، خطط فريق "أدوات المطوّرين" لإيقاف أداة تحليل JavaScript نهائيًا وحثّ مطوّري Node.js وDeno على استخدام لوحة الأداء لتحليل أداء JavaScript في وحدة المعالجة المركزية.

يبدأ إصدار DevTools هذا (112) عملية إيقاف أداة تحليل JavaScript نهائيًا على مراحل أربع. تعرِض لوحة أداة تحليل JavaScript الآن بانر التحذير المقابل.

بانر الإيقاف النهائي في أعلى &quot;أداة تحليل الأداء&quot;

بدلاً من أداة تحليل الأداء، استخدِم لوحة الأداء لإنشاء ملف تعريف لوحدة المعالجة المركزية.

يمكنك الاطّلاع على مزيد من المعلومات وتقديم الملاحظات في RFC وcrbug.com/1354548.

مشكلة Chromium: 1417647

محاكاة التباين المخفَّض

تضيف علامة التبويب العرض خيارًا جديدًا إلى قائمة محاكاة عيوب الرؤية، وهو التباين المخفَّض. باستخدام هذا الخيار، يمكنك معرفة كيف سيظهر موقعك الإلكتروني للأشخاص الذين يعانون من انخفاض في حساسية التباين.

خيار التباين المخفَّض المحدَّد ضمن وظيفة &quot;محاكاة عيوب الرؤية&quot;

يُرجى العِلم أنّه تم تعديل خيارات القائمة لإعلامك بدرجة عدم الحساسية للألوان التي تمثّلها الخيارات.

باستخدام "أدوات مطوّري البرامج"، يمكنك العثور على جميع مشاكل التباين وإصلاحها في آنٍ واحد. لمزيد من المعلومات، يُرجى الاطّلاع على مقالة جعل موقعك الإلكتروني أكثر سهولة في القراءة.

مشاكل Chromium: 1412719 و1412721

Lighthouse 10

تعمل لوحة Lighthouse الآن على Lighthouse 10.0.1. لمزيد من التفاصيل، يُرجى الاطّلاع على الميزات الجديدة في Lighthouse 10.0.1.

للتعرّف على أساسيات استخدام لوحة Lighthouse في أدوات مطوّري البرامج، اطّلِع على مقالة Lighthouse: تحسين سرعة الموقع الإلكتروني.

Lighthouse > الإعدادات. > مربّع اختيار فارغ التنقّل القديم غير مفعّل الآن تلقائيًا. يستخدم هذا الخيار إعدادات Lighthouse القديمة في وضع التنقّل.

تم إيقاف وضع التنقّل القديم.

يستخدم الإصدار 10 من Lighthouse الآن جهاز Moto G Power كـ جهاز المحاكاة التلقائي. أضافت أدوات المطوّرين هذا الجهاز إلى الإعدادات. الإعدادات > الأجهزة.

‫Moto G Power في قائمة &quot;الأجهزة&quot;

مشكلة Chromium: ‏ 772558

تحذير في وحدة التحكّم لإزالة معالِج جلب عامل الخدمة الذي لا يُجري أيّ عمليات

يتخطّى Chrome 112 معالِجات جلب مشغّل الخدمة التي لا تُجري أيّ عملية لأنّها قد تبطئ التنقّل بدون أن تحقّق أي غرض. لم تعُد هذه المعالِجات مطلوبة لكي يكون موقعك الإلكتروني مؤهلاً ليكون تطبيق ويب تقدّميًا.

تعرض وحدة التحكّم الآن تحذيرًا إذا عثرت على معالِج جلب لا يُجري أيّ عمليات على موقعك الإلكتروني. ننصحك بإزالته.

معالِج جلب لا يُجري أيّ عملية والتحذير المقابل في وحدة التحكّم

مشكلة Chromium: 1347319

لحظات مميّزة متنوعة

في ما يلي بعض الإصلاحات البارزة في هذا الإصدار:

  • تعرض الآن لوحة المصادر > نقاط التوقف مسارات الملفات المختلفة بجانب أسماء الملفات المُبهمة (1403924).
  • يحدِّد الآن القسم الرئيسي في الرسم البياني للّهب في لوحة الأداء القيمة CpuProfiler::StartProfiling على أنّها Profiler Overhead (1358602).
  • تحسينات على ميزة "الإكمال التلقائي" في "أدوات مطوّري البرامج":
    • المصادر: عمليات إكمال متسقة لأي كلمة (1320204).
    • Console: يختار Arrow down الاقتراح الأول، وتحصل الاقتراحات على Tab تلميحات (1276960).
  • أضافت أدوات المطوّرين نقطة فاصلة لأداة معالجة الحدث للسماح لك بالتوقف مؤقتًا عند فتح نافذة "نافذة ضمن نافذة" للمستند (1315352).
  • أعدّت أدوات المطوّرين حلًا بديلاً يعرض بشكل صحيح عناصر حِزم Webpack في Vue2 على أنّها JavaScript (1416562).
  • تم تغيير اسم أحد إعدادات وحدة التحكّم ليصبح "توسيع رسائل console.trace() تلقائيًا". (1139616).

تنزيل قنوات المعاينة

ننصحك باستخدام إصدار Canary أو Dev أو الإصدار التجريبي من Chrome كمتصفّح التطوير التلقائي. تتيح لك قنوات المعاينة هذه الوصول إلى أحدث ميزات DevTools، وتتيح لك اختبار واجهات برمجة تطبيقات منصات الويب المتطوّرة، وتساعدك في العثور على المشاكل في موقعك الإلكتروني قبل أن يعثر عليها المستخدمون.

التواصل مع فريق "أدوات مطوّري البرامج في Chrome"

استخدِم الخيارات التالية لمناقشة الميزات الجديدة أو التحديثات أو أي شيء آخر مرتبط بـ "أدوات مطوّري البرامج".

الميزات الجديدة في "أدوات المطوّرين"

قائمة بكل ما تم تناوله في سلسلة الميزات الجديدة في أدوات مطوّري البرامج