Skip to content

Commit c51f7a0

Browse files
authored
fix(seer): Prevent horizontal scrollbar flash on block entry animation (#112823)
## Changes The Seer Explorer panel showed a brief horizontal scrollbar flash each time a new response block loaded. **Root cause:** The block entry animation in `blockComponents.tsx` uses `initial={{opacity: 0, x: 10}}`, starting each new block 10px to the right of its natural position. `BlocksContainer` has `overflow-y: auto` but no explicit `overflow-x` — CSS coerces `overflow-x` to `auto` when `overflow-y` is `auto`, so those first few animation frames (while the block is at `translateX(10px)`) triggered a visible horizontal scrollbar before the animation resolved to `x: 0`. **Fix:** Add `overflow-x: hidden` to `BlocksContainer` in `panelContainers.tsx`. This clips the animation without affecting vertical scrolling.
1 parent 8ddf150 commit c51f7a0

File tree

1 file changed

+1
-0
lines changed

1 file changed

+1
-0
lines changed

static/app/views/seerExplorer/panelContainers.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -211,6 +211,7 @@ const PanelContent = styled('div')`
211211
export const BlocksContainer = styled(Stack)`
212212
flex: 1;
213213
overflow-y: auto;
214+
overflow-x: hidden;
214215
overscroll-behavior: contain;
215216
`;
216217

0 commit comments

Comments
 (0)