Skip to content

Commit

Permalink
fix(a11y): focus monitor not identifying touch focus inside shadow ro…
Browse files Browse the repository at this point in the history
…ot (#17167)

`FocusMonitor` uses a `touchstart` listener on the `document` to identify when an element was focused via touch. The problem is that if an element is inside the shadow DOM, the `event.target` will be set to the shadow root. These changes use `composedPath` to get the event target which accounts for the shadow DOM.
  • Loading branch information
crisbeto authored and mmalerba committed Oct 3, 2019
1 parent ae682d8 commit 3673f3d
Showing 1 changed file with 5 additions and 1 deletion.
6 changes: 5 additions & 1 deletion src/cdk/a11y/focus-monitor/focus-monitor.ts
Expand Up @@ -117,7 +117,11 @@ export class FocusMonitor implements OnDestroy {
if (this._touchTimeoutId != null) {
clearTimeout(this._touchTimeoutId);
}
this._lastTouchTarget = event.target;

// Since this listener is bound on the `document` level, any events coming from the shadow DOM
// will have their `target` set to the shadow root. If available, use `composedPath` to
// figure out the event target.
this._lastTouchTarget = event.composedPath ? event.composedPath()[0] : event.target;
this._touchTimeoutId = setTimeout(() => this._lastTouchTarget = null, TOUCH_BUFFER_MS);
}

Expand Down

0 comments on commit 3673f3d

Please sign in to comment.