Dropdown boundary="window" fails within table header when sticky-header set.

This is pretty similar to #3563 - basically, that bug comes back if you have sticky-header set on the table. It’s really noticeable when the dropdown is longer than the table. The dropdown menu clips inside the table area, which gets a vertical scrollar when the dropdown appears:

But it happens even if the table is longer - note that the top of the dropdown is clipped when it goes outside the first column:

Expected behavior

If you set the boundary to window, I would expect the dropdown to be placed above the table content and not be clipped within the table area.

Versions

Libraries:

• BootstrapVue: 2.5.0
• Bootstrap: 4.4.1
• Vue: 2.6.11

Environment:

• Device: Desktop Workstation
• OS: Ubuntu Linux
• Browser: Chrome
• Version: 82.0.4085.12 (Official Build) dev (64-bit)

Demo link

https://jsfiddle.net/yjh712sk/1/

[dflock]

Maybe set overflow: visible? although that will affect sticky headers

Not sure where to apply that, so I tried various places, to no avail.

Best I could come up as a workaround, was to not use sticky headers where the list is likely to be shorter than the menu:

:sticky-header="totalItems < 10 ? null : stickyHeader"

That’ll do for me, for now.

[stale[bot]]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!