Search within Log viewer can cause the parent container to shift and break the layout, when embedded in a scrollable parent

[sg00dwin]

Summary

When LogViewer is embedded inside a scrollable ancestor (e.g., PatternFly Drawer), searching with isTextWrapped={false} causes the entire page layout to shift horizontally. The scrollIntoView({ block: 'nearest', inline: 'center' }) call in LogViewer.js:132 scrolls all scrollable ancestors per the CSSOM View spec, not just the log viewer's own scroll container.

Description

When searching in LogViewer with text wrapping disabled (isTextWrapped={false}), the component calls scrollIntoView({ block: 'nearest', inline: 'center' }) on the matched .pf-v6-c-log-viewer__string.pf-m-current element (LogViewer.js:129-134):

if (!isTextWrapped) {
    setTimeout(() => {
        const element = containerRef.current.querySelector('.pf-v6-c-log-viewer__string.pf-m-current');
        element && element.scrollIntoView({ block: 'nearest', inline: 'center' });
    }, 1);
}

Per the CSSOM View spec, scrollIntoView scrolls all scrollable ancestors, not just the nearest one. This means any parent element with overflow: auto or overflow: hidden (which is still a scroll container) will also be scrolled horizontally.

Reproduction

A minimal reproduction is available here:
Search for the string dial and the entire Log View shifts to the left.
https://codesandbox.io/p/devbox/adoring-gianmarco-jysx57?file=%2Findex.js%3A57%2C27&workspaceId=ws_DaxE3H6rUUo4d5D65eiKhT

Expected behavior

Only the log viewer's own scroll container (.pf-v6-c-log-viewer__scroll-container) should scroll horizontally. Ancestor containers should not be affected.

OCP Console related issue and workaround

In OpenShift Console (OCPBUGS-74156), this causes the entire page to shift left when searching pod logs, because the LogViewer is nested inside a PatternFly Drawer whose .pf-v6-c-drawer__main has overflow: hidden -- which still acts as a scroll container for scrollIntoView.

As a workaround until this is addressed upstream, OpenShift Console plans to override overflow: hidden to overflow: clip on .pf-v6-c-drawer__main via a CSS override:

#content .pf-v6-c-drawer__main {
  overflow: clip;
}

overflow: clip has the same visual clipping behavior as hidden, but removes the element from being a scroll container entirely, so scrollIntoView skips it. This prevents the page shift without affecting the log viewer's own horizontal scrolling.

---

Jira Issue: PF-3815