[AppBar] useScrollTrigger breaks when AppBar position is sticky #46589
Description
Steps to reproduce
https://codesandbox.io/p/devbox/angry-ramanujan-gyn43g
- Use
position="sticky"on AppBar - Use
Collapseto hide some nested content - Observe content shaking and
useScrollTriggerconstantly changing it's value
Current behavior
AppBar content is shaking if you scroll slowly
Screen.Recording.2025-07-23.at.21.58.33.mov
Expected behavior
Collapsed content that depends on scroll direction inside of sticky AppBar should not shake and act smoothly
Context
See the video in "Current behavior" section
Your environment
npx @mui/envinfo
System:
OS: macOS 15.5
Binaries:
Node: 20.12.2 - ~/.asdf/installs/nodejs/20.12.2/bin/node
npm: 10.5.0 - ~/.asdf/installs/nodejs/20.12.2/bin/npm
pnpm: Not Found
Browsers:
Chrome: 138.0.7204.158
Edge: Not Found
Safari: 18.5
npmPackages:
@emotion/react: ^11.14.0 => 11.14.0
@emotion/styled: ^11.11.0 => 11.11.0
@mui/core-downloads-tracker: 7.0.2
@mui/icons-material: ^7.0.2 => 7.0.2
@mui/lab: ^7.0.0-beta.10 => 7.0.0-beta.10
@mui/material: ^7.0.2 => 7.0.2
@mui/material-nextjs: ^7.0.2 => 7.0.2
@mui/private-theming: 7.0.2
@mui/styled-engine: 7.0.2
@mui/system: 7.0.2
@mui/types: 7.4.1
@mui/utils: 7.0.2
@mui/x-charts: ^8.0.0 => 8.0.0
@mui/x-charts-vendor: 8.0.0
@mui/x-internals: 8.0.0
@types/react: ^19.1.5 => 19.1.5
react: ^19.1.0 => 19.1.0
react-dom: ^19.1.0 => 19.1.0
typescript: ^5.6.3 => 5.6.3
Search keywords: useScrollGrigger sticky AppBar