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

إعادة التشغيل خطوة بخطوة في "المسجّلة الذكية"

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

لضبط نقطة إيقاف، انقر على النقطة الزرقاء بجانب الخطوة. أعِد تشغيل تدفق المستخدم، وستتوقف إعادة التشغيل مؤقتًا قبل تنفيذ الخطوة. من هنا، يمكنك متابعة عملية إعادة التشغيل أو تنفيذ خطوة أو إلغاء إعادة التشغيل.

وباستخدام هذه الميزة، يمكنك بسهولة عرض تدفق المستخدم وتصحيحه بشكل كامل.

يمكنك الاطّلاع على مرجع ميزات المسجّلة الذكية للحصول على مزيد من المعلومات.

إعادة التشغيل خطوة بخطوة في "المسجّلة الذكية"

مشكلة Chromium: 1257499

دعم الماوس فوق الحدث في لوحة "المسجّلة الذكية"

تتيح المسجّلة الذكية الآن إضافة خطوة بالماوس (تمرير) يدويًا في أحد التسجيلات.

يعرض هذا العرض التوضيحي قائمة منبثقة عند التمرير. حاول تسجيل تدفق المستخدم وانقر فوق عنصر في القائمة.

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

دعم الماوس فوق الحدث في "المسجّلة الذكية"

مشكلة Chromium: 1257499

سرعة عرض أكبر محتوى مرئي (LCP) في لوحة "إحصاءات الأداء"

إنّ مقياس LCP هو مقياس مهم يتمحور حول المستخدم لقياس سرعة التحميل الملموسة. يمكنك الآن التعرّف على المسارات المهمة والأسباب الجذرية لحدوث سرعة عرض أكبر محتوى مرئي (LCP).

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

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

سرعة عرض أكبر جزء من المحتوى على الصفحة في لوحة "إحصاءات الأداء"

مشكلة Chromium: 1326481

تحديد وميض النص (FOIT وFOUT) كأسباب أساسية محتملة لمتغيّرات التصميم

ترصد لوحة إحصاءات الأداء الآن وميض النص غير المرئي (FOIT) ووميض النص غير المرئي (FOUT) كسببَين أساسيَين محتمَلين لمتغيّرات التصميم.

لعرض الأسباب الأساسية المحتمَلة لمتغيّرات التصميم، انقر على لقطة شاشة في مسار متغيّرات التصميم.

يمكنك الاطّلاع على القسم تحسين تحميل وعرض WebFont للتعرّف على الطريقة المتّبعة لمنع متغيّرات التصميم.

FOUT في لوحة "إحصاءات الأداء"

مشاكل Chromium: 1334628، 1328873

معالِجات البروتوكول في جزء البيان

يمكنك الآن استخدام "أدوات مطوري البرامج" لاختبار تسجيل معالج بروتوكول عنوان URL لتطبيقات الويب التقدّمية (PWA).

يتيح تسجيل معالج بروتوكول عنوان URL لتطبيقات تطبيقات الويب التقدّمية المثبّتة معالجة الروابط التي تستخدم بروتوكولاً معيّنًا (مثل magnet وweb+example) للحصول على تجربة أكثر تكاملاً.

انتقِل إلى قسم معالِجات البروتوكولات عبر التطبيق > جزء ملف البيان. يمكنك عرض جميع البروتوكولات المتاحة واختبارها هنا.

على سبيل المثال، ثبِّت تطبيق PWA التجريبي هذا. في قسم معالِجات البروتوكولات، اكتب americano وانقر على Test Protocol لفتح صفحة القهوة في تطبيق الويب التقدّمي (PWA).

معالِجات البروتوكول في جزء البيان

مشاكل Chromium: 1300613

شارة الطبقة العلوية في لوحة "العناصر"

استخدِم شارة الطبقة العلوية لفهم مفهوم الطبقة العلوية وتصور كيفية تغيُّر محتوى الطبقة العليا.

أصبح العنصر <dialog> مستقرًا مؤخرًا عبر المتصفحات. عند فتح مربع حوار، يتم وضعه في طبقة علوية. يتم عرض محتوى المستوى الأعلى فوق كل المحتوى الآخر.

في هذا العرض التوضيحي، انقر على فتح مربّع الحوار.

للمساعدة في عرض عناصر الطبقة العلوية، تضيف أدوات مطوّري البرامج حاوية من الطبقة العلوية (#top-layer) إلى شجرة DOM. ويمكن وضعها بعد علامة الإغلاق </html>.

للانتقال من عنصر حاوية الطبقة العليا إلى عنصر شجرة الطبقة العلوية، انقر على الزر إظهار بجانب العنصر أو صورته الخلفية في حاوية الطبقة العليا.

بجانب عنصر شجرة الطبقة العليا (مثل عنصر مربّع الحوار)، انقر على شارة الطبقة العليا للانتقال إلى حاوية الطبقة العلوية.

شارة الطبقة العلوية في لوحة &quot;العناصر&quot;

مشكلة Chromium: 1313690

إرفاق معلومات تصحيح أخطاء Wasm في وقت التشغيل

يمكنك الآن إرفاق معلومات تصحيح أخطاء DWARF التي تخصّ Wasm أثناء وقت التشغيل. في السابق، لم تكن لوحة المصادر تدعم سوى إرفاق خرائط المصدر بملفات JavaScript وملفات Wasm.

افتح ملف Wasm في لوحة المصادر. انقر بزر الماوس الأيمن في المحرِّر واختَر إضافة معلومات تصحيح الأخطاء DWARF... لإرفاق معلومات تصحيح الأخطاء عند الطلب.

ALT_TEXT_HERE

مشكلة Chromium: 1341255

دعم التعديل المباشر أثناء تصحيح الأخطاء

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

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

من خلال هذا التحديث، يعيد برنامج تصحيح الأخطاء تشغيل الدالة تلقائيًا مع مراعاة القيود التالية:

  • يمكن فقط تعديل الوظيفة في أعلى الشاشة أثناء الإيقاف المؤقت.
  • لا يوجد استدعاء متكرر في نفس الدالة أسفل الحزمة

التعديل المباشر أثناء تصحيح الأخطاء

مشكلة Chromium: 1334484

عرض @scope وتعديلها في القواعد ضمن جزء "Styles" (الأنماط)

يمكنك الآن عرض وتعديل قواعد CSS @scope في جزء الأنماط.

تُعدّ @scope في القواعد جزءًا من مواصفات المستوى 6 من التوريث والتسلسل في CSS. تسمح هذه القواعد للمطوّرين بتحديد نطاق قواعد الأنماط في CSS.

افتح صفحة العرض التوضيحي هذه وفحص الرابط التشعّبي داخل العنصر <div class=”dark-theme”>. في لوحة الأنماط، يمكنك عرض قواعد @scope. انقر على بيان القاعدة لتعديله.

@scope في القواعد في جزء &quot;Styles&quot; (الأنماط)

مشكلة Chromium: 1337777

تحسينات خريطة المصادر

في ما يلي بعض الإصلاحات على خرائط المصدر لتحسين تجربة تصحيح الأخطاء بشكل عام:

  • تعمل أدوات مطوّري البرامج الآن على تحليل معرّفات خريطة المصادر بشكل صحيح مع علامات الترقيم. تُنتج بعض الأدوات المصغّرة الحديثة (على سبيل المثال، esbuild) خرائط مصدر تدمج المعرّفات مع علامات ترقيم لاحقة (فاصلة وأقواس وفاصلة منقوطة).
  • تحل أدوات مطوّري البرامج الآن أسماء خرائط المصادر للدوال الإنشائية باستخدام طلب super. ALT_TEXT_HERE
  • تم إصلاح فهرسة عناوين URL لخريطة المصادر لعناوين URL الأساسية المكررة. في السابق، لم تكن نقاط الإيقاف مفعّلة في بعض الملفات بسبب عناوين URL الأساسية المكرّرة.

مشكلة Chromium: 1335338، 1333411

ميزات متنوعة

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

  • أزِل زوج قيمة مفتاح التخزين المحلي بشكل صحيح من الجدول في التطبيق > لوحة التخزين المحلي عند حذفه. (1339280)
  • يتم الآن عرض معاينات الألوان بشكل صحيح عند عرض ملفات CSS في لوحة المصادر. في السابق، كانت مواضعها في غير مكانها. (1340062)
  • عرض عناصر CSS المرنة والشبكة في جزء التنسيق بشكل منتظم، بالإضافة إلى عرضها كشارات في لوحة العناصر في السابق، كانت العناصر المرنة والشبكة مفقودة بشكل عشوائي في كلا الموضعين. (1340441، 1273992)
  • يتوفّر رابط جديد من النص البرمجي لإعلان صنّاع المحتوى لإطارات الإعلانات إذا عثرت "أدوات مطوّري البرامج" على النص البرمجي الذي تسبّب في تصنيف الإطار على أنّه إعلان. يمكنك فتح إطار من خلال التطبيق > الإطارات. (1217041)

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

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

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

يُرجى استخدام الخيارات التالية لمناقشة الميزات والتغييرات الجديدة في المشاركة أو أي موضوع آخر ذي صلة بـ "أدوات مطوري البرامج".

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

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

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

الإصدار 123 من Chrome

الإصدار 122 من Chrome

الإصدار 121 من Chrome

الإصدار 120 من Chrome

الإصدار 119 من متصفِّح Chrome

الإصدار 118 من متصفّح Chrome

الإصدار 117 من Chrome

الإصدار 116 من متصفّح Chrome

الإصدار 115 من متصفّح Chrome

الإصدار 114 من متصفّح Chrome

الإصدار 113 من متصفّح Chrome

الإصدار 112 من Chrome

الإصدار 111 من متصفّح Chrome

الإصدار 110 من متصفّح Chrome

الإصدار 109 من متصفِّح Chrome

الإصدار 108 من متصفِّح Chrome

107 Chrome

الإصدار 106 من متصفّح Chrome

105 Chrome

الإصدار 104 من متصفِّح Chrome

الإصدار 103 من متصفّح Chrome

الإصدار 102 من متصفّح Chrome

الإصدار 101 من متصفّح Chrome

Chrome 100

إصدار Chrome 99

Chrome 98

97 من Chrome

الإصدار 96 من Chrome

Chrome 95

Chrome 94

Chrome 93

الإصدار 92 من Chrome

الإصدار 91 من Chrome

90 Chrome

إصدار Chrome 89

إصدار Chrome 88

الإصدار 87 من Chrome

إصدار 86 من Chrome

الإصدار 85 من Chrome

إصدار 84 من Chrome

إصدار Chrome 83

إصدار 82 من Chrome

تم إلغاء إصدار 82 من Chrome.

إصدار 81 من Chrome

80 Chrome

الإصدار 79 من Chrome

الإصدار 78 من Chrome

الإصدار 77 من Chrome

الإصدار 76 من Chrome

الإصدار 75 من Chrome

الإصدار 74 من Chrome

الإصدار 73 من Chrome

الإصدار 72 من Chrome

الإصدار 71 من Chrome

Chrome 70

إصدار Chrome 68

الإصدار 67 من Chrome

Chrome 66

الإصدار 65 من Chrome

إصدار 64 من Chrome

إصدار 63 من Chrome

إصدار 62 من Chrome

إصدار 61 من Chrome

إصدار 60 من Chrome

الإصدار 59 من Chrome