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

Kayce Basques

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

نسخة فيديو من هذه الصفحة

قيم مسبقة ذات معنى عند الإكمال التلقائي لدوال CSS

تستخدِم بعض خصائص CSS، مثل filter، دوالاً للقيم. على سبيل المثال، يؤدي الرمز filter: blur(1px) إلى إضافة تمويه بمقدار بكسل واحد إلى عقدة. عند الإكمال التلقائي للسمات، مثل filter، تملأ "أدوات مطوّري البرامج" السمة بقيمة ذات معنى حتى تتمكّن من معاينة نوع التغيير الذي ستحدثه القيمة في العقدة.

الشكل 1 سلوك الإكمال التلقائي القديم تُكمل "أدوات مطوّري البرامج" تلقائيًا إلى filter: blur ولا يظهر أي تغيير في إطار العرض.

الشكل 2 سلوك الإكمال التلقائي الجديد تُكمل "أدوات مطوّري البرامج" تلقائيًا إلى filter: blur(1px)، ويظهر التغيير في إطار العرض.

مشكلة ذات صلة في Chromium: #931145

محو بيانات الموقع الإلكتروني من "قائمة الأوامر"

اضغط على Control+Shift+P أو Command+Shift+P (في أجهزة Mac) لفتح "قائمة الأوامر" (Command Menu)، ثم نفِّذ الأمر محو بيانات الموقع الإلكتروني (Clear Site Data) لمحو جميع البيانات المرتبطة بالصفحة، بما في ذلك: برامج الخدمة وlocalStorage وsessionStorage وIndexedDB وWeb SQL وملفات تعريف الارتباط وذاكرة التخزين المؤقت وذاكرة التخزين المؤقت للتطبيقات.

الشكل 3 الأمر محو بيانات الموقع الإلكتروني

تتوفّر إمكانية محو بيانات الموقع الإلكتروني من خلال التطبيق > محو مساحة التخزين منذ فترة. تتيح لك الميزة الجديدة في Chrome 75 تشغيل الأمر من "قائمة الأوامر".

إذا كنت لا تريد حذف جميع بيانات الموقع الإلكتروني، يمكنك التحكّم في البيانات التي يتم حذفها من خلال التطبيق > محو مساحة التخزين.

الشكل 4 التطبيق > محو مساحة التخزين

مشكلة Chromium ذات الصلة: #942503

عرض جميع قواعد بيانات IndexedDB

في السابق، كان بإمكانك فحص قواعد بيانات IndexedDB من المصدر الرئيسي فقط من خلال التطبيق > IndexedDB. على سبيل المثال، إذا كان لديك <iframe> على صفحتك وكان هذا <iframe> يستخدم IndexedDB، لن تتمكّن من رؤية قواعد البيانات الخاصة به. اعتبارًا من الإصدار 75 من Chrome، تعرض "أدوات مطوّري البرامج" قواعد بيانات IndexedDB لجميع المصادر.

الشكل 5 السلوك القديم تضمّن الصفحة عرضًا توضيحيًا يستخدم IndexedDB، ولكن لا تظهر أي قواعد بيانات.

الشكل 6 السلوك الجديد تكون قواعد بيانات العرض التوضيحي مرئية.

مشكلة Chromium ذات الصلة: #943770

عرض حجم المورد غير المضغوط عند التمرير

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

الشكل 7 توجيه مؤشر الماوس فوق عمود "الحجم" لعرض حجم المورد غير المضغوط

مشكلة Chromium ذات الصلة: #805429

نقاط الإيقاف المضمّنة في لوحة نقاط الإيقاف

لنفترض أنّك أضفت نقطة توقّف في سطر الرمز إلى سطر الرمز التالي:

document.querySelector('#dante').addEventListener('click', logWarning);

منذ فترة، أتاحت لك "أدوات مطوّلي البرامج" تحديد الوقت الذي يجب أن تتوقف فيه مؤقتًا عند نقطة توقّف، على سبيل المثال: في بداية السطر، أو قبل استدعاء document.querySelector('#dante')، أو قبل استدعاء addEventListener('click', logWarning). إذا فعّلت جميع نقاط الإيقاف الثلاث، ستنشئ في الأساس 3 نقاط إيقاف. في السابق، لم تمنحك لوحة نقاط التوقف إمكانية إدارة نقاط التوقف الثلاث هذه بشكل فردي. بدءًا من الإصدار 75 من Chrome، يحصل كل نقطة توقّف مضمّنة على إدخال خاص به في لوحة نقاط التوقّف.

الشكل 8 السلوك القديم لا يوجد سوى إدخال واحد في لوحة نقاط التوقف.

الشكل 9 السلوك الجديد هناك 3 إدخالات في لوحة نقاط التوقّف.

مشكلة Chromium ذات الصلة: #927961

أعداد موارد IndexedDB وذاكرة التخزين المؤقت

تشير اللوحتان IndexedDB وذاكرة التخزين المؤقت الآن إلى إجمالي عدد الموارد في قاعدة بيانات أو ذاكرة تخزين مؤقت.

الشكل 10 إجمالي عدد الإدخالات في قاعدة بيانات IndexedDB.

المشاكل ذات الصلة في Chromium: #941197 و#930773 و#930865

إعداد لإيقاف تلميح الفحص المفصّل

قدّمت الإصدار 73 من Chrome تلميحات أدوات مفصّلة عند استخدام "وضع الفحص".

الشكل 11 تلميح أدوات مفصّل يعرض اللون والخط والهامش والتباين

يمكنك الآن إيقاف تلميحات الأدوات التفصيلية هذه من خلال الإعدادات > الإعدادات المفضّلة > العناصر > عرض تلميح الأداة التفصيلي الخاص بأداة الفحص.

الشكل 12 تلميح أدوات بسيط يعرض العرض والارتفاع فقط

مشكلة Chromium ذات الصلة: #948417

إعداد لتبديل المسافة البادئة لعلامة التبويب في محرّر "لوحة المصادر"

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

لقد بذلنا الكثير من الجهد مؤخرًا لجعل واجهة مستخدم "أدوات المطوّرين" نفسها قابلة للتنقّل باستخدام لوحة المفاتيح بشكل أكبر. يمكنك الاطّلاع على مقالة Rob بعنوان التنقّل في "أدوات مطوّري البرامج في Chrome" باستخدام التكنولوجيا المساعدة لمعرفة المزيد.

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

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

التواصل مع فريق Chrome DevTools

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

• يمكنك إرسال الملاحظات وطلبات الميزات إلينا على crbug.com.
• يمكنك الإبلاغ عن مشكلة في "أدوات مطوّري البرامج" باستخدام more_vert المزيد من الخيارات > مساعدة > الإبلاغ عن مشكلة في "أدوات مطوّري البرامج" في "أدوات مطوّري البرامج".
• يمكنك نشر تغريدة على ‎@ChromeDevTools.
• يمكنك إضافة تعليقات على فيديوهات "الميزات الجديدة في أدوات مطوّري البرامج" على YouTube أو فيديوهات "نصائح حول أدوات مطوّري البرامج" على YouTube.

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

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