[Bug]: NavDrawer shows divider above Footer when scrolled to the bottom

[Aidam1]

Component

Nav (Preview)

Package version

9.74.1

React version

18.3.1

Environment

Happens in stackblitz as well

Current Behavior

When scrolling to the bottom of NavDrawer with NavDrawerFooter, the divider between NavDrawerBody and NavDrawerFooter is unexpectedly shown. This happens only sometimes, but is always reproducible on zoomed in browser. This is because the check for height in useDrawerBody.js is exact, but the actual values are not:

Expected Behavior

The divider is always hidden when scrolled to the bottom.

Reproduction

https://stackblitz.com/edit/rfaoh314?file=src%2Fexample.tsx

Steps to reproduce

1. Zoom in browser to 110+%
2. Scroll to the bottom of Nav
3. The divider is visible even when it shouldn't

Are you reporting an Accessibility issue?

None

Suggested severity

High - No workaround

Products/sites affected

No response

Are you willing to submit a PR to fix?

yes

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.

[tudorpopams]

Thanks for the detailed report and root-cause analysis! You're right that the "scrolled to bottom" detection in useDrawerBody (in @fluentui/react-drawer, which NavDrawerBody reuses) uses an exact height comparison that doesn't hold once sub-pixel/zoom rounding is involved. Comparing with a small tolerance instead of exact equality looks like the right direction.

Since you indicated you're willing to submit a PR — that'd be very welcome, and we're happy to review. Marking this Help Wanted.