Mobil emülasyon

Chrome, Chrome Geliştirici Araçları'ndaki Mobil Emülasyon özelliğini etkinleştirerek, kullanıcıların Chrome'un masaüstü sürümünden mobil bir cihazda ("Nexus 7" tablet veya "iPhone 5" gibi) Chrome'un öykünmesine olanak tanır. Bu özellik web geliştirmeyi hızlandırır ve geliştiricilerin, bir web sitesinin mobil cihazda nasıl görüntüleneceğini gerçek bir cihaza gerek kalmadan hızlı bir şekilde test etmesine olanak tanır. ChromeDriver, bir sözlük değeriyle belirtilen "mobileEmulation" özelliği aracılığıyla da Mobil Emülasyonu etkinleştirebilir.

Geliştirici Araçları Öykünmesi panelinde olduğu gibi, ChromeDriver'da da Mobil Emülasyonu etkinleştirmenin iki yolu vardır: bilinen bir cihazı belirtmek veya tek tek cihaz özelliklerini belirtmek. "mobileEmulation" sözlüğünün biçimi hangi yöntemin istendiğine bağlıdır.

Bilinen Bir Mobil Cihazı Belirtme

Mobil Emülasyonu belirli bir cihaz adıyla etkinleştirmek için "mobileEmulation" sözlüğünün bir "deviceName" içermesi gerekir. "deviceName" değeri olarak DevTools emülasyon panelindeki geçerli bir cihaz adını kullanın.

Cihazlar ayarının ekran görüntüsü

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

Tek Tek Cihaz Özelliklerini Belirtme

Ayrıca, özellikleri tek tek belirterek Mobil Emülasyonu etkinleştirmek de mümkündür. Mobil Emülasyon'u bu şekilde etkinleştirmek için "mobileEmulation" sözlüğü, "deviceMetrics" ve "clientHints" sözlükleri ile bir "userAgent" dizesi içerebilir. "deviceMetrics" sözlüğünde aşağıdaki cihaz metrikleri belirtilmelidir:

  • "width" - cihaz ekranının piksel cinsinden genişliği
  • "height" - cihaz ekranının piksel cinsinden yüksekliği
  • "pixelRatio" - cihazın piksel oranı
  • "dokunma": dokunma etkinliklerinin emüle edilip edilmeyeceği. Değer, varsayılan olarak doğru değerine ayarlanır ve genellikle atlanabilir.
  • "mobile" - tarayıcının bir mobil kullanıcı aracısı (yer paylaşımlı kaydırma çubukları, yayma etkinlikleri, içeriği görüntü alanına sığacak şekilde küçültme vb.) olarak davranması gerekip gerekmediği. Değer, varsayılan olarak doğru değerine ayarlanır ve genellikle atlanabilir.

"clientHints" sözlüğü aşağıdaki girişleri içerebilir:

  • "platform" - işletim sistemi. Belirtilen platformda çalışan Chrome'un döndürdüğü değerle tam olarak eşleşen bilinen bir değer ("Android", "Chrome OS", "Chromium OS", "Fuşya", "Linux", "macOS", "Windows") veya kullanıcı tanımlı bir değer olabilir. Bu değer zorunludur.
  • "mobile": tarayıcının mobil mi yoksa masaüstü kaynak sürümünü mü istemesi gerektiği. Genellikle Android yüklü bir cep telefonunda çalışan Chrome bu değeri true olarak ayarlar. Tablet Android cihazdaki Chrome, bu değeri false olarak ayarlar. Masaüstü cihazdaki Chrome da bu değeri false olarak ayarlar. Bu bilgileri gerçekçi bir emülasyon belirtmek için kullanabilirsiniz. Bu değer zorunludur.
  • Geri kalan girişler isteğe bağlıdır ve testle ilgili olmadıkları sürece atlanabilir:
    • "markalar" - marka / ana sürüm çiftlerinin listesi. Atlanırsa tarayıcı kendi değerlerini kullanır.
    • "fullVersionList" - marka / sürüm çiftlerinin listesi. Tarayıcı kendi değerlerini kullanmaktadır.
    • "platformVersion" - OS sürümü. Varsayılan olarak boş dize kullanılır.
    • "model" - cihaz modeli. Varsayılan olarak boş dize kullanılır.
    • "mimari" - CPU mimarisi. Bilinen değerler "x86" ve "arm"dir. Kullanıcı istediği dize değerini girmekte serbesttir. Varsayılan olarak boş dize kullanılır.
    • "bitness": Platform bit hızı. Bilinen değerler "32" ve "64"tür. Kullanıcı istediği dize değerini girmekte serbesttir. Varsayılan olarak boş dize kullanılır.
    • "wow64" - Windows 64'te Windows 32 emülasyonu. Varsayılan olarak "false" olan bir boole değeridir.

ChromeDriver, "userAgent" değerini şu platformlarda "clientHints"ten elde edebilir: "Android", "Chrome OS", "Chromium OS", "Fuşsia", "Linux", "macOS", "Windows". Dolayısıyla bu değer atlanabilir.

"clientHints" sözlüğü atlanırsa (eski mod) ChromeDriver, "userAgent"tan "clientHints" değerini tahmin etmek için elinden geleni yapar. Ancak bu işlev, "userAgent" değer biçiminin dahili belirsizliği nedeniyle güvenilir şekilde çalışmıyor.

Mobil Emülasyon paneli kapsamında kullanılabilen telefonları ve tabletleri DevTools kaynak kodunda bulabilirsiniz.

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)

Tam donanımlı mobil emülasyon yapılandırması örneği:

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

Mobil emülasyon ile gerçek cihazlar arasındaki farklar

Mobil emülasyon kullanarak bir mobil web sitesini masaüstünde test etmek yararlı olabilir, ancak test kullanıcıları aşağıdakiler gibi birçok küçük fark olduğunun farkında olmalıdır:

  • Bu da büyük performans değişikliklerine yol açabilecek olan tamamen farklı GPU'ya sahiptir.
  • mobil kullanıcı arayüzü taklit edilmez (özellikle, gizlenen URL çubuğu sayfa yüksekliğini etkiler);
  • açıklama pop-up'ı (birkaç dokunma hedefinden birini seçtiğiniz yer) desteklenmez;
  • birçok donanım API'si (örneğin, yön değişikliği etkinliği) mevcut değildir.