fr(cdk/a11y/cdkFocusTrap): Option (or always) not to scroll to element when returning focus
- 主要言語
- TypeScript
- スター
- 25k
- フォーク
- 6.8k
- 平均マージ
- 1日 8時間
- マージ済み PR(30日)
- 91
説明
#### Feature Description
When `cdkTrapFocus` returns focus to the previously focused element (with `cdkTrapFocusAutoCapture` set to `true`), the directive calls `.focus()` on the previous element. On focus, the browser will, by default, scroll to the focused element. this is not always desirable. I'm not actually certain it is ever desirable, but I don't know all of the use cases for focus trap.
#### Use Case
Consider an interactive modal or popover that can be opened by a hover event on desktop. It is possible that the previously focused element was off screen. Then, when the modal is closed, the window will be scrolled back to the previously focused element when `focus()` is called on it.
Here is a simple alternative to calling `focus()` that would return focus without scrolling:
```typescript
public focusWithoutScrolling(element: HTMLElement) {
const x = window.scrollX;
const y = window.scrollY;
element.focus({ preventScroll: true });
//this is necessary because not all browsers yet respect preventScroll
this.window.scrollTo(x, y);
}
```
コントリビューションガイド
調査の方向性
Start at the cdkFocusTrap directive and its cdkTrapFocusAutoCapture focus-return path. Review how focus options and browser scrolling are handled before deciding whether scrolling should be optional or always prevented. Done means returning focus after closing a modal or popover without unexpectedly scrolling, with coverage for the chosen behavior.
索引モデルが issue の本文から書いたものです。
評価
- 技術スタック
- angular, typescript
- 領域
- accessibility, frontend
- issue の種類
- 機能追加
- 難易度
- 3/5
- 見積もり時間
- 1〜2日
- 活発さ
- 停滞
- 明瞭さ
- おおむね明確
- 初心者へのやさしさ
- 45/100