צ'קליסט מעשי לבדיקות חוצות דפדפנים
פריסה (layout) עשויה להיראות מושלמת ב-Chrome, אך להישבר בטלפון Android זול או בלפטופ ישן עם זום של 125%.
אל תתייחסו לבדיקות כשלב סופי מעורפל. התייחסו אליהן כצ'קליסט שניתן לחזור עליו.
בדיקה של כל מכשיר וכל דפדפן מבזבזת זמן. במקום זאת, אתם זקוקים למטריצה רזה.
בחרו את האלמנטים החיוניים הבאים:
- דפדפן Chromium אחד בשולחן עבודה (desktop)
- סביבת Safari אחת
- סביבת Firefox אחת
- טלפון Android אחד
- iPhone אחד
התאימו את הבדיקות שלכם לאופן שבו אנשים משתמשים בפועל במוצר שלכם. דף לא חייב להיראות זהה בכל מקום. הוא חייב להישאר שמיש, קריא ויציב.
שמרו על צ'קליסט קצר. אם הרצתו לוקחת חצי יום, הצוות שלכם ידלג עליו. סריקה של שעה אחת עדיפה.
התחילו עם המבנה:
- בדקו את דף הבית, דפי התוכן והטפסים.
- שנו את גודל המסך מדסקטופ רחב לרוחבי מובייל צרים.
- בצעו זום-אין כדי לבדוק אם כפתורים עברו שורה או אם כותרות נחתכו.
- שימו לב לגלילה אופקית או לכותרות דביקות (sticky headers) שמכסות את התוכן.
לאחר מכן, בדקו את האינטראקציות:
- גללו מלמעלה למטה.
- פתחו תפריטים והפעילו חלונות קופצים (modals).
- עברו בין אלמנטים בדף באמצעות מקש ה-Tab במקלדת.
- בדקו טפסים עם שדות טקסט, בוררי תאריכים (date pickers) והעלאת קבצים.
- בדקו אם מילוי אוטומטי (autofill) משבש את הפריסה.
בדקו רכיבי JavaScript:
- בדקו אקורדיונים, לשוניות (tabs) והצעות חיפוש.
- שימו לב לבעיות תזמון שבהן סקריפט נכשל בהצמדה לכפתור.
- בדקו טעינה מחדש של הדף ואת התנהגות כפתור ה"חזור".
לבסוף, בצעו בדיקות עומס (stress test) לגבולות:
- הגבילו (throttle) את מהירות הרשת שלכם.
- בטלו את המטמון (cache).
- השתמשו במחרוזות טקסט ארוכות בשדות הקלט.
- בדקו כיצד טבלאות גדולות או כרטיסים רבים משפיעים על הפריסה.
הצ'קליסט הטוב ביותר הוא משעמם. הוא צריך להשתלב בתהליך השחרור (release process) שלכם עם תיבות פשוטות של "עבר" או "נכשל".
בכל פעם שבאג חומק אל סביבת הייצור (production), הוסיפו אותו לרשימה שלכם. צ'קליסט מקבל את ערכו כשהוא זוכר את מה שהצוות שלכם שכח.
מקור: https://dev.to/graceholloway_/a-practical-cross-browser-testing-checklist-1p6a