bug(aria): overlay panel jitters/lags on Y axis when scrolling the page while open (select, menu, listbox, etc.)
まだ誰も着手していません。
評価
- 難易度
- 4/5
- 見積もり時間
- 3〜5日
- 初心者へのやさしさ
- 55/100
- issue の種類
- バグ
- 明瞭さ
- おおむね明確
- 活発さ
- 静か
- 技術スタック
- angular, typescript
調査の方向性
指定された Angular 22 環境を使用して、https://angular.dev/guide/aria/menu#example-1 の Angular Aria メニュー例で jitter を再現し、続いて @angular/aria の overlay の位置決めとスクロール処理を追跡します。スクロール中に select、メニュー、その他の overlay パネルが、Y 軸方向の目に見える遅延や jitter なしでトリガーとの位置関係を保てれば完了です。
索引モデルが issue の本文から書いたものです。
説明
Is this a regression?
- Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was
Not sure, could not confirm if this was already present in Angular 21, since it's unclear whether @angular/aria was already used/present at that version
Description
When an overlay panel from @angular/aria is open (e.g. a select dropdown, a menu, or any other @angular/aria primitive that renders an overlay panel positioned relative to a trigger element), and the user scrolls the underlying page from bottom to top while keeping the overlay open, the panel fails to stay visually attached to its trigger/origin element on the Y axis. Instead of tracking the trigger smoothly, the panel appears to "shake" or lag behind, producing a jittery/sliding effect instead of staying cleanly pinned to its anchor.
This is reproducible directly on the official Angular Material/Aria documentation site (Angular v22 docs), e.g. on the select (aria) demo, so it does not require a custom StackBlitz repro to observe — though a StackBlitz reproduction will be added for completeness.
Reproduction
- Go to an Angular Aria demo page that uses an overlay-based primitive (e.g. select) on the Angular v22 docs, e.g.
https://angular.dev/guide/aria/menu#example-1 - Click the trigger to open the overlay panel (dropdown/menu/etc.).
- While the overlay remains open, scroll the underlying page from bottom to top (mouse wheel, trackpad, or scrollbar) — do not close the overlay.
- Observe the overlay panel's position on the Y axis while scrolling.
Expected Behavior
The @angular/aria overlay panel should stay perfectly attached/aligned to its origin trigger element on the Y axis throughout the scroll, repositioning smoothly and immediately as the trigger's position changes, with no visible lag or jitter.
Actual Behavior
The overlay panel lags behind the scroll position and "shakes"/slides in a jittery manner on the Y axis instead of staying cleanly attached to its origin element. This happens specifically when scrolling from bottom to top while the @angular/aria overlay (select, menu, etc.) is open.
Environment
- Angular: 22.0.7
- CDK/Material: 22.0.5 (@angular/cdk 22.0.5, @angular/aria 22.0.5)
- Browser(s): Chrome
- Operating System: Windows
- 主要言語
- TypeScript
- スター
- 25k
- フォーク
- 6.8k
- 平均マージ
- 1日 2時間
- マージ済み PR(30日)
- 80
コントリビューションガイド
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
angular/components のほかの issue
-
area: material/tree docs gemini-triaged needs triage
難易度 2/5 1〜3時間 初心者へのやさしさ 68/100
angular/components#33832 ·
-
area: material/datepicker gemini-triaged P4
難易度 2/5 1〜3時間 初心者へのやさしさ 72/100
angular/components#33763 · コメント 2 件 · リアクション 3 件 ·
-
area: material/table gemini-triaged P4
難易度 1/5 1時間未満 初心者へのやさしさ 88/100
angular/components#33709 · コメント 1 件 ·
-
area: material/table docs gemini-triaged P4
難易度 2/5 1〜3時間 初心者へのやさしさ 72/100
angular/components#33455 ·
-
area: material/core gemini-triaged P3
難易度 1/5 1時間未満 初心者へのやさしさ 78/100
angular/components#33059 · コメント 2 件 ·
angular/components の issue をすべて見る
似ている issue
-
難易度 2/5 1〜3時間 初心者へのやさしさ 65/100
-
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
-
bug v2
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
modelcontextprotocol/inspector#2458 · コメント 1 件 ·
-
難易度 1/5 1時間未満 初心者へのやさしさ 75/100
railmapgen/rmp-gallery#4068 ·
-
Mend: dependency security vulnerability status: needs triage 🕵️♀️
難易度 2/5 1〜3時間 初心者へのやさしさ 70/100
carbon-design-system/ibm-products#9907 ·