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

Kayce Basques

مرحبًا في ما يلي الميزات الجديدة في أدوات مطوّري البرامج في Chrome في الإصدار 76 من Chrome.

الإكمال التلقائي باستخدام قيم CSS

عند إضافة تعريفات الأنماط إلى عقدة DOM، يكون من الأسهل أحيانًا تذكُّر قيمة التعريف مقارنةً باسم التعريف. على سبيل المثال، عند جعل عقدة <p> غامقة، قد يكون من السهل remembered تذكر القيمة bold أكثر من الاسم font-weight. تتيح واجهة مستخدم الإكمال التلقائي في لوحة "الأنماط" الآن قيم CSS. إذا كنت تتذكر قيمة الكلمة الرئيسية التي تريدها، ولكن لا يمكنك تذكُّر اسم الموقع، حاوِل typing the value and autocomplet

بعد كتابة &quot;غامق&quot;، تتم ميزة الإكمال التلقائي في لوحة &quot;الأنماط&quot; لعرض &quot;font-weight: bold&quot;.

الشكل 1. بعد كتابة bold، يتم إكمال لوحة "الأنماط" تلقائيًا لتصبح font-weight: bold.

يمكنك إرسال ملاحظاتك حول هذه الميزة الجديدة إلى المشكلة رقم 931145 في Chromium.

واجهة مستخدِم جديدة لإعدادات الشبكة

كانت لوحة "الشبكة" تواجه سابقًا مشكلة في سهولة الاستخدام، حيث كان يتعذّر الوصول إلى خيارات مثل قائمة "تقييد السرعة" عندما تكون نافذة DevTools ضيّقة. لحلّ هذه المشكلة وإزالة الازدحام في لوحة "الشبكة"، تم نقل بعض الخيارات الأقل استخدامًا إلى خلف لوحة إعدادات الشبكة الجديدة زر &quot;إعدادات الشبكة&quot;.

إعدادات الشبكة

الشكل 2. إعدادات الشبكة

تم نقل الخيارات التالية إلى إعدادات الشبكة: استخدام صفوف طلبات كبيرة والتجميع حسب الإطار وعرض نظرة عامة والتقاط لقطات شاشة. يربط الشكل 3 المواقع القديمة بالمواقع الجديدة.

ربط المواقع الجغرافية القديمة بالمواقع الجغرافية الجديدة

الشكل 3. ربط المواقع الجغرافية القديمة بالمواقع الجغرافية الجديدة

يمكنك إرسال ملاحظاتك حول تغيير واجهة المستخدم هذا إلى المشكلة رقم 892969 في Chromium.

رسائل WebSocket في عمليات تصدير HAR

عند تصدير ملف HAR من لوحة "الشبكة" لمشاركة سجلات الشبكة مع زملائك، يتضمّن ملف HAR الآن رسائل WebSocket. تبدأ السمة _webSocketMessages بشرطة تحتية للإشارة إلى أنّها حقل مخصّص.

...
"_webSocketMessages": [
  {
    "type": "send",
    "time": 1558730482.5071473,
    "opcode": 1,
    "data": "Hello, WebSockets!"
  },
  {
    "type": "receive",
    "time": 1558730482.5883863,
    "opcode": 1,
    "data": "Hello, WebSockets!"
  }
]
...

يمكنك إرسال ملاحظاتك حول هذه الميزة الجديدة إلى المشكلة رقم 496006 في Chromium.

أزرار استيراد وتصدير ملف HAR

يمكنك مشاركة سجلات الشبكة مع الزملاء بسهولة أكبر باستخدام الزرَّين الجديدَين تصدير الكل كملف HAR مع المحتوى تصدير واستيراد ملف HAR استيراد. كانت ميزة استيراد ملفات HAR وتصديرها متوفرة في DevTools منذ فترة. إنّ الأزرار التي يسهل العثور عليها هي التغيير الجديد.

أزرار HAR الجديدة

الشكل 4. أزرار HAR الجديدة

يُرجى إرسال ملاحظاتك حول تغيير واجهة المستخدم هذا إلى المشكلة رقم 904585 في Chromium.

إجمالي استخدام الذاكرة في الوقت الفعلي

تعرض لوحة "الذاكرة" الآن إجمالي استخدام الذاكرة في الوقت الفعلي.

إجمالي استخدام الذاكرة في الوقت الفعلي

الشكل 5. يوضّح أسفل لوحة "الذاكرة" أنّ الصفحة تستخدِم 43.4 ميغابايت من الذاكرة بالكامل. تشير القيمة 209 كيلوبايت في الثانية إلى أنّ إجمالي استخدام الذاكرة يزداد بمعدل 209 كيلوبايت في الثانية.

اطّلِع أيضًا على أداة مراقبة الأداء لتتبُّع استخدام الذاكرة في الوقت الفعلي.

يمكنك إرسال ملاحظاتك حول هذه الميزة الجديدة إلى المشكلة رقم 958177 في Chromium.

أرقام منافذ تسجيل ملفات تشغيل الخدمات

تتضمّن لوحة عمال الخدمة الآن أرقام المنافذ في عناوينها لتسهيل تتبُّع عامل الخدمة الذي تصحّح أخطاءه.

منافذ مشغِّل الخدمات

الشكل 6 منافذ مشغّل الخدمات

يُرجى إرسال ملاحظاتك حول تغيير واجهة المستخدم هذا إلى المشكلة رقم 601286 في Chromium.

فحص أحداث "جلب البيانات في الخلفية" و"المزامنة في الخلفية"

استخدِم قسم الخدمات التي تعمل في الخلفية الجديد في لوحة التطبيق لتتبُّع أحداث جمع البيانات في الخلفية والمزامنة في الخلفية. بما أنّ أحداث "جلب البيانات في الخلفية" و"مزامنة البيانات في الخلفية" تحدث في... الخلفية، لن يكون من المفيد جدًا أن تسجِّل "أدوات المطوّر" أحداث "جلب البيانات في الخلفية" و"مزامنة البيانات في الخلفية" فقط عندما تكون "أدوات المطوّر" مفتوحة. لذلك، بعد بدء التسجيل، سيستمر تسجيل أحداث "الاسترداد في الخلفية" و"المزامنة في الخلفية"، حتى بعد إغلاق علامة التبويب، وحتى بعد إغلاق Chrome.

انتقِل إلى لوحة التطبيق، وافتح علامة التبويب الاسترداد في الخلفية أو المزامنة في الخلفية، ثم انقر على تسجيل تسجيل لبدء تسجيل الأحداث. انقر على حدث للاطّلاع على مزيد من المعلومات عنه.

لوحة &quot;الاسترجاع في الخلفية&quot;

الشكل 7 لوحة "أداة استرجاع البيانات في الخلفية" العرض التقديمي الذي أعدّه ماكسيم سالنيكوف

لوحة &quot;المزامنة في الخلفية&quot;

الشكل 8. لوحة "المزامنة في الخلفية"

يمكنك إرسال ملاحظاتك حول هذه الميزات الجديدة إلى المشكلة رقم 927726 في Chromium.

Puppeteer لمتصفّح Firefox

‫Puppeteer for Firefox هو مشروع تجريبي جديد يتيح لك التشغيل الآلي لمتصفّح Firefox باستخدام واجهة برمجة التطبيقات Puppeteer API. بعبارة أخرى، يمكنك الآن التشغيل الآلي لمتصفّحَي Firefox وChromium باستخدام واجهة برمجة التطبيقات Node API نفسها، كما هو موضح في الفيديو أدناه.

بعد تشغيل node example.js، يتم فتح Firefox ويتم إدراج النص page في مربّع البحث على موقع مستندات Puppeteer الإلكتروني. بعد ذلك، تتم إعادة تنفيذ المهمة نفسها في Chromium.

يمكنك الاطّلاع على محاضرة Puppeteer التي قدّمها Joel وAndrey في مؤتمر Google I/O لعام 2019 لمعرفة المزيد من المعلومات حول Puppeteer وPuppeteer لتطبيق Firefox. يظهر إعلان Firefox في حوالي الساعة 4:05.

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

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

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

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

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

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