Fix ActionMenu position issue when container is scrollable

[camertron]

What are you trying to accomplish?

This PR fixes a bug in ActionMenu that causes the menu not to travel with the invoker button when scrolling inside a container that scrolls independent of the body, eg. with a constrained height and overflow: auto.

Screenshots

Before

Alt: An ActionMenu is opened and the page scrolled. The menu stays fixed in its original position as the page scrolls up and down. The menu is closed and re-opened, which temporarily attaches the menu to the button.

before.mov

After

Alt: An ActionMenu is opened and the page scrolled. The menu remains attached to the button as the page scrolls up and down.

after.mov

Integration

No changes necessary in production.

List the issues that this change affects.

Fixes #3175

Risk Assessment

• Low risk the change is small, highly observable, and easily rolled back.
• Medium risk changes that are isolated, reduced in scope or could impact few users. The change will not impact library availability.
• High risk changes are those that could impact customers and SLOs, low or no test coverage, low observability, or slow to rollback.

What approach did you choose and why?

I adopted a technique we used in SelectPanel which is based on ActionMenu) that updates the <anchored-position> element whenever the page scrolls. This is a bit tricky because attaching a scroll event listener to window is not enough here, since the scrolling element is actually the container instead of the page body. I was able to get things to work by capturing the scroll event.

Accessibility

• No new axe scan violation - This change does not introduce any new axe scan violations.

Merge checklist

- [ ] Added/updated tests (I don't think there's a reliable way to test this)
- [ ] Added/updated documentation

• Added/updated previews (Lookbook)
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge

Take a look at the What we look for in reviews section of the contributing guidelines for more information on how we review PRs.

[changeset-bot]

🦋 Changeset detected

Latest commit: 84a0c1a

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@primer/view-components	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[jonrohan]

Changes work as expected in lookbook, I'm going to merge and test in the release to see if there's any regressions.