Set real values for Chromium + Safari CSS @media properties

[queengooborg]

This PR is to assist in the efforts of #3710, or more specifically, #4294. I've browsed through WebKit and Blink to identify the exact versions where features were added/removed (if supported at all). Based on the following data, this sets versions within Chrome, Chrome Android, Safari, Safari iOS, Opera, Opera Android, Samsung Internet, and WebView:

css.at-rules.media.color, css.at-rules.media.device-aspect-ratio, css.at-rules.media.device-height, css.at-rules.media.device-width, css.at-rules.media.grid, css.at-rules.media.height, css.at-rules.media.width

1. CSS3 Media Queries implementation in WebKit 1f63b91e8004c50e4ab184a522913cadf5866ddd
2. Commit defines WebCore/css/MediaQueryEvaluator.cpp
3. Parsing script found in file in commit
4. File initially found in 521.13, contains parseAspectRatio function
5. Safari 3, Chrome 1

css.at-rules.media.aspect-ratio, css.at-rules.media.orientation

1. Support added in WebKit 9476eb7cbc7ca31b649e1a54ea3ecf69f00f1a76
2. https://bugs.webkit.org/show_bug.cgi?id=25197
3. Introduced in 532.0
4. Safari 4.1, Chrome 3
5. Note: Opera was set to "53" for some odd reason. This was changed to "true" to leave room for pre-15 Opera implementation.

css.at-rules.media.color-gamut

1. Support added in WebKit 1452c11ffcad445fd8a4b631cd4bdd6d167cec99
2. https://bugs.webkit.org/show_bug.cgi?id=155994
3. Introduced in 602.1.30
4. Chrome landed in https://storage.googleapis.com/chromium-find-releases-static/257.html#2575c4f8b8a7172537a762d069486d906bed1076
5. Safari 10.1, Chrome 58

css.at-rules.media.color-index

1. Support added in WebKit 53473ee6dda3543bb8ec6d38bc6af7c000fdef1b
2. https://bugs.webkit.org/show_bug.cgi?id=114468
3. Introduced in 538.10
4. Implemented in Chrome in https://chromium.googlesource.com/chromium/src/+/2f8a10bf0814821e9ae41103f0fbf0bb8c39c0cf/third_party/WebKit/Source/core/css/MediaQueryEvaluator.cpp, version estimated by date (Sat May 11 00:26:16 2013)
5. Safari 8, Chrome 29

css.at-rules.media.display-mode

1. Support added in WebKit c02dfcfb7cccb993614517f79560342e72a9d142
2. https://bugs.webkit.org/show_bug.cgi?id=180376
3. Introduced in 606.1.1
4. Chrome landed in https://storage.googleapis.com/chromium-find-releases-static/02b.html#02b80e73d179e8b87d007b197766fa5fca1a80ee
5. Safari 13, Chrome 45

css.at-rules.media.inverted-colors

1. Support added in WebKit a8a0da2b8e64f7dd4337b4062a46de32efd8f38a
2. https://bugs.webkit.org/show_bug.cgi?id=137535
3. Introduced in 601.1.10
4. No Chrome support
5. Safari 9.1, Chrome False

css.at-rules.media.monochrome

1. CSS3 Media Queries implementation in WebKit 1f63b91e8004c50e4ab184a522913cadf5866ddd
2. Commit defines WebCore/css/MediaQueryEvaluator.cpp
3. Parsing script found in file in commit
4. File initially found in 521.13, contains parseAspectRatio function
5. Safari 3, Chrome 1
6. Note: The commit for inverted-colors states that it also implements monochrome support, though this commit shows the monochrome property being added.

css.at-rules.media.resolution

1. Support added in WebKit 2a707b5341589180996070918e4f390c4ba32883
2. https://bugs.webkit.org/show_bug.cgi?id=99077
3. Introduced in 537.30
4. Safari 6.1, Chrome 27

css.at-rules.media.-webkit-animation, css.at-rules.media.-webkit-transition, css.at-rules.media.-webkit-transform-2d, css.at-rules.media.-webkit-transform-3d

1. Support added in WebKit 301b3b21c60c97c0a08d797d0da1718048988410
2. Introduced in 528.10
3. Safari 4, Chrome 2

css.at-rules.media.-webkit-device-pixel-ratio, css.at-rules.media.-webkit-max-device-pixel-ratio, css.at-rules.media.-webkit-min-device-pixel-ratio

1. Support added in WebKit 0b5dc49f66efad69156404f1adff88ccce602a83
2. Introduced in 521.14
3. Safari 3, Chrome 1

Note: all commit hashes are for the WebKit Git mirror.

I have requested @jpmedley’s review on all the Chrome versions, but any and all reviews are welcome!

[queengooborg]

I'm confident in my Safari versions, and Chrome's already been approved. I'll go ahead and merge this one.

[fvsch]

@vinyldarkscratch The resolution part vs WebKit seems strange because:

1. I'm not getting resolution or dppx to work in Safari at all (see my tests in Support for the x alias of dppx in resolution media queries #4224).
2. According to the still open https://bugs.webkit.org/show_bug.cgi?id=78087 resolution support is behind a build-time flag in WebKit.

(If anyone gets @media (resolution: …) to work in Safari, I would love to know.)

[queengooborg]

Hmm...thanks for the heads up, @fvsch! Looking at the two bugs (the one you've linked and the one I've linked), it appears that they both block each other, and based upon the titles, I would assume they are the same thing, but then why wouldn't one be marked as a duplicate of the other?

From the example on MDN, I tested in Chrome and Safari, and can confirm your suspicions that Safari does not support this feature. So then when did Chrome implement support...? This is something to look into once again. I would be grateful if you could follow up to this one as I'm working on the rest of the Lena Horne milestone, but I totally understand if you're unable to!

[fvsch]

For the Chrome release with resolution support, Can I Use points to https://www.chromestatus.com/feature/5944509615570944 which says Chrome 29, which we have in the css.types.resolution data too. So I'll probably set css.at-rules.media.resolution to Chrome 29 instead of 27. (It seems very possible that it was in the 27 build but not on by default until 29.)

[queengooborg]

The ChromeStatus post also specifically has the wording "Enabled by default (tracking bug) in: Chrome 29", which I think confirms your theory in itself. That would also explain why there's a commit for it in WebKit, hidden behind a flag -- it must have been added in Safari 6.1 / Chrome 27, but never enabled in Safari.

(This also tells me I need to be more careful about flags!)