160166 2016-07-25 09:37:08 -0700 color-gamut media query returns incorrect results 2016-07-29 10:41:33 -0700 1 1 1 Unclassified WebKit CSS Safari Technology Preview Mac OS X 10.11 RESOLVED FIXED InRadar P2 Major --- 1 craig.hockenberry dino dino webkit-bug-importer oldest_to_newest 1214212 0 craig.hockenberry 2016-07-25 09:37:08 -0700 On an iMac (Retina 5K, 27-inch, Late 2014) with the default profile of "iMac" selected in System Preferences > Display > Color, the following media query matches even though the color-gamut is not Display P3: @media (-webkit-min-device-pixel-ratio: 2) and (color-gamut: p3), (min-resolution: 2dppx) and (color-gamut: p3) { section.background { background-image: url(bkgd-p3@2x.png); } } Likewise, the first <source> in this <picture> container is selected: <picture> <source media="(-webkit-min-device-pixel-ratio: 2) and (min-width: 600px), (min-resolution: 2dppx) and (min-width: 600px)" srcset="photo-p3@2x.jpg"> <source media="(-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx)" srcset="photo@2x.jpg"> <source media="(min-width: 600px)" srcset="photo-p3.jpg"> <img src="photo.jpg" srcset="photo@2x.jpg 2x" alt="A photo that uses a media query to select a wider gamut image"> </picture> Finally, the following JavaScript shows the "Your screen color-gamut is Display P3": function testColorGamut(event) { if (window.matchMedia('(color-gamut: rec2020)').matches) { alert('Your screen color-gamut is Rec. 2020'); } else if (window.matchMedia('(color-gamut: p3)').matches) { alert('Your screen color-gamut is Display P3'); } else if (window.matchMedia('(color-gamut: srgb)').matches) { alert('Your screen color-gamut is sRGB'); } else { alert('The color gamut could not be determined'); } } The following page demonstrates this issue: http://furbo.org/color/ResponsiveColor/ 1214217 1 craig.hockenberry 2016-07-25 09:44:14 -0700 Build is Release 9 (Safari 9.1.2, WebKit 11602.1.41) 1214350 2 craig.hockenberry 2016-07-25 15:16:22 -0700 The media query appears to be working correctly on iOS 10. My iPad mini matches the color-gamut: srgb, while the iPad Pro 9.7 matches p3. I haven't done extensive testing, but perhaps this problem is limited to the desktop browser. 1214428 3 dino 2016-07-25 18:15:49 -0700 It should work on macOS, so this is a bug. 1214429 4 webkit-bug-importer 2016-07-25 18:16:18 -0700 <rdar://problem/27537577> 1215466 5 284840 dino 2016-07-28 17:01:28 -0700 Created attachment 284840 Patch 1215485 6 284840 darin 2016-07-28 19:24:15 -0700 Comment on attachment 284840 Patch View in context: https://bugs.webkit.org/attachment.cgi?id=284840&action=review > Source/WebCore/ChangeLog:11 > + to a customized color space collaboration on an external calibration, you mean? 1215587 7 284840 dino 2016-07-29 10:38:51 -0700 Comment on attachment 284840 Patch View in context: https://bugs.webkit.org/attachment.cgi?id=284840&action=review >> Source/WebCore/ChangeLog:11 >> + to a customized color space collaboration on an external > > calibration, you mean? Yes! Thanks. 1215588 8 dino 2016-07-29 10:41:33 -0700 Committed r203903: <http://trac.webkit.org/changeset/203903> 284840 2016-07-28 17:01:28 -0700 2016-07-28 19:23:42 -0700 Patch bug-160166-20160728170015.patch text/plain 2211 dino U3VidmVyc2lvbiBSZXZpc2lvbjogMjAzODI1CmRpZmYgLS1naXQgYS9Tb3VyY2UvV2ViQ29yZS9D aGFuZ2VMb2cgYi9Tb3VyY2UvV2ViQ29yZS9DaGFuZ2VMb2cKaW5kZXggMTU1M2FhZTI4MDIyYzA1 NjIxMjUyZDA5NWJjYjA0ZmU0MjU2ZmRmZi4uZGEyNjUyNDhiMmVmZDJlZGQ3ZDFhMmI4ZTc3MjY0 YmYxODRkOGZlMyAxMDA2NDQKLS0tIGEvU291cmNlL1dlYkNvcmUvQ2hhbmdlTG9nCisrKyBiL1Nv dXJjZS9XZWJDb3JlL0NoYW5nZUxvZwpAQCAtMSw1ICsxLDI2IEBACiAyMDE2LTA3LTI4ICBEZWFu IEphY2tzb24gIDxkaW5vQGFwcGxlLmNvbT4KIAorICAgICAgICBjb2xvci1nYW11dCBtZWRpYSBx dWVyeSByZXR1cm5zIGluY29ycmVjdCByZXN1bHRzCisgICAgICAgIGh0dHBzOi8vYnVncy53ZWJr aXQub3JnL3Nob3dfYnVnLmNnaT9pZD0xNjAxNjYKKyAgICAgICAgPHJkYXI6Ly9wcm9ibGVtLzI3 NTM3NTc3PgorCisgICAgICAgIFJldmlld2VkIGJ5IE5PQk9EWSAoT09QUyEpLgorCisgICAgICAg IFdoaWxlIEkgd2FzIHVuYWJsZSB0byByZXByb2R1Y2UgdGhlIG9yaWdpbmF0b3IncyBpc3N1ZSwK KyAgICAgICAgd2UgY29tbXVuaWNhdGVkIHZpYSBlbWFpbCBhbmQgaXQgbWlnaHQgaGF2ZSBiZWVu IHJlbGF0ZWQKKyAgICAgICAgdG8gYSBjdXN0b21pemVkIGNvbG9yIHNwYWNlIGNvbGxhYm9yYXRp b24gb24gYW4gZXh0ZXJuYWwKKyAgICAgICAgZGlzcGxheS4KKworICAgICAgICBBbnl3YXksIEkg dG9vayB0aGlzIG9wcG9ydHVuaXR5IHRvIHVwZGF0ZSB0byB1c2UgdGhlCisgICAgICAgIG1vcmUg YXBwcm9wcmlhdGUgQVBJIGZvciBkZXRlY3Rpb24gb24gbWFjT1MgU2llcnJhLgorCisgICAgICAg IENvdmVyZWQgYnkgdGhlIGV4aXN0aW5nIGZhc3QvbWVkaWEvbXEtY29sb3ItZ2FtdXQuaHRtbCB0 ZXN0LgorCisgICAgICAgICogcGxhdGZvcm0vbWFjL1BsYXRmb3JtU2NyZWVuTWFjLm1tOgorICAg ICAgICAoV2ViQ29yZTo6c2NyZWVuU3VwcG9ydHNFeHRlbmRlZENvbG9yKTogVXNlIE5TU2NyZWVu IGNhblJlcHJlc2VudERpc3BsYXlHYW11dC4KKworMjAxNi0wNy0yOCAgRGVhbiBKYWNrc29uICA8 ZGlub0BhcHBsZS5jb20+CisKICAgICAgICAgUkVHUkVTU0lPTiAocjIwMjg4MCk6IERlZmF1bHQg Y29udHJvbHMgcGlwIGdseXBoIGludmVydGVkCiAgICAgICAgIGh0dHBzOi8vYnVncy53ZWJraXQu b3JnL3Nob3dfYnVnLmNnaT9pZD0xNjAzMDQKICAgICAgICAgPHJkYXI6Ly9wcm9ibGVtLzI3NTc4 NDQ3PgpkaWZmIC0tZ2l0IGEvU291cmNlL1dlYkNvcmUvcGxhdGZvcm0vbWFjL1BsYXRmb3JtU2Ny ZWVuTWFjLm1tIGIvU291cmNlL1dlYkNvcmUvcGxhdGZvcm0vbWFjL1BsYXRmb3JtU2NyZWVuTWFj Lm1tCmluZGV4IGYxYzBjYzM3YzhhZmE1NzgwNGY2NmQzYWM3ZjEyMzgyOTIxMTQyM2QuLmM5ZjEx YWFiZTc0MWQ4YjA1ZjUwZGU3NjZhZjY2YWUyYTAzYjA1MzEgMTAwNjQ0Ci0tLSBhL1NvdXJjZS9X ZWJDb3JlL3BsYXRmb3JtL21hYy9QbGF0Zm9ybVNjcmVlbk1hYy5tbQorKysgYi9Tb3VyY2UvV2Vi Q29yZS9wbGF0Zm9ybS9tYWMvUGxhdGZvcm1TY3JlZW5NYWMubW0KQEAgLTE0MywxMSArMTQzLDEw IEBAIGJvb2wgc2NyZWVuU3VwcG9ydHNFeHRlbmRlZENvbG9yKFdpZGdldCogd2lkZ2V0KQogICAg IGlmICghd2lkZ2V0KQogICAgICAgICByZXR1cm4gZmFsc2U7CiAKLSAgICBhdXRvIGNvbG9yU3Bh Y2UgPSBzY3JlZW4od2lkZ2V0KS5jb2xvclNwYWNlLkNHQ29sb3JTcGFjZTsKLQogI2lmIF9fTUFD X09TX1hfVkVSU0lPTl9NSU5fUkVRVUlSRUQgPj0gMTAxMjAwCi0gICAgcmV0dXJuIENHQ29sb3JT cGFjZUlzV2lkZUdhbXV0UkdCKGNvbG9yU3BhY2UpOworICAgIHJldHVybiBbc2NyZWVuKHdpZGdl dCkgY2FuUmVwcmVzZW50RGlzcGxheUdhbXV0Ok5TRGlzcGxheUdhbXV0UDNdOwogI2Vsc2UKKyAg ICBhdXRvIGNvbG9yU3BhY2UgPSBzY3JlZW4od2lkZ2V0KS5jb2xvclNwYWNlLkNHQ29sb3JTcGFj ZTsKICAgICBhdXRvIGljY0RhdGEgPSBhZG9wdENGKENHQ29sb3JTcGFjZUNvcHlJQ0NQcm9maWxl KGNvbG9yU3BhY2UpKTsKICAgICBhdXRvIHByb2ZpbGUgPSBhZG9wdENGKENvbG9yU3luY1Byb2Zp bGVDcmVhdGUoaWNjRGF0YS5nZXQoKSwgbnVsbHB0cikpOwogICAgIHJldHVybiBwcm9maWxlICYm IENvbG9yU3luY1Byb2ZpbGVJc1dpZGVHYW11dChwcm9maWxlLmdldCgpKTsK