[whatwg] Outline style to use for drawSystemFocusRing

Rik Cabanier cabanier at gmail.com
Mon Jan 6 20:01:33 PST 2014


On Wed, Oct 16, 2013 at 12:46 PM, Ian Hickson <ian at hixie.ch> wrote:

>
> ...
>
> On Wed, 2 Oct 2013, Rik Cabanier wrote:
> >
> > I don't understand. If the path that is active during
> > drawCustom/SystemFocusRing is off screen and the element is focused, the
> > browser will scroll to that area.
>
> drawCustomFocusRing() and drawSystemFocusRing() shouldn't cause anything
> to scroll. That would be very confusing, IMHO. (When would you scroll?
> Consider the case of the control originally being off-screen on purpose,
> and animating into position. You want the focus ring drawn the whole time,
> and the zoom to follow it maybe, but you only want to scroll once, at the
> start, to the location that it will have at the end.)


I think you misunderstood. The drawCustomFocusRing() and
drawSystemFocusRing() don't cause scrolling, it's when you focus the
fallback element that the browser should scroll.

This does mean that the spec should be updated. Right now, step 1 [1]
states that if the element is not focused, drawSystemFocusRing will abort.
Instead, the browser should update the region of the fallback content and
then continue with step 1.
With some pseudo code:
a. call drawSystemFocusRing

ctx.moveto(...); ctx.lineTo(...); // draw the region of the path

ctx.drawSystemFocusRing(hiddenElement); // element is not focused but
update the region of hiddenElement

b. focus the element (either by tabbing or hiddenElement.focus()) ->
browser should scroll so the focus ring is visible on screen.

I was told the current implementation in Blink already does this.
The Firefox implementation currently does not; however, once an element was
focused, the browser knows about the region of the fallback content and
will do the scrolling. (Webkit would do so as well, but that patch didn't
land over objections from Ryosuke)



1:
http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-drawsystemfocusring


More information about the whatwg mailing list