یک چکلیست کاربردی برای تست چند مرورگری (Cross-Browser Testing)
یک چیدمان (layout) ممکن است در یک مرورگر بینقص به نظر برسد اما در مرورگر دیگر بههم بریزد. یک گوشی اندرویدی ارزانقیمت با صفحهنمایش باریک یا یک لپتاپ قدیمی با زوم ۱۲۵٪ میتواند طراحی شما را خراب کند.
با تست کردن به عنوان یک مرحلهی کلی و مبهم در پایان کار برخورد نکنید. با آن مانند یک چکلیست مشخص رفتار کنید.
بر بخشهای پرخطر تمرکز کنید:
- فرمها و ورودیها (inputs)
- منوهای ناوبری (navigation menus)
- جابهجاییهای چیدمان (layout shifts)
- بارگذاری فونتها
- تعاملات جاوااسکریپت (JavaScript interactions)
از تلاش برای تست تکتک مرورگرها دست بردارید؛ این کار وقت تلف کردن است. در عوض از یک ماتریس سبک استفاده کنید:
- یک مرورگر Chromium در دسکتاپ
- یک محیط Safari
- یک محیط Firefox
- یک گوشی اندرویدی
- یک آیفون
تستهای خود را بر اساس نحوه استفاده واقعی کاربران از محصولتان تنظیم کنید. لازم نیست یک صفحه در همه جا دقیقاً یکسان به نظر برسد؛ بلکه باید قابل استفاده، خوانا و پایدار باشد.
چکلیست شما باید شامل موارد زیر باشد:
- مرورگر و سیستمعامل (OS)
- عرض ویوپورت (Viewport width)
- سطح زوم
- جریانهای کاربری خاص (user flows)
لیست را کوتاه نگه دارید. اگر انجام یک تست نیم روز طول بکشد، تیم شما از آن صرفنظر خواهد کرد. یک بررسی کلی و خوب باید کمتر از یک ساعت زمان ببرد.
با ساختار شروع کنید. صفحه اصلی، صفحات محتوا و فرمها را بررسی کنید. اندازه پنجره خود را از حالت دسکتاپ به عرض موبایل تغییر دهید. زوم کنید. مراقب این مشکلات باشید:
- دکمههایی که بهصورت نامناسب به خط بعد میروند (wrap)
- تیترهایی که بریده میشوند
- اسکرول افقی
- هدرهای چسبان (sticky headers) که محتوا را میپوشانند
- مودالهایی (modals) که کنترلهای مهم را مخفی میکنند
سپس، تعاملات را تست کنید. مرورگرها با فرمها به روشهای متفاوتی برخورد میکنند. ورودیهای متنی، مدیریت پسوردها، انتخابگرهای تاریخ (date pickers) و آپلود فایلها را تست کنید. بررسی کنید که قابلیت پر کردن خودکار (autofill) چگونه بر چیدمان شما تأثیر میگذارد.
کامپوننتهای سنگین جاوااسکریپتی مانند تبها (tabs)، آکاردئونها (accordions) و پیشنهادهای جستجو را تست کنید. ممکن است یک صفحه هیچ خطایی در کنسول نشان ندهد اما همچنان یک دکمه خراب داشته باشد.
در نهایت، سایت خود را تحت فشار تست کنید (stress test):
- سرعت شبکه خود را محدود کنید (throttle)
- کش (cache) خود را غیرفعال کنید
- از متنهای بسیار طولانی در فیلدهای ورودی استفاده کنید
- تعداد آیتمهای بیشتری نسبت به حالت معمول بارگذاری کنید تا سرریز (overflow) را بررسی کنید
بهترین چکلیست، خستهکننده است. باید یک لیست ساده شامل «قبول» یا «رد» باشد. هر بار که محصولی را منتشر میکنید، از آن استفاده کنید. وقتی باگی به محیط عملیاتی (production) نفوذ کرد، آن نقص خاص را به چکلیست خود اضافه کنید.
یک چکلیست تنها زمانی مفید است که آنچه تیم شما فراموش کرده را به یاد بیاورد.
Source: https://dev.to/graceholloway_/a-practical-cross-browser-testing-checklist-1p6a