Proposal on handling invalid media queries

Hi Folks,

Section 3.1 of the Media Query specification ( says "Unknown media types evaluate
to false". While this might be acceptable for declarative CSS (sorta), it
poses problems in JavaScript using the window.matchMedia function (

# Problem

Here's the problem: there is no way to tell if a media query is implemented
in a given user agent, because unknown media features still evaluate to
false. Really, there are three possibilities: 1) MQ matches 2) MQ doesn't
match 3) MQ Is invalid. For example, in Chrome, the following returns false:

matchMedia('(min--moz-device-pixel-ratio: 2)').matches

which can imply either than the query didn't match, or was invalid. This
particular case is obviously invalid since moz-prefixing, but the general
case is very confusing because there's no distinction between "no match"
and "invalid".

# Proposal

To address this issue, propose to augment the MediaQueryList response with
an is_valid field, which would be true iff the media type, media feature
and media feature value are all known and valid. Invalid MQs in CSS should
cause exceptions in the command line (similar to invalid viewport
directives). For bonus points, there could be another (string) field with a
reason for the failed validation.

# Application

As new media query features are standardized, it will take some time for
browsers to implement them. During that period of partial support, it's
very important to be able to distinguish no-match and invalid. For example,
the newly added (pointer: fine) MQ will evaluate to false everywhere. Once
some browsers implement it, developers will start relying on it, leading to
false positives (or negatives).

- Boris

Received on Monday, 2 July 2012 11:33:01 UTC