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

Jecelyn Yeen

استعلامات حاوية CSS القابلة للتعديل في جزء الأنماط

يمكنك الآن عرض طلبات بحث حاوية CSS وتعديلها في جزء الأنماط.

توفر استعلامات الحاوية نهجًا أكثر ديناميكية للتصميم سريع الاستجابة. تعمل قاعدة @container بطريقة مشابهة للاستعلام عن الوسائط من خلال @media. ومع ذلك، بدلاً من إرسال طلب بحث في إطار العرض ووكيل المستخدم للحصول على معلومات، يُجري @container طلب بحث عن حاوية الأصل التي تتطابق مع معايير معيّنة.

في لوحة العناصر، انقر على عنصر DOM الذي يحتوي على قاعدة @container، وبالتالي تعرض أدوات مطوّري البرامج الآن معلومات @container في لوحة الأنماط. انقر عليه لتعديل الحجم. يعرض جزء الأنماط معلومات الحاوية المقابلة أيضًا. مرِّر مؤشر الماوس فوقه لتمييز عنصر الحاوية على الصفحة وتحقَّق من حجم الحاوية. انقر عليه لتحديد عنصر الحاوية.

ميزة طلبات البحث في الحاوية هي ميزة تجريبية في الوقت الحالي. يُرجى تفعيل علامة #enable-container-queries ضمن chrome://flags لاختبارها.

مشكلة Chromium: 1146422

معاينة حزمة الويب في لوحة "الشبكة"

حزمة الويب هي تنسيق ملف لتضمين مورد أو أكثر من موارد HTTP في ملف واحد. يمكنك الآن معاينة محتوى حِزمة الويب في لوحة الشبكة.

لا تزال ميزة حِزمة الويب تجريبية في الوقت الحالي. يُرجى تفعيل ميزة العلامة #enable-experimental-web-platform-features ضمن chrome://flags لاختبارها.

مشكلة Chromium: 1182537

تصحيح الأخطاء في Attribution Reporting API

يتم الآن الإبلاغ عن أخطاء Attribution Reporting API في علامة التبويب المشاكل.

Attribution Reporting هي واجهة برمجة تطبيقات جديدة تساعدك على قياس الحالات التي يؤدي فيها إجراء المستخدِم (مثل نقرة على إعلان أو مشاهدة) إلى إحالة ناجحة، بدون استخدام معرّفات مواقع إلكترونية متعددة.

مشكلة Chromium: 1190735

معالجة أفضل للسلسلة في وحدة التحكّم

وتتيح لك قائمة السياق الجديدة في وحدة التحكّم نسخ أي سلسلة كمحتوى أو حرف JavaScript حرفي أو قيمة JSON حرفية.

في Chrome 90، عدَّلت "أدوات مطوري البرامج" وحدة التحكّم لتنسيق مخرجات السلسلة كقيم JSON حرفية صالحة دائمًا. لقد تلقّينا ملاحظات من المطوّرين تفيد بأنّ هذا التغيير قد يكون مربكًا، ويعتقد البعض أنّ مقدار الهروب مبالغ فيه ويجعل النتائج غير مقروءة.

تعمل وحدة التحكّم الآن على تنسيق مخرجات السلسلة كقيم JavaScript حرفية صالحة، وتوفّر لك أيضًا 3 خيارات للنسخ للسلاسل. سينهي الخيار نسخ كحرفي JavaScript حرفيًا من الأحرف الخاصة المناسبة ويلف السلسلة بين علامات اقتباس مفردة أو علامات اقتباس مزدوجة أو فواصل عليا مائلة وفقًا لمحتوى السلسلة. وبدلاً من ذلك، ينسخ نسخ محتوى السلسلة محتوى السلسلة الأولية (بما في ذلك الأسطر الجديدة والأحرف الخاصة الأخرى) حرفيًا إلى الحافظة. أخيرًا، يعمل الخيار نسخ بتنسيق JSON حرفي على تنسيق السلسلة كقيمة JSON حرفية صالحة وينسخها إلى الحافظة.

مشكلة Chromium: 1208389

تصحيح أخطاء CORS المُحسَّنة

أصبحت أخطاء TypeErrors المتعلقة بسياسة CORS في وحدة التحكم مرتبطة الآن بلوحة "الشبكة" وعلامة التبويب "المشاكل".

انقر على الرمزَين الجديدَين بجانب رسالة الخطأ المتعلّقة بخدمة CORS لعرض طلب الشبكة، أو لفهم رسالة الخطأ بشكل أكبر والحصول على الحلول المحتملة في علامة التبويب "المشاكل".

مشكلة Chromium: 1213393

Lighthouse 8.1

تستخدم لوحة Lighthouse الآن الإصدار 8.1 من Lighthouse.

إذا كان موقعك الإلكتروني يعرض خرائط المصدر على Lighthouse، ابحث عن الزر عرض Treemap للاطّلاع على تفاصيل JavaScript الذي تم شحنه، مع إمكانية الفلترة حسب الحجم والتغطية عند التحميل.

ويتضمّن التقرير أيضًا فلترًا جديدًا للمقاييس (راجِع عرض عمليات التدقيق ذات الصلة بالفلتر في لقطة الشاشة). اختر مقياسًا للتركيز على الفرص وبيانات التشخيص الأكثر صلةً بتحسين هذا المقياس فقط.

تضمّنت فئة الأداء عددًا من التغييرات في النتائج لتتوافق مع أدوات الأداء الأخرى ولتعكس حالة الويب بشكلٍ أفضل.

يمكنك مراجعة ملاحظات الإصدار للاطّلاع على قائمة كاملة بالتغييرات.

مشكلة Chromium: 772558

عرض عنوان URL للملاحظة الجديدة في لوحة البيان

تعرض لوحة "البيان" الآن عنوان URL الجديد للملاحظة.

تستخدم حاليًا نظام التشغيل ChromeOS (CrOS) وتطبيقات Chrome وتطبيقات Android التي تعلن عن "ملاحظة جديدة" كأحد تطبيقات تدوين الملاحظات في إعدادات قلم الشاشة (يظهر هذا في حال استخدام جهاز CrOS مع قلم شاشة). عند تحديده كتطبيق لتدوين الملاحظات، يمكن تشغيل التطبيق من "إنشاء ملاحظة" في لوحة قلم الشاشة. . تُعد إضافة الحقل new-note-url في بيان التطبيق جزءًا من الجهود المبذولة لإضافة وظائف مكافئة إلى تطبيقات الويب.

مشكلة Chromium: 1185678

تم إصلاح أدوات اختيار مطابقة CSS

أصلحت "أدوات مطوّري البرامج" أدوات اختيار لغة CSS المطابِقة، حيث لم تكن تعمل في الإصدار الأخير.

تظهر أدوات الاختيار المفصولة بفواصل في لوحة الأنماط بألوان مختلفة بناءً على ما إذا كانت تتطابق مع عقدة DOM المحددة أم لا:

• يظهر جزء غير مطابق بلون رمادي فاتح.
• يتم عرض جزء أداة الاختيار المطابق باللون الأسود.

مشكلة Chromium: 1219153

عرض استجابات JSON مطبوعة بشكل جميل في لوحة "الشبكة"

يمكنك الآن عرض ردود JSON بتنسيق محسّن في لوحة الشبكة.

افتح استجابة JSON في لوحة الشبكة وانقر على الرمز {} لطباعتها بشكل محسّن.

خطأ في Chromium: 998674

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

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

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

يمكنك استخدام الخيارات التالية لمناقشة الميزات والتغييرات الجديدة في المشاركة أو مناقشة أي معلومات أخرى متعلّقة بأدوات مطوري البرامج.

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

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

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