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

Sofia Emelianova
Sofia Emelianova
GitHub

قسم جديد للسمات المخصّصة في "العناصر" > "التصاميم"

تتوافق لوحة العناصر الآن مع قاعدة ‎@property في CSS. تتيح لك هذه السمة تحديد خصائص CSS المخصّصة بشكلٍ صريح وتسجيلها في ورقة أنماط بدون تشغيل أي JavaScript.

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

مشاكل Chromium: 1471102 و1471103 و1471105.

تحسينات إضافية على عمليات التعديل المحلية

بالإضافة إلى التحسينات التي تم إجراؤها في الإصدار السابق، يمكن الآن تجاوز الإعدادات المحلية من خلال ما يلي:

  • في المصادر > الصفحة، عند النقر بزر الماوس الأيمن على ملف تم ربطه بمصدر واختيار تجاوز المحتوى، ستعرض "أدوات مطوّري Chrome" مربّع حوار ينقلك إلى المصدر الأصلي بدلاً من ذلك. لا يمكن تجاوز محتوى الملفات التي تم ربط مصدرها.

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

  • يحصل لوحة الشبكة على عمود جديد باسم يحتوي على عمليات إلغاء وفلتر has-overrides:[content|headers|yes|no] مطابق. للاطّلاع على عمود عمليات إلغاء، انقر بزر الماوس الأيمن على عنوان الجدول واختَر هذا العمود.

    تصفية القيمة "has-overrides:yes" في العمود "Has overrides"

  • في المصادر > عمليات الإلغاء، تم استبدال خيار القائمة حذف جميع عمليات الإلغاء بخيار حذف الذي يتضمّن سلوكًا دقيقًا.

    قبل وبعد استبدال "حذف جميع عمليات التجاوز" بـ "حذف"

كانت وظيفة حذف جميع عمليات الإلغاء السابقة مربكة لأنّها كانت تحذف عمليات الإلغاء النشطة في الجلسة الحالية فقط، والتي تم تمييزها برمز النقطة الأرجوانية تم الحفظ..

يعرض خيار حذف الجديد أولاً رسالة تحذير ويطلب تأكيد الحذف، ثم يحذف المجلد الذي نقرت عليه مع كل محتواه.

لاستعادة الخيار السابق، ضَع علامة في المربّع مربّع اختيار تفعيل "حذف جميع عمليات التجاوز مؤقتًا" في الإعدادات. الإعدادات > التجارب.

مشاكل Chromium: 1472952 و1416338 و1472580 و1473681 و1475668.

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

يُظهر البحث قبل وبعد إجراء التعديل كل التطابقات في كل سطر.

بالإضافة إلى ذلك، تم تحسين سرعة البحث. يمكنك الاطّلاع على المقارنة بين الصورة قبل التعديل (على اليمين) وبعده (على اليسار) في الفيديو التالي.

أخيرًا، يتيح لك البحث الآن تجاهل القائمة ولن يعرض لك نتائج من الملفات التي تم تجاهلها.

مشاكل Chromium: 1468875 و1472019.

لوحة "المصادر" المحسَّنة

مساحة عمل مبسطة في لوحة "المصادر"

تم تبسيط ميزة مساحة العمل في لوحة المستندات المصدر على النحو التالي:

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

تتيح لك المصادر > مساحة العمل مزامنة التغييرات التي تجريها في "أدوات مطوّري البرامج" مباشرةً مع ملفات المصدر.

يمكنك الاطّلاع على عملية الإعداد الجديدة وسير العمل عمليًا:

مشاكل Chromium: 1473771 و1473880 و1473963 و1474686 و1474687

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

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

مشاكل Chromium: 1473758.

تمييز البنية والطباعة المنسّقة لأنواع إضافية من النصوص البرمجية

يمكن الآن للوحة المصادر تنفيذ ما يلي:

  • تنسيق JavaScript المضمّنة بشكل جميل ضمن أنواع النصوص البرمجية التالية: module وimportmap وspeculationrules
  • أبرِز بنية نوعَي النصوص البرمجية importmap وspeculationrules، وكلاهما يحتوي على JSON.

قبل وبعد تنسيق النص بشكل جميل وتمييز بناء الجملة لنوع نص قواعد التخمين

لمزيد من المعلومات حول قواعد التخمين، يُرجى الاطّلاع على التحميل المُسبَق للصفحات في Chrome لتسهيل التنقّل الفوري بين الصفحات.

مشكلة في Chromium: 1473875.

محاكاة ميزة prefers-reduced-transparency لوسائط CSS

يتوافق الإصدار 118 من Chrome الآن مع ميزة الوسائط prefers-reduced-transparency. تتيح هذه الميزة للمطوّرين تعديل محتوى الويب وفقًا للإعدادات المفضّلة التي يختارها المستخدمون لتقليل الشفافية في نظام التشغيل، مثل الإعداد تقليل الشفافية على نظام التشغيل macOS.

لمحاكاة ميزة الوسائط هذه، افتح علامة التبويب العرض وانتقِل للأسفل إلى هذه الميزة.

مشكلة في Chromium: 1424879.

Lighthouse 11

تعمل لوحة Lighthouse الآن بالإصدار 11 من Lighthouse. أهم ما يميّز هذا الإصدار هو إزالة ميزة التنقّل القديمة وإضافة عمليات تدقيق جديدة في إمكانية الوصول وتغيير طريقة احتساب نقاط فئة إمكانية الوصول.

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

مشكلة في Chromium: 772558.

التحسينات المتعلّقة بتسهيل الاستخدام

تتيح "أدوات مطوّري البرامج" الآن المزيد من ضغطات المفاتيح للتنقّل:

  • نظرة عامة على CSS: استخدِم السهمَين المتّجهَين للأعلى وللأسفل للتنقّل بين الأقسام في الشريط الجانبي الأيمن.
  • الذاكرة: في الشريط الجانبي الأيمن، ركِّز على الزر حفظ بجانب اللقطات التي تتضمّن علامة التبويب واضغط على Enter لاختيار المجلد.

بالإضافة إلى ذلك، تم إصلاح العديد من المشاكل المتعلقة بإشعارات قارئ الشاشة.

مشاكل Chromium: 1470401 و1471301 و1474108 و1468631

لمحات متنوّعة

في ما يلي بعض الإصلاحات والتحسينات الجديرة بالذكر في هذا الإصدار:

  • الشبكة: رموز جديدة لأنواع الموارد الشائعة: media وwasm وwebsocket وmanifest وfetch/xhr وjson (1466298).
  • تعديلات على ألوان Material 3 في العديد من عناصر واجهة المستخدم، لا سيما في لوحتَي العناصر والأداء (1456690 و1472243)
  • تحتفظ المشاكل الآن بمشاكل ملفات تعريف الارتباط في جميع عمليات التنقّل (1466601).
  • تحسينات مختلفة على التطبيق > التحميل المُسبَق، وأبرزها الشبكات القابلة للفرز وتفاصيل مجموعة القواعد المعدَّلة (1410709)
  • تحسينات مختلفة على أداة تعديل الأوامر في مراقبة البروتوكول، وأبرزها التحذيرات بشأن الإدخال غير الصحيح، وتعديل أمر تم إرساله، وأداة تعديل لمعلَمات الكائنات بدون مفاتيح محدّدة مسبقًا، وإتاحة استخدام التعدادات غير المحدّدة بالمراجع، والكائنات بدون مرجع النوع، وأوامر الفلتر حسب تطابقات السلسلة الفرعية، والمزيد (1448050).
  • يتم إضافة إطار حول المربّع الإجمالي في الرسم البياني الدائري في الرسم البياني الشعلة الأداء (1470147).
  • لم يعُد المصدر يتعامل مع الشرطات على أنّها أحرف كلمات في CSS (1471354).
  • ترتيب الكلمات الرئيسية ذات الصلة بلغة CSS في نهاية قائمة الاقتراحات التلقائية دائمًا
  • أصبحت فلاتر التعبيرات العادية تتوافق الآن مع المسافات (1346936).
  • تم إصلاح ميزة رصد طلبات البحث عن الوسائط الثابتة في العناصر (1472693).

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

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

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

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

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

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