Throughout your testing, for some reason, you might be required to get a specific height and width of the device you are using for some confirmation that you are actually using a device that matches those dimensions or to generate a screenshot for example.
When doing this on an iOS device you might notice that using common methods such as getWidth and getHeight returns numbers you might not expect.
There are a lot of factors to consider because this usually returns the current window height/width and it's important to remember that these commands return values in CSS values, not the actual value. So if your display resolution is 1620 x 2160 these will not match up. Everything in Selenium / Appium is measured in CSS pixels, according to the W3C specs. Android for some reason returns the "actual" size. To get the actual size, you need CSS size times the devicePixelRatio.
Example:
The commands that are being used by Appium are almost the same as these commands you can add to your devtools from Chrome.
console.log('window.screen.width = ', window.screen.width)
console.log('window.screen.height = ', window.screen.height)
console.log('window.devicePixelRatio = ', window.devicePixelRatio)
Using a local sim for an iPad and running these commands this is what is returned:
In your tests you could execute something like this to obtain more accurate information and the workflow would be to check whether the platform is Android, if not, then execute this:
const {height, width, devicePixelRatio } =
driver.execute('const devicePixelRatio = window.devicePixelRatio || 1;
return {devicePixelRatio: devicePixelRatio, height: window.screen.height *
devicePixelRatio, width: window.screen.width * devicePixelRatio}');
This will help you obtain better results that seemingly fit the resolution rather than CSS values.
If you have any other questions please be sure to use our Support team.