اختبارات التجاوب

الـ QC للـ responsive يُتحقَّق أن كل سطح يُكَوِّن صحيحاً عبر الـ 3 breakpoints للمنصّة — موبايل (≤640px)، تابلت (641-1024px)، سطح المكتب (≥1025px). عرضان إضافيان يُفحَصان في الانحدار: 320px (الأصغر المدعوم) و 1920px (الأكبر الشائع). العقد: لا scroll أفقي، لا محتوى مُقَصَّص، لا أهداف لمس مكسورة عند أيّ عرض في النطاق المدعوم.

شريط فحص لكل breakpoint

• موبايل (320px + 375px + 640px): شبكات عمود واحد، أهداف لمس ≥44px، الـ headers الـ sticky لا تَتداخل مع CTAs، مُحَفِّزات الـ drawer/modal قابلة للوصول بالإبهام.
• تابلت (768px + 1024px): شبكات عمودَيْن، شرائط الفلتر مرئية لكن مضغوطة، الشريط الجانبي sticky على المحتوى طويل-الصيغة.
• سطح المكتب (1280px + 1440px + 1920px): شبكات 3-4 أعمدة، panel فلتر كامل، شريط جانبي عرض-كامل، لا تَقَصُّص max-width على عمود الجسم الرئيسي.
• لا تَقَصُّص محتوى عند أيّ عرض — أصغر viewport مدعوم (320px) يجب أن يَعرض كل CTA، كل حقل نموذج، كل دخول تنقّل أساسي بدون scroll أفقي.
• محمِّلات الـ skeleton تَرسم عند كل breakpoint، ليس فقط سطح المكتب.
• نِسَب عرض-إلى-ارتفاع الصور تَتحوَّل عند حدود الـ breakpoint كما هو موثَّق (مثلاً صورة الغلاف 16:9 سطح المكتب → 4:3 موبايل لمقالات التغطية).