1
Border radius
يكتشف تغييرات تقريب الزوايا، بما في ذلك القيم الفردية لكل زاوية.
25 حالة اختبار
الحدود والظلال
الحدود والظلال تحدد الحدود البصرية لعناصر الواجهة. تخلق العمق والفصل والتسلسل الهرمي. Delta-QA يكتشف كل تعديل على هذه الخصائص.
ما نكتشفه
2
Box shadow
يلتقط تعديلات الإزاحة والتمويه والانتشار واللون للظلال، بما في ذلك الطبقات المتعددة.
3
Outline
يراقب تغييرات outline-style و outline-color و outline-width و outline-offset.
4
نمط وسمك الحدود
يكتشف التغييرات بين حدود solid و dashed و dotted و double وتغيرات السمك.
5
لون الحدود
يحدد تغييرات اللون على جوانب الحدود الفردية، بما في ذلك القيم الشفافة والموروثة.
مثال تفاعلي
شاهد بالضبط ما يكتشفه Delta-QA. قارن النسختين جنبًا إلى جنب.
قبل
بعد
سيناريوهات واقعية
🎯
border-radius الذي يجعل البطاقات مربّعة
يضيف مطوّر إعادة تعيين CSS على مكوّن مشترك ويصفّر border-radius لجميع بطاقات الموقع. بين عشية وضحاها، بطاقاتك ذات الزوايا المستديرة تصبح مربّعة — الموقع يتحوّل من «عصري ودافئ» إلى «جامد وجاف». لا أحد لديه وقت للتحقّق من 200 شاشة عند كل نشر. Delta-QA يقارن لقطات الشاشة ويبرز الزوايا التي تحوّلت من مستديرة إلى مربّعة على كل بطاقة — فرق الشكل واضح عند التراكب.
⚠️
الحدود التي تظهر مزدوجة
يضيف مطوّر حدودًا على حاوية الجدول دون ضبط خاصية border-collapse. النتيجة: حدود مزدوجة تظهر في بعض الأماكن — الخطوط تبدو أسمك بشكل غير منتظم. الجدول يبدو «مكسورًا» وغير احترافي. في بيئة الاختبار كان كل شيء طبيعيًا، لكن ورقة الأنماط في الإنتاج تُحمّل بترتيب مختلف ويظهر الخلل. Delta-QA يقارن لقطات الشاشة ويبرز الخطوط الأسمك — كل حدّ مزدوج يظهر في diff.
💡
الظل الذي يختفي
يقوم مطوّر بـ«تنظيف» CSS ويحذف box-shadow يعتبره غير ضروري. أزرار الإجراء الرئيسية تفقد ظلّها وتصبح مسطّحة — تندمج مع الخلفية. بصريًا، الأزرار أقل بروزًا وزوّارك يلاحظونها أقل. التغيير بدا تافهًا — حذف ظل — تم دمجه بدون مراجعة بصرية. Delta-QA يقارن لقطات الشاشة ويكتشف اختفاء الظل — الأزرار المسطّحة تظهر في diff البصري.
مستعد لاكتشاف كل انحدار بصري؟
حمّل Delta-QA وابدأ باكتشاف تغييرات CSS في صفحات الويب — بدون كود.