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

Chrome 100

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

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

عرض قواعد @supports وتعديلها في لوحة "الأنماط"

يمكنك الآن عرض وتعديل قواعد @supports at-rules في CSS في لوحة الأنماط. تسهّل هذه التغييرات تجربة قواعد at-rules في الوقت الفعلي. افتح هذه الصفحة التجريبية، وافحص عنصر <div class=”box”>، واطّلِع على قواعد at-rules الخاصة بـ @supports في لوحة الأنماط. انقر على بيان القاعدة لتعديله.

عرض قواعد @supports وتعديلها

مشاكل Chromium: 1222574 و1222573

تحسينات على لوحة "المسجّلة الذكية"

إتاحة أدوات الاختيار الشائعة تلقائيًا

عند تحديد أداة اختيار فريدة أثناء التسجيل، تفضّل لوحة المسجّلة الآن تلقائيًا العناصر التي تحتوي على السمات التالية:

  • data-testid
  • data-test
  • data-qa
  • data-cy
  • data-test-id
  • data-qa-id
  • data-testing

السمات أعلاه هي عناصر اختيار شائعة تُستخدَم في التشغيل الآلي للاختبار.

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

بما أنّ عنصر البريد الإلكتروني يحتوي على data-testid محدّد، يتم استخدامه كأداة اختيار تلقائيًا بدلاً من السمتَين id أو class.

إتاحة أدوات الاختيار الشائعة تلقائيًا

تخصيص أداة اختيار التسجيل

يمكنك تخصيص أداة اختيار التسجيل إذا لم تكن تستخدِم أدوات الاختيار الشائعة.

على سبيل المثال، تستخدِم هذه الصفحة التجريبية السمة data-automate كعنصر اختيار. ابدأ تسجيلًا جديدًا وأدخِل data-automate كسمة عنصر الاختيار. املأ عنوان بريد إلكتروني واطّلِع على قيمة أداة الاختيار ([data-automate=email-address]).

تخصيص أداة اختيار التسجيل

نتيجة اختيار أداة الاختيار المخصّصة

إعادة تسمية تسجيل

يمكنك الآن إعادة تسمية تسجيل في لوحة المسجِّل باستخدام زر التعديل (رمز القلم الرصاص) بجانب عنوان التسجيل.

إعادة تسمية تسجيل

معاينة خصائص الفئة/الدالة عند التمرير فوقها

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

معاينة خصائص الفئة/الدالة عند التمرير فوقها

مشكلة Chromium: 1049947

اللقطات المعروضة جزئيًا في لوحة "الأداء"

يعرض تسجيل الأداء الآن فئة لقطات جديدة "اللقطات المعروضة جزئيًا" في المخطط الزمني اللقطات.

في السابق، كان مخطط اللقطات الزمني يعرض أي لقطات تتأخّر فيها معالجة سلسلة المهام الرئيسية على أنّها "لقطات تم إسقاطها". ومع ذلك، هناك حالات قد تؤدي فيها بعض اللقطات إلى إجراء تعديلات مرئية (مثل الانتقال للأعلى أو للأسفل) بفضل سلسلة المكوّن.

يؤدّي ذلك إلى إرباك المستخدمين لأنّ لقطات شاشة "اللقطات المفقودة" هذه لا تزال تعرض تعديلات مرئية.

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

اللقطات المعروضة جزئيًا في لوحة &quot;الأداء&quot;

مشكلة Chromium: 1261130

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

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

  • تم تعديل سلاسل وكيل مستخدم iPhone لـ الأجهزة المحاكية. تحتوي جميع إصدارات iPhone الأحدث من الإصدار 5 على سلسلة وكيل مستخدم مع iPhone OS 13_2_3. (1289553)
  • يمكنك الآن حفظ المقتطف كملف JavaScript مباشرةً. في السابق، كان عليك إلحاق إضافة .js يدويًا بملف. (1137218)
  • تعرض لوحة المصادر الآن أسماء متغيّرات النطاق بشكل صحيح عند تصحيح الأخطاء باستخدام خريطة المصدر. في السابق، كانت لوحة المصادر تعرِض أسماء متغيّرات النطاق المصغّرة على الرغم من توفُّر خريطة المصدر. (1294682)
  • تعيد الآن لوحة المصادر موضع التمرير بشكل صحيح عند تحميل الصفحة. في السابق، لم تتم استعادة الموضع بشكل صحيح، ما سبّب إزعاجًا في تصحيح الأخطاء. (1294422)

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

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

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

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

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

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