Open ipopescu93 opened 3 years ago
I'm curious about this too.
Chrome has announced to ship this feature.
Intent to Ship: EyeDropper API https://groups.google.com/a/chromium.org/g/blink-dev/c/rdniQ0D5UfY/m/Aywn9XyyAAAJ
I think overall this seems reasonable. There's a bit of an open question with regards to how much UI is needed to get the user to reveal a color on their screen. Is an overlay enough (a la Fullscreen) or do we want to have the user explicitly confirm they want to share the color with the page? The former is probably more desirable for drawing applications, but might be problematic without something like cross-origin isolation as suggested in https://github.com/WICG/eyedropper-api/issues/13 as it would make stealing cross-origin pixels easy-ish.
It seems Chromium decided to ship this (it works on Canary at least) without such issues being resolved. Not sure if that was intentional? cc @mikewest
thanks @annevk! There are some mitigations currently in place to prevent stealing cross-origin pixels. We are also going to monitor the use of this API in the wild for abuse to see if any follow-up mitigations are needed.
@sefeng211 and I looked at the spec. Here are our concerns/questions so far:
:visited { background-color: rgba(0, 0, 0, 0.05); }
. When the user has picked a color, the page should know where the pointer is and therefore whether the link was visited.<input type=color>
and showPicker()
<input type=color eyedropper onchange="..." oncancel="...">
. Is a separate API necessary?I'd like to add that it would also be useful to provide an option to show the current color value(HEX,RGB etc.). This is provided in the Eyedropper in Firefox DevTools.
<input type="color" eyedropper format="hex">
Chrome shows it as rgb
, and when you open Eyedropper's popup, pressing the spacebar toggles whether the color value is shown or not.
Request for Mozilla Position on an Emerging Web Specification
Other information
TAG review: https://github.com/w3ctag/design-reviews/issues/587 Chrome Status entry: https://chromestatus.com/feature/6304275594477568
Thanks!