[csswg-drafts] [css-nav-1] Searching within element can cause unintuitive behavior. (#3989)

bokand has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-nav-1] Searching within element can cause unintuitive behavior. ==
Sorry, I can't find where in the spec is responsible but this pertains to changes landed in Chrome in https://chromium-review.googlesource.com/c/chromium/src/+/1587559

(This change JunHo mentioned on the review this change conforms to the spec)

However, this can lead to issues when clickable items are contained inside other clickable items. For example, it's a common pattern to do something like this:

<a>
  <button>Menu Item</button>
</a>

Both the <a> and the <button> are considered for Spat Nav but they're the same size. The practical effect is that it requires multiple navigations to move between menu items. e.g. See https://m.youtube.com/watch?v=eKhv9CnA6A0 using mobile emulation.

Another pattern I'm told is common is to wrap a common action in an ancestor click handler:

<a onclick="dismissPopup();">
  <button>Confirm</button>
  <button>Cancel</button>
</a>

This leads navigation to select an invisible wrapper around both buttons which looks awkward.

Not sure how much we can do about the latter in particular but we may want to investigate some heuristics to prevent, e.g. selecting multiple candidates that overlap almost exactly.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3989 using your GitHub account

Received on Thursday, 30 May 2019 20:08:19 UTC