محاكاة الأجهزة الجوّالة

يتيح Chrome للمستخدمين محاكاة Chrome على جهاز جوّال من سطح المكتب Chrome، من خلال تفعيل وضع الجهاز باستخدام "أدوات مطوري البرامج في Chrome". هذه الميزة كما تسرّع تطوير الويب، كما تسمح للمطورين باختبار كيفية عمل موقع الويب يتم عرضه على جهاز جوّال، دون الحاجة إلى جهاز حقيقي. يمكن لـ ChromeDriver أيضًا محاكاة الأجهزة باستخدام طريقة "mobileEmulation" محددة باستخدام قيمة القاموس.

كما هو الحال في "أدوات مطوري البرامج"، هناك طريقتان في ChromeDriver لتفعيل ميزة "محاكاة الأجهزة الجوّالة":

  • تحديد جهاز معروف
  • تحديد سمات الأجهزة الفردية

تمثّل هذه السمة تنسيق "mobileEmulation" القاموس على الطريقة المطلوبة.

تحديد جهاز جوّال معروف

لتفعيل محاكاة الجهاز باستخدام جهاز محدد، يمكنك استخدام الزر "mobileEmulation" يجب أن يحتوي القاموس على "deviceName". استخدِم اسم جهاز صالحًا من إعدادات الأجهزة التي تمت محاكاتها في "أدوات مطوّري البرامج" كقيمة "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);

روبي

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())

تحديد سمات الأجهزة الفردية

يمكنك تفعيل "محاكاة الأجهزة الجوّالة" من خلال تحديد سمات فردية. تشير رسالة الأشكال البيانية "mobileEmulation" يمكن أن يحتوي القاموس على deviceMetrics وclientHints القواميس وسلسلة userAgent.

يجب تحديد مقاييس الأجهزة التالية في "deviceMetrics". القاموس:

  • &quot;width&quot; - عرض شاشة الجهاز بالبكسل
  • "الارتفاع" - ارتفاع شاشة الجهاز بالبكسل
  • "pixelRatio" - نسبة وحدات البكسل في الجهاز
  • "لمس" - ما إذا كان سيتم محاكاة أحداث اللمس أم لا. ويتم ضبط القيمة تلقائيًا على "صحيح" ويمكن حذفها عادةً.
  • "جهاز جوّال" - ما إذا كان يجب أن يعمل المتصفح كوكيل مستخدم للأجهزة الجوّالة (تراكب أشرطة التمرير أو إطلاق أحداث الاتجاه أو تصغير المحتوى ليلائم إطار العرض وما إلى ذلك). ويتم ضبط القيمة تلقائيًا على "صحيح" ويمكن حذفها عادةً.

يعتبر "clientHints" يمكن أن يحتوي القاموس على الإدخالات التالية:

  • "المنصة" - نظام التشغيل. ويمكن أن تكون إما قيمة معروفة ("Android" أو "نظام التشغيل Chrome" أو "نظام التشغيل Chromium" أو "Fuchsia" أو "Linux" أو "macOS" أو "Windows") أو تتطابق تمامًا مع القيمة التي يعرضها Chrome الذي يعمل على النظام الأساسي المعيّن، أو يمكن أن تكون قيمة من تحديد المستخدم. هذه القيمة إلزامية.
  • "جهاز جوّال" - ما إذا كان يجب أن يطلب المتصفّح إصدارًا للمصدر المخصّص للأجهزة الجوّالة أو لأجهزة الكمبيوتر المكتبي وعادةً ما يضبط Chrome الذي يعمل بنظام التشغيل Android على هذه الهواتف الجوّالة على "صحيح". ويضبط Chrome على جهاز Android لوحي هذه القيمة على "خطأ". ويضبط Chrome على جهاز الكمبيوتر المكتبي أيضًا هذه القيمة على "خطأ". ويمكنك استخدام هذه المعلومات لتحديد محاكاة واقعية. هذه القيمة إلزامية.
  • الإدخالات المتبقية اختيارية ويمكن حذفها إلا إذا كانت ذات صلة بالاختبار:
    • "العلامات التجارية" - قائمة بأزواج العلامة التجارية / الإصدارات الرئيسية. إذا تم حذفها، يستخدم المتصفّح قيمه الخاصة.
    • &quot;fullVersionList&quot; - قائمة بأزواج العلامة التجارية / الإصدار. تم حذف المتصفّح من خلال استخدام قيمه الخاصة.
    • "platformVersion" - إصدار نظام التشغيل. إعداد تلقائي على سلسلة فارغة.
    • &quot;model&quot; - طراز الجهاز. إعداد تلقائي على سلسلة فارغة.
    • "الهندسة المعمارية" - بنية وحدة المعالجة المركزية (CPU). القيم المعروفة هي "x86" و"الذراع". يستطيع المستخدم تقديم أي قيمة سلسلة. إعداد تلقائي على سلسلة فارغة.
    • "bitness" - وحدة بت النظام الأساسي. القيم المعروفة هي "32" و"64". يستطيع المستخدم تقديم أي قيمة سلسلة. إعداد تلقائي على سلسلة فارغة.
    • "wow64" - محاكاة Windows 32 على Windows 64. قيمة منطقية يتم ضبطها تلقائيًا على "خطأ".

بإمكان ChromeDriver استنتاج كلمة "userAgent" القيمة من "clientHints" على الأنظمة الأساسية التالية: "Android"، و"ChromeOS"، و"نظام التشغيل Chromium"، وFuchsia، وLinux، و"macOS"، وWindows. وبالتالي، يمكن حذف هذه القيمة.

إذا كان "clientHints" تم حذف القاموس (الوضع القديم) يعمل ChromeDriver على أكمل وجه لاستنتاج "clientHints" من "userAgent". هذه الميزة غير موثوقة بسبب الغموض الداخلي "userAgent" تنسيق القيمة.

يمكن للهواتف والأجهزة اللوحية المتوفرة ضمن لوحة محاكاة الجوّال يمكن العثور عليها في رمز المصدر في "أدوات مطوري البرامج"

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);

روبي

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
  }
}

الفرق بين محاكاة الأجهزة الجوّالة والأجهزة الحقيقية

من المفيد اختبار مواقع الويب على سطح مكتب باستخدام محاكاة الجوّال، لكنه ليس تكرارًا مثاليًا للاختبار على الجهاز الفعلي. هناك بعض الاختلافات الرئيسية، منها:

  • غالبًا ما تحتوي الأجهزة الجوّالة على وحدة معالجة رسومات مختلفة، ما قد يؤدي إلى تغييرات كبيرة في الأداء.
  • لا تتم محاكاة واجهة مستخدم الجوّال (خصوصًا أن إخفاء شريط العناوين يؤثر في ارتفاع الصفحة).
  • لا تتوفّر النوافذ المنبثقة للتوضيح (التي تختار فيها أحد مساحات اللمس القليلة).
  • لا تتوفّر العديد من واجهات برمجة تطبيقات الأجهزة (مثل حدث orientationchange).