Recordingتصفَّح الأدلة

تسجيل اختبار

Capture a real browser session as test steps, and the nine-rung priority ladder Vera walks to pick a selector that survives your next deploy.

التسجيل أسرع طريق إلى اختبار حقيقي: تفتح Vera متصفحًا، وتستعمل أنت التطبيق، فتصل كل نقرة وكل حرف وكل اختيار إلى المُنشئ في صورة خطوة.

استعمله حين تعرف المسار وتريده كما هو بالضبط. واستعمل التوليد بالذكاء الاصطناعي حين تريد أن تستنتج Vera المسار عنك، والمُنشئ حين تريد تركيب الخطوات بيدك.

تسجيل جلسة

  1. افتح مشروعًا وابدأ تسجيلًا، وأعطِه عنوان البداية.
  2. تُفتح نافذة متصفح ظاهرة — متصفح حقيقي تقوده أنت.
  3. استعمل التطبيق. تتدفَّق الخطوات إلى المُنشئ أولًا بأول وأنت تعمل.
  4. أوقف التسجيل. والخطوات المُلتقَطة صارت لك: تحرِّرها وتعيد ترتيبها وتضيف إليها ما تشاء من تحقُّقات.

ويُتحقَّق من عنوان البداية على الخادم قبل أن يتنقَّل المتصفح، حتى لا يُستعمل التسجيل وسيلةً لحمل الخادم على جلب عنوان لا ينبغي له جلبه.

ما الذي يُلتقَط

النقرات، وإدخال النص، وتغيير عناصر الاختيار. فالتسجيل يلتقط التفاعلات لا النتائج — ومن ثَمّ فالاختبار المسجَّل يسير في المسار ولا يفحص شيئًا بعد.

وإضافة التحقُّق هي ما يجعله اختبارًا. التسجيل يكفيك تسعين بالمئة مُملّة، ويبقى التحقُّق: عشرة بالمئة هي موضع القيمة كلها، وكتابتها عليك أنت. انظر قسم التحقُّقات.

كيف تُختار المُحدِّدات

لا يلجأ المُسجِّل إلى مسارات CSS ما وجد عنها بديلًا. فهو يصعد بكل عنصر سلَّم أولويات من تسع درجات فعّالة، ويأخذ أول درجة تعطي تطابقًا وحيدًا:

#الدرجةمثال
1data-testiddata-testid=checkout-submit
2id (وتُتجاهَل المعرِّفات التي تبدو متغيِّرة)#email
3الخاصية name (في عناصر النماذج)[name=password]
4دور ARIA مع الاسم الظاهر للقارئاتrole=button[name="Submit"]
5مُحدِّد فريد قائم على صنف.checkout-form .primary
6placeholder[placeholder="Enter your email"]
7aria-label[aria-label="Close"]
8الوسم <label> المرتبط بالعنصرأُلغيت، انظر أدناه
9النص الظاهر (لغير حقول الإدخال، والنص القصير)text=Sign in
10مسار CSSdiv > form > button:nth-child(3)

لماذا لا تجد الدرجة الثامنة. كانت تُخرِج label=Email address، وهذا لم يكن قابلًا لإعادة التشغيل أصلًا: فـ label ليس محرِّك مُحدِّدات في Playwright، فكانت كل خطوة تخرج عنها تموت وقت التشغيل برسالة Unknown engine "label". وقد حُذفت الدرجة ولم تُعَد كتابتها، فانتقل ما كان يمرّ بها إلى الدرجة الرابعة (الدور مع الاسم الظاهر) حيث يكون نص الوسم فريدًا، وإلى الدرجة العاشرة (مسار CSS) حيث لا يكون. أما الترقيم فتُرك على حاله عن عمد — إذ إن إعادة الترقيم كانت ستغيِّر بصمت معنى «الدرجة التاسعة» في كل ملاحظة قديمة وكل تسجيل قديم. وانظر المحرِّكات والمُحدِّدات لبيان ما يجوز أن يكون عليه المُحدِّد.

وأمران يجعلان هذا أمتن من مُسجِّل عادي:

  • يُختبَر تفرُّد كل مرشَّح قبل قبوله. فالدرجة التي تطابق عنصرين تُرفض وتُجرَّب التي تليها، فلا ينتهي بك الأمر إلى مُحدِّد يعمل اليوم لأنك صادفت أول تطابق.
  • تُستبعَد الأصناف المولَّدة. فالأصناف التي تُولِّدها أُطر العمل بتجزئة (css-1a2b3c، وما يشبهها من ركام أصناف المرافق) لا تثبت بين بناء وآخر، فلا تُتَّخذ هويةً للعنصر ولو كانت فريدة الآن.

والدرجة العاشرة هي الحل الأخير، ولا تُخفي ذلك — وهي التي زاد نصيبها بعد إلغاء الدرجة الثامنة. فإن رأيت مُحدِّد خطوةٍ مسارَ CSS، فذلك المُسجِّل يخبرك أن العنصر لم يكن فيه ما يُمسَك به ثابتًا؛ والعلاج الدائم أن تضيف data-testid في تطبيقك، فتنتقل تلك الخطوة إلى الدرجة الأولى في التسجيل التالي.

وإذا انكسر المُحدِّد

فليس عليك إصلاحه بيدك. عند فشلٍ سببه مُحدِّد، يستطيع المُشغِّل أن يلتقط صورة من الـ DOM الحيّ، ويطلب مُحدِّدًا مُصحَّحًا، ويعيد الخطوة، ويسجِّل ما غيَّره — فيظهر التشغيل بحالة healed، ومعه المُحدِّد الأصلي والبديل. وهكذا يكون تغيير اسم صنفٍ تشغيلًا أخضر مع ملاحظة، لا تشغيلًا أحمر.

التسجيل خلف تسجيل دخول

إن كان للمشروع دور مصادقة مُعدّ، فالتقِط جلسته أولًا ليبدأ التسجيل وأنت داخل الحساب فعلًا — فتسجِّل المسار الذي يعنيك بدل إعادة تسجيل الدخول في كل مرة.

أما الموقع المحمي ببوابة تطوير أو اختبار، فاضبط له Basic Auth على مستوى المشروع. ولا يكفي وضع بيانات الاعتماد في العنوان نفسه (https://user:pass@host/…): لأن Chromium يطبِّقها على تنقُّل الصفحة الرئيسي وحده، فتظل نداءات fetch وXHR التي يُطلقها التطبيق ترتدّ بالخطأ 401.

الحدود

  • جلسة تسجيل واحدة في كل مرة لكل حصة متصفح، وعدد المتصفحات المتزامنة محدود على مستوى العملية كلها.
  • والجلسات الخاملة تنتهي مهلتها، حتى لا تحجز نافذةٌ منسيّة متصفحًا.

انظر أيضًا