Bug - Table stick column borders disappear

[dlabrecq]

Cost Management shows a skeleton while loading data, in addition to a composable table with sticky columns. After loading, the skeleton is replaced. Typically the table looks fine, except when the page is zoomed out. In this scenario, the table's sticky column borders disappear upon a page refresh.

Demo: https://user-images.githubusercontent.com/17481322/227370670-172ac296-c864-497c-afd6-933c6956a520.mov

Simple test to replace page content

Composable table code https://github.com/project-koku/koku-ui/blob/main/src/routes/views/explorer/explorerTable.tsx#L336

[dlabrecq]

When I remove the Pagination component from the toolbar, the table sticky borders display as normal. However, If I place pagination anywhere before the table, the table sticky borders will break. The borders are ok if pagination is placed after the table.

Simplified the pagination component as much as possible below.

<Toolbar>
  <ToolbarContent>
    <ToolbarItem variant="pagination">
      <Pagination itemCount={4} page={1} perPage={10} />
    </ToolbarItem>
  </ToolbarContent>
</Toolbar>

[stale[bot]]

This issue has been automatically marked as stale because it has not had activity in the last 60 days. It will be closed in 30 days if no further activity occurs.

[mcoker]

@dlabrecq can you confirm if this is still an issue? If so do you mind creating a codesandbox that reproduces the bug?

[stale[bot]]

This issue has been automatically marked as stale because it has not had activity in the last 60 days. It will be closed in 30 days if no further activity occurs.