[whatwg] Outline style to use for drawSystemFocusRing

Rik Cabanier cabanier at gmail.com
Mon Jul 29 14:45:14 PDT 2013

On Wed, Jul 24, 2013 at 4:14 PM, Ian Hickson <ian at hixie.ch> wrote:

> On Wed, 24 Jul 2013, Dominic Mazzoni wrote:
> >
> > I'm looking into implementing
> > drawSystemFocusRing<
> http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-drawsystemfocusring
> >in
> > Blink, but it's unclear what style to use when drawing the focus ring
> > -
> > i.e. the color, thickness, etc., assuming that the user hasn't overridden
> > it for accessibility. Here are some possible interpretations:
> >
> > 1. Hard-code default values. I don't think this would be ideal, since it
> > wouldn't necessarily match the focus color of other elements that get the
> > focus color from the system.
> > 2. Get them from the default style of a generic element (which may match
> > the system focus style). This could work, but I think this is less
> flexible
> > for developers - if they picked a custom outline color for every other
> > element in their site but would have no way to override it for canvas
> > (other than using drawCustomFocusRing).
> > 3. Get them from the outline style of the canvas element. This means
> every
> > focus ring within the canvas would be the same, but otherwise I have no
> > objection.
> > 4. Get them from the outline style ofelement passed to
> drawSystemFocusRing.
> > This is my preference.
> The idea is it's supposed to be the system style (hence the name of the
> method, draw _system_ focus ring), and that if the authors wants a special
> style, they use drawCustomFocusRing() and if it returns true they draw it
> themselves (using strokeStyle and stroke(), or whatever).
> There's an example in the spec -- search for "couple of checkboxes".

That example doesn't show how the focus rings are supposed to render.
The spec says:

... draws a focus ring *around *the current default path or the given path


... draw a focus ring of the appropriate style along the intended path...

Which way should it be drawn?
It seems that the focus ring should be around the path and drawn in
accordance to the browser's algorithm of focus regions.

More information about the whatwg mailing list