Describe the bug
When using EuiCodeBlock with isVirtualized: true and overflowHeight: 100%, if the component is re-rendered while the user has scrolled down in the code block, blank lines will appear between the top of the code block and the line the user was scrolled to. I'm not sure if this bug is specific to usage in a EuiFlyout.
Impact and severity
Low impact and severity. Known workaround: force a re-mount of the component by changing its key prop or set isVirtualized: false.
Environment and versions
Minimum reproducible sandbox
https://codesandbox.io/p/devbox/euicodeblock-virtualized-within-euiflyout-height-100-forked-6j2tlc?workspaceId=ws_PBRiDLztB2gZ9hEEoiqpdS
To Reproduce
Steps to reproduce the behavior:
- Click on "Show flyout example"
- Click on "Submit"
- Scroll down anywhere in the
EuiCodeBlock
- Click on "Submit"
- See blank lines appear between top of code block and previous scrolled position. Will disappear if code block is scrolled.
Expected behavior
No blank lines appear (same behaviour as isVirtualized: false)
Screenshots (Optional)
Additional context (Optional)
Nice to haves: EuiCodeBlock supports a ref prop, as programatically scrolling to the top of the block could be another workaround
Describe the bug
When using
EuiCodeBlockwithisVirtualized: trueandoverflowHeight: 100%, if the component is re-rendered while the user has scrolled down in the code block, blank lines will appear between the top of the code block and the line the user was scrolled to. I'm not sure if this bug is specific to usage in aEuiFlyout.Impact and severity
Low impact and severity. Known workaround: force a re-mount of the component by changing its
keyprop or setisVirtualized: false.Environment and versions
Minimum reproducible sandbox
https://codesandbox.io/p/devbox/euicodeblock-virtualized-within-euiflyout-height-100-forked-6j2tlc?workspaceId=ws_PBRiDLztB2gZ9hEEoiqpdS
To Reproduce
Steps to reproduce the behavior:
EuiCodeBlockExpected behavior
No blank lines appear (same behaviour as
isVirtualized: false)Screenshots (Optional)
Additional context (Optional)
Nice to haves:
EuiCodeBlocksupports arefprop, as programatically scrolling to the top of the block could be another workaround