CSS Pixel metrics are changed when a user zooms in / out of a site:
window.matchMedia('(-webkit-min-device-pixel-ratio: 1)').matches
should change as a result, but does not.
Test (using Mozilla prefixes), from Robert O'Callahan on the whatwg lists:
<style>
div { display:none; }
@media screen and (min--moz-device-pixel-ratio: 1.5) {
.in { display:block; }
}
@media screen and (max--moz-device-pixel-ratio: 0.66666666) {
.out { display:block; }
}
</style>
<div class="in">Zoomed in by a factor of at least 1.5</div>
<div class="out">Zoomed out by a factor of at least 1.5</div>

This works for Firefox 4, when using browser zoom:
// http://kb.mozillazine.org/Toolkit.zoomManager.zoomValues
#canvas.CompatibilityMozScreen { width: 1px; }
@media all and (min--moz-device-pixel-ratio: .3) {
#canvas.CompatibilityMozScreen { width: .3px; }
}
@media all and (min--moz-device-pixel-ratio: .5) {
#canvas.CompatibilityMozScreen { width: .5px; }
}
@media all and (min--moz-device-pixel-ratio: .67) {
#canvas.CompatibilityMozScreen { width: .67px; }
}
This does not work in WebKit:
@media all and (-webkit-min-device-pixel-ratio: .8) {
#canvas.CompatibilityMozScreen { width: .8px; }
}
@media all and (-webkit-min-device-pixel-ratio: 1) {
#canvas.CompatibilityMozScreen { width: 1px; }
}
@media all and (-webkit-min-device-pixel-ratio: 2) {
#canvas.CompatibilityMozScreen { width: 2px; }
}
Currently, in webkit, I must look at window.innerWidth / window.outerWidth
or some document.body metrics in comparison.
Microsoft simply exposes the values in window.screen.
WebKit only exposes window.devicePixelRatio as a value other than 1, on mobile distributions. I need the current 'zoom' of the user, so that I can show them crisp/clear renderings in <canvas> and use alternate image resources. This is an important issue for accessibility.
Mozilla has a different model for their window.*width mechanics than webkit. This split happened many years ago, and should not get-in-the-way of fixing the issue I'm bringing forward.
Mozilla does not expose a mutated devicePixelRatio directly, they require the CSS hack above to access the data. They do expose it directly to trusted scripts (browser extensions).
If there is a "consensus" standard, it's the CSS selectors. Otherwise, follow Microsoft's route, of simply putting the X dpi / Y dpi in the window.screen object. I don't see a need to create a third option.
-Charles