אמולציה של מכשירים ניידים

ב-Chrome, משתמשים יכולים לדמות את Chrome במכשיר נייד מגרסה למחשב של Chrome, על ידי הפעלת מצב המכשיר באמצעות כלי הפיתוח ל-Chrome. התכונה הזו מאפשרת למפתחים לבדוק במהירות איך אתר מוצג במכשיר נייד, בלי צורך במכשיר אמיתי. כך אפשר לפתח אתרים מהר יותר. ChromeDriver יכול גם לדמות מכשירים באמצעות היכולת mobileEmulation, שמצוינת בערך של מילון.

בדומה לכלי הפיתוח, יש שתי דרכים להפעיל את הדמיית המכשיר הנייד ב-ChromeDriver:

• ציון מכשיר ידוע
• ציון מאפיינים ספציפיים של מכשירים

הפורמט של המילון mobileEmulation תלוי בשיטה הנדרשת.

ציון מכשיר נייד ידוע

כדי להפעיל הדמיית מכשיר עם מכשיר ספציפי, המילון mobileEmulation חייב להכיל את deviceName. משתמשים בשם מכשיר תקין מההגדרות של המכשירים המשוכפלים ב-DevTools בתור הערך של 'deviceName'.

Java

Map<String, String> mobileEmulation = new HashMap<>();
mobileEmulation.put("deviceName", "Nexus 5");
ChromeOptions chromeOptions = new ChromeOptions();
chromeOptions.setExperimentalOption("mobileEmulation", mobileEmulation);
WebDriver driver = new ChromeDriver(chromeOptions);

Ruby

mobile_emulation = { "deviceName" => "Nexus 5" }
caps = Selenium::WebDriver::Remote::Capabilities.chrome(
   "chromeOptions" => { "mobileEmulation" => mobile_emulation })
driver = Selenium::WebDriver.for :remote, url: 'http://localhost:4444/wd/hub',
desired_capabilities: caps

Python

from selenium import webdriver
mobile_emulation = { "deviceName": "Nexus 5" }
chrome_options = webdriver.ChromeOptions()
chrome_options.add_experimental_option("mobileEmulation", mobile_emulation)
driver = webdriver.Remote(command_executor='http://127.0.0.1:4444/wd/hub',
desired_capabilities = chrome_options.to_capabilities())

מקור המכשירים המוכרים

רשימת המכשירים המוכרים נוצרת מהחלונית 'הדמיה' של DevTools. עם זאת, אפשר להשתמש בגרסה אחרת של ChromeDriver עם גרסה של Chrome שיש לה רשימה חדשה יותר או ישנה יותר של מכשירים.

אם תנסו להשתמש בשם מכשיר ש-ChromeDriver לא מזהה, תופיע הודעת השגיאה: "<your device name> must be a valid device". כדי לדמות מכשיר ש-ChromeDriver לא מכיר, מפעילים את הדמיית המכשיר הנייד באמצעות מדדים ספציפיים למכשיר.

ציון מאפיינים ספציפיים של מכשירים

כדי להפעיל את הדמיית המכשיר הנייד, צריך לציין מאפיינים ספציפיים. המילון 'mobileEmulation' יכול להכיל מילונים מסוג deviceMetrics ו-clientHints ומחרוזת userAgent.

צריך לציין את מדדי המכשיר הבאים במילון deviceMetrics:

• 'width' – הרוחב בפיקסלים של מסך המכשיר
• 'height' – הגובה בפיקסלים של מסך המכשיר
• 'pixelRatio' – יחס הפיקסלים של המכשיר
• 'touch' – האם לדמות אירועי מגע. ערך ברירת המחדל הוא true, ובדרך כלל אפשר להשמיט אותו.
• 'נייד' – האם הדפדפן צריך להתנהג כסוכנות משתמש לנייד (הצגת פס גלילה שכבת-על, שליחת אירועי כיוון, צמצום התוכן כך שיתאים למסך הצפייה וכו'). ערך ברירת המחדל הוא true, ובדרך כלל אפשר להשמיט אותו.

המילון clientHints יכול לכלול את הרשומות הבאות:

• 'פלטפורמה' – מערכת ההפעלה. הערך יכול להיות ערך ידוע ('Android',‏ 'Chrome OS',‏ 'Chromium OS',‏ 'Fuchsia',‏ 'Linux',‏ 'macOS',‏ 'Windows') שתואם בדיוק לערך שהוחזר על ידי Chrome שפועל בפלטפורמה הנתונה, או ערך שהוגדר על ידי המשתמש. הערך הזה הוא חובה.
• 'mobile' – האם הדפדפן צריך לבקש גרסה של המשאב לנייד או למחשב. בדרך כלל, ב-Chrome שפועל בטלפון נייד עם Android, הערך הזה מוגדר כ-true. ב-Chrome במכשיר טאבלט Android, הערך הזה מוגדר כ-false. גם ב-Chrome במחשב, הערך הזה מוגדר כ-false. אפשר להשתמש במידע הזה כדי לציין הדמיה מציאותית. הערך הזה הוא חובה.
• שאר הרשומות הן אופציונליות וניתן להשמיט אותן, אלא אם הן רלוונטיות לבדיקה:
  • 'brands' – רשימה של זוגות של מותגים וגרסאות ראשיות. אם לא צוין ערך, הדפדפן ישתמש בערכים שלו.
  • 'fullVersionList' – רשימה של צמדי מותגים / גרסאות. הדפדפן משתמש בערכים משלו.
  • ‎"platformVersion" – גרסת מערכת ההפעלה. ברירת המחדל היא מחרוזת ריקה.
  • 'model' – דגם המכשיר. ברירת המחדל היא מחרוזת ריקה.
  • 'architecture' – ארכיטקטורת המעבד. הערכים הידועים הם 'x86' ו-'arm'. המשתמש יכול לספק כל ערך מחרוזת. ברירת המחדל היא מחרוזת ריקה.
  • 'bitness' – גודל הפלטפורמה. הערכים הידועים הם '32' ו-'64'. המשתמש יכול לספק כל ערך מחרוזת. ברירת המחדל היא מחרוזת ריקה.
  • "wow64" – אמולציה של Windows 32 ב-Windows 64. ערך בוליאני שמוגדר כברירת מחדל כ-false.

‏ChromeDriver יכול להסיק את הערך של 'userAgent' מ-'clientHints' בפלטפורמות הבאות: 'Android',‏ 'Chrome OS',‏ 'Chromium OS',‏ 'Fuchsia',‏ 'Linux',‏ 'macOS',‏ 'Windows'. לכן אפשר להשמיט את הערך הזה.

אם מילון clientHints לא מופיע (במצב הקודם), ChromeDriver מנסה להסיק את clientHints מ-userAgent. התכונה הזו לא מהימנה בגלל אי-בהירות פנימית בפורמט הערך של userAgent.

הטלפונים והטאבלטים שזמינים בחלונית Mobile Emulation מפורטים בקוד המקור של DevTools.

Java

Map<String, Object> deviceMetrics = new HashMap<>();
deviceMetrics.put("width", 360);
deviceMetrics.put("height", 640);
deviceMetrics.put("pixelRatio", 3.0);
Map<String, Object> mobileEmulation = new HashMap<>();
mobileEmulation.put("deviceMetrics", deviceMetrics);
mobileEmulation.put("userAgent", "Mozilla/5.0 (Linux; Android 4.2.1; en-us; Nexus 5 Build/JOP40D) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.166 Mobile Safari/535.19");
Map<String, Object> clientHints = new HashMap<>();
clientHints.put("platform", "Android");
clientHints.put("mobile", true);
mobileEmulation.put("clientHints", clientHints);
ChromeOptions chromeOptions = new ChromeOptions(); chromeOptions.setExperimentalOption("mobileEmulation", mobileEmulation); WebDriver driver = new ChromeDriver(chromeOptions);

Ruby

mobile_emulation = {
   "deviceMetrics" => { "width" => 360, "height" => 640, "pixelRatio" => 3.0 },
   "userAgent" => "Mozilla/5.0 (Linux; Android 4.2.1; en-us; Nexus 5 Build/JOP40D) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.166 Mobile Safari/535.19",
   "clientHints" => { "platform" => "Android", "mobile" => true}
}
caps = Selenium::WebDriver::Remote::Capabilities.chrome("chromeOptions" => mobile_emulation)
driver = Selenium::WebDriver.for :remote, url: 'http://localhost:4444/wd/hub', desired_capabilities: caps

Python

from selenium import webdriver
from selenium.webdriver.chrome.options import Options
mobile_emulation = {
   "deviceMetrics": { "width": 360, "height": 640, "pixelRatio": 3.0 },
   "userAgent": "Mozilla/5.0 (Linux; Android 4.2.1; en-us; Nexus 5 Build/JOP40D) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.166 Mobile Safari/535.19",
   "clientHints": {"platform": "Android", "mobile": True} }
chrome_options = Options()
chrome_options.add_experimental_option("mobileEmulation", mobile_emulation)
driver = webdriver.Chrome(chrome_options = chrome_options)

JSON

דוגמה להגדרה מלאה של אמולציה לנייד:

"mobileEmulation": {
  "userAgent": "Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko)
Chrome/111.0.0.0 Mobile Safari/537.36",
  "deviceMetrics": {
     "mobile": true,
     "touch": true,
     "width": 412,
     "height": 823,
     "pixelRatio": 1.75
  },
  "clientHints": {
     "brands": [
        {"brand": "Google Chrome", "version": "111"},
        {"brand": "Chromium", "version": "111"}
     ],
     "fullVersionList": [
        {"brand": "Google Chrome", "version": "111.0.5563.64"},
        {"brand": "Chromium", "version": "111.0.5563.64"}
     ],
     "platform": "Android",
     "platformVersion": "11",
     "architecture": "arm",
     "model": "lorem ipsum (2022)"
     "mobile": true,
     "bitness": "32",
     "wow64": false
  }
}

אמולציה בניידים לעומת מכשירים אמיתיים

מומלץ לבדוק אתרים במחשב באמצעות הדמיה לנייד, אבל זו לא שכפול מושלם של הבדיקה במכשיר עצמו. יש כמה הבדלים עיקריים, כולל:

• במכשירים ניידים יש בדרך כלל מעבד GPU שונה, שעלול להוביל לשינויים משמעותיים בביצועים.
• ממשק המשתמש לנייד לא מומר (במיוחד, הסתרת סרגל הכתובות משפיעה על גובה הדף).
• אין תמיכה בחלונות קופצים להסרת עמימות (שבהם בוחרים אחד מכמה יעדי מגע).
• הרבה ממשקי API לחומרה (לדוגמה, אירוע orientationchange) לא זמינים.