[Webkit-unassigned] [Bug 160166] New: color-gamut media query returns incorrect results

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Mon Jul 25 09:37:08 PDT 2016


https://bugs.webkit.org/show_bug.cgi?id=160166

            Bug ID: 160166
           Summary: color-gamut media query returns incorrect results
    Classification: Unclassified
           Product: WebKit
           Version: Safari Technology Preview
          Hardware: Macintosh
                OS: OS X 10.11
            Status: NEW
          Severity: Major
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: craig.hockenberry at gmail.com

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 at 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 at 2x.jpg">
    <source media="(-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx)" srcset="photo at 2x.jpg">
    <source media="(min-width: 600px)" srcset="photo-p3.jpg">
    <img src="photo.jpg" srcset="photo at 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/

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.webkit.org/pipermail/webkit-unassigned/attachments/20160725/5d40af6d/attachment.html>


More information about the webkit-unassigned mailing list