Bug - Table ActionsColumn, Dropdown - Page contents shifts on Safari after multiple interactions with kebab menus

[KevinFCormier]

Describe the problem
After opening and closing the menu from an ActionsColumn or dropdown when using Safari, the page contents shifts.

How do you reproduce the problem?
Using Safari, visit:
https://console.redhat.com/openshift/cluster-list

Click the kebab menu on any table row several times

A very similar issue can also be seen using the Card View demo:
https://www.patternfly.org/patterns/card-view

Click and delete a card, then open and close the card a few times. Contents shifts left, but then returns if you click again.

Expected behavior
Not this!

Is this issue blocking you?
No known workaround. Customers using Safari will encounter these issues in production.

Screenshots
If applicable, add screenshots to help explain the issue.

Cluster.List.Safari.mov

Card.View.Safari.mov

What is your environment?

• OS: macOS 14.6.1
• Browser Safari
• Version 17.6

What is your product and what release date are you targeting?
OCM UI - Continuous Delivery

[kelvah]

Hi! Any update on this bug? Thanks!

[kelvah]

Hi, any update on this issue?

We are still experiencing this problem on Safari. I discovered it can be solved by passing popperProps={{ appendTo: () => document.body }} to the involved <ActionColums />.

This hints to some problems with how the popper is rendered in place.

Applying the same appendTo configuration to all the tables in our app feels like a workaround though. It's also causing z-index issues with other elements on the page.

Thanks!
Roberto