Support for target-densitydpi is removed from WebKit

Question

According to this https://bugs.webkit.org/show_bug.cgi?id=88047 WebKit dropped the support for target-densitydpi from viewport params. Unfortunately, the bug description states neither the motivation for the change, nor the workaround.

Certain web-pages that wanted to prevent scaling on mobile devices had the following declaration of the viewport:

<meta name="viewport" content="width=device-width,  initial-scale=1.0, maximum-scale=1.0,  user-scalable=no, target-densitydpi=device-dpi"/> 

Now this code outputs an error in Chrome (tested with 21.0.1180.49 beta-m). Please advice what is the supposed way to make a web-page without the error messages and retain the same behavior as before with target-densitydpi=device-dpi"

Answer 1

I achieved the same thing on the latest Chrome for Android using this jQuery:

<meta content='user-scalable=no, initial-scale=1, width=device-width' id='viewport' name='viewport'>  var viewPortScale = 1 / window.devicePixelRatio;  $('#viewport').attr('content', 'user-scalable=no, initial-scale='+viewPortScale+', width=device-width'); 

This sets the initial-scale viewport meta tag setting to the correct scale for 1 CSS Pixel == 1 Device Pixel.

You can't use 'width='+screen.width because screen.width doesn't return the physical pixel dimensions. I tried using http://responsejs.com/labs/dimensions/ on my Nexus 7 in Chrome and all the numbers are viewport pixels.