From 1bfed9c2e9c0955011020c64c890092fbbd1e3d2 Mon Sep 17 00:00:00 2001 From: Rakina Zata Amni Date: Wed, 26 Jun 2019 17:30:32 +0900 Subject: [PATCH] Update sequential focus navigation to include shadow trees This defines an explicit list for the document's "sequential focus navigation order", whose contents are defined to include elements in shadow trees. Previously the contents of the sequential focus navigation order were defined mostly implicitly, in the tabindex section. This also expands the ordering requirements for sequential focus navigation order to account for shadow trees and slotted elements. Finally, this has a minor connection to delegatesFocus, in that it excludes elements that are shadow hosts with delegatesFocus = true from being focusable areas. Part of #2013. Tests: https://github.com/web-platform-tests/wpt/pull/17523 --- source | 146 ++++++++++++++++++++++++++++++++++++++++++++++++++------- 1 file changed, 128 insertions(+), 18 deletions(-) diff --git a/source b/source index 52fdf3f969f..b64fbfbc5df 100644 --- a/source +++ b/source @@ -3175,8 +3175,8 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
  • node document concept
  • document type concept
  • host concept
  • -
  • The shadow root concept
  • - +
  • The shadow root concept, and its delegates focus
  • +
  • The shadow host concept
  • HTMLCollection interface
  • HTMLCollection.length attribute
  • HTMLCollection.item() method
  • @@ -3211,6 +3211,7 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
  • The document element concept
  • The in a document tree, in a document (legacy), and connected concepts
  • The slot concept, and its name and assigned nodes
  • +
  • The assigned slot concept.
  • The find flattened slotables algorithm
  • The assign a slot algorithm
  • The pre-insert, insert, append, replace, replace all, string replace all, remove, and adopt algorithms for nodes
  • @@ -73445,7 +73446,9 @@ END:VCARD - Elements that have their tabindex focus flag set, that are not tabindex focus flag set, that are not a shadow + host or whose shadow root's + delegates focus is false, that are not actually disabled, that are not expressly inert, and that are either being rendered or being used as relevant canvas fallback content. @@ -73632,8 +73635,91 @@ END:VCARD - +
    + +

    A node is a focus navigation scope owner if it is a document, a + shadow host or a slot.

    + +

    Each focus navigation scope owner has a focus navigation scope, which + is a list of elements. Its contents are determined as follows:

    + +

    Every element element has an associated focus navigation owner, which is + either null or a focus navigation scope owner. It is determined by the following + algorithm:

    + +
      +
    1. If element's parent is null, then return null.

    2. + +
    3. If element's parent is a shadow host, then return + element's assigned slot.

    4. + +
    5. If element's parent is a shadow root, then return the parent's + host.

    6. + +
    7. If element's parent is the document element, then return the + parent's node document.

    8. + +
    9. Return element's parent's associated focus navigation owner.

    10. +
    + +

    Then, the contents of a given focus navigation scope owner owner's + focus navigation scope are all elements whose associated focus navigation + owner is owner.

    + +

    The order of elements within a focus navigation scope does not impact + any of the algorithms in this specification. Ordering only becomes important for the + tabindex-ordered focus navigation scope and flattened tabindex-ordered focus + navigation scope concepts defined below.

    + +

    A tabindex-ordered focus navigation scope is a list of focusable areas and focus navigation + scope owners. Every focus navigation scope owner owner has + tabindex-ordered focus navigation scope, whose contents are determined as + follows:

    + + + +

    The order within a tabindex-ordered focus navigation scope is determined by each + element's tabindex value, as described in the section below.

    +

    The rules there do not give a precise ordering, as they are composed mostly of + "should" statements and relative orderings.

    + +

    A flattened tabindex-ordered focus navigation scope is a list of focusable areas. Every focus navigation scope owner + owner owns a distinct flattened tabindex-ordered focus navigation scope, + whose contents are determined by the following algorithm:

    + +
      +
    1. Let result be a clone of owner's + tabindex-ordered focus navigation scope.

    2. + +
    3. +

      For each item of result:

      + +
        +
      1. If item is not a focus navigation scope owner, then + continue.

      2. + +
      3. If item is not a focusable area, then replace item + with all of the items in item's flattened tabindex-ordered focus navigation + scope.

      4. + +
      5. Otherwise, insert the contents of item's flattened tabindex-ordered + focus navigation scope after item.

      6. +
      +
    4. +
    + +

    The tabindex attribute

    @@ -73664,6 +73750,12 @@ END:VCARD below. This flag is a factor that contributes towards determining whether an element is a focusable area, as described in the previous section.

    +

    The tabindex value of an element is the value of its tabindex attribute.

    + +

    The tabindex value of a focusable area is the tabindex + value of its DOM anchor.

    +

    If the tabindex attribute is specified on an element, it must be parsed using the rules for parsing integers. The attribute's values, or lack thereof, must be interpreted as follows:

    @@ -73678,7 +73770,16 @@ END:VCARD tabindex focus flag is set and, if so, whether the element and any focusable areas that have the element as their DOM anchor can be reached using sequential focus navigation, and if so, what their relative - position in the sequential focus navigation order is to be.

    + position in its tabindex-ordered focus navigation scope is to be. If the element + is a focus navigation scope owner, it must be included in its + tabindex-ordered focus navigation scope even if its tabindex focus + flag is not set and it may not be reachable using sequential focus + navigation.

    + +

    The relative ordering within a tabindex-ordered focus navigation scope for + elements and focusable areas that belong to the same focus navigation + scope and whose tabindex value is ommited or parsing the value returns an + error should be in shadow-including tree order.

    Modulo platform conventions, it is suggested that for the following elements, the tabindex focus flag be set:

    @@ -73721,7 +73822,7 @@ END:VCARD

    The user agent must set the element's tabindex focus flag, but should omit the - element from the sequential focus navigation order.

    + element from any tabindex-ordered focus navigation scope.

    One valid reason to ignore the requirement that sequential focus navigation not allow the author to lead to the element would be if the user's only mechanism for moving the @@ -73738,9 +73839,12 @@ END:VCARD

    The user agent must set the element's tabindex focus flag, should allow the element and any focusable areas that have the element as their - DOM anchor to be reached using sequential focus navigation, following - platform conventions to determine the element's relative position in the sequential focus - navigation order.

    + DOM anchor to be reached using sequential focus navigation.

    + +

    The relative ordering within a tabindex-ordered focus navigation scope for + elements and focusable areas that belong to the same focus navigation + scope and whose tabindex value is zero should be in shadow-including + tree order.

    @@ -73752,9 +73856,10 @@ END:VCARD element and any focusable areas that have the element as their DOM anchor to be reached using sequential focus navigation, and should place the element — referenced as candidate below — and the aforementioned focusable areas in the sequential focus navigation - order so that, relative to other focusable areas in the - sequential focus navigation order, they are:

    + data-x="focusable area">focusable areas in the tabindex-ordered focus navigation + scope where the element is a part of so that, relative to other elements and focusable areas that belong to the same focus + navigation scope, they are: