Skip to main content

Emulation

set_viewport​

Overrides device screen dimensions and emulates viewport. When :mobile is true, this also enables touch emulation (navigator.maxTouchPoints, ontouchstart) alongside the mobile viewport metrics.

  • options Hash
    • :width Integer, viewport width. 0 by default
    • :height Integer, viewport height. 0 by default
    • :scale_factor Float, device scale factor. 0 by default
    • :mobile Boolean | nil, true emulates a mobile device with touch, false a desktop without touch, nil a desktop and leaves touch emulation as is. nil by default
page.set_viewport(width: 1000, height: 600, scale_factor: 3)

:width, :height, and :scale_factor all default to 0, which per the DevTools protocol disables overriding that particular value. This means mobile: can be enabled on its own, at the page's current size, without specifying a device size preset:

page.set_viewport(mobile: true)

Turning touch emulation off with mobile: false makes Chrome reset hover and pointer media features to the detected input devices, which undoes --blink-settings overrides such as primaryHoverType until the next navigation. Leave :mobile out unless the page was switched to mobile before.