Wrong position for list items of nimble-select after scrolling nimble-dialog

[PetitCalgon]

🐛 Bug Report

---

See AzDo bug 3951459

---

Hello Team,

I made a nimble-dialog to edit an entity, there is approximatively 17 fields to be edited, 5 of them with nimble-select.

The nimble-dialog displays an horizontal scrollbar.
Edit: sorry I meant vertical.

When opening for the first time a nimble-select, the list items popup displays correctly under the nimble-select. If scroll the dialog up or down and reopens the same nimble-select, the list items popup displays at its previous position, not under the new position of the nimble-select.

💻 Repro or Code Sample

<nimble-dialog>

<span slot="title">Title</span>

<h2>First section</h2>
<div class="container-grid">
<div>Report:</div>
<div><nimble-select> ... </nimble-select></div>
<div>Name:</div>
<div><nimble-text-field/></div>
<div>Workspace:</div>
<div><nimble-select> ... </nimble-select></div>
</div>
<h2>Second section</h2>
<div class="container-grid">
<div>Rhythm:</div>
<div><nimble-select> ... </nimble-select></div>
<div>Days:</div>
<div><nimble-checkbox/></div>

...
</nimble-dialog>

🤔 Expected Behavior

I expect the popup with option values to show below the nimble-select even after scrolling up/down the dialog

😯 Current Behavior

The popup remains on the position where it previously was, not the new scrolled position of the nimble-select

💁 Possible Solution

🔦 Context

🌍 Your Environment

• OS & Device: Windows
• Browser: Microsoft Edge, Mozilla FireFox
• Version: confirmed since nimble-angular 33.3.4, maybe older

[rajsite]

@PetitCalgon I think I have a reproducing example does that illustrate the behavior you are describing?

[PetitCalgon]

I'm really sorry, I meant a vertical scrollbar, not an horizontal.
But yes, the behavior is the same.
It's exactly this behavior:

• opening the select
• scrolling
• opening again, items list is at previous not scrolled position

[m-akinc]

The issue is that the anchored region (in ni/fast) adds an event listener for the scroll event to window, even when the anchored region is in a dialog. In that case, we need to be adding the event listener to the dialog instead.