External content included in dragged list item (Safari only)

[hcampos-professional]

Check existing issues

• I have checked for existing issues to avoid duplicates

Actual Behavior

CleanShot.2024-05-30.at.12.01.09.mp4

When dragging a list item which contains a calcite-action-menu, other content that is not inside of the list item is included in the "ghost" image, but only in Safari. It seems like Safari includes anything within the "bounds" of the dragged element and, because of the action menu being larger, extra content gets included, even if it is not in the list item.

Expected Behavior

The expected behavior is that only elements that are inside of the list item get included in the ghost image. In Chrome/Edge, the behavior is as expected.

Reproduction Sample

https://codesandbox.io/p/sandbox/calcite-nested-list-flickering-forked-zlkpv8?file=%2Findex.html%3A7%2C1

Reproduction Steps

1. Open https://codepen.io/hccampos/pen/yLWgKJp in Safari
2. Drag the single list item. Notice that the "OUTSIDE CONTENT" text gets included in the ghost while dragging.

Reproduction Version

2.8.4

Relevant Info

Only happens in Safari (tested with Version 17.5 (19618.2.12.11.6))

Regression?

No response

Priority impact

impact - p3 - not time sensitive

Impact

It impacts the LayerList widget of the ArcGIS Maps SDK, which is used in the ArcGIS SceneViewer and ArcGIS MapViewer, for example.

Calcite package

• @esri/calcite-components
• @esri/calcite-components-angular
• @esri/calcite-components-react
• @esri/calcite-design-tokens
• @esri/eslint-plugin-calcite-components

Esri team

ArcGIS Maps SDK for JavaScript

[driskull]

Seems to only be happening when the action-menu/group is present.

[hcampos-professional]

Yes, and the content is only included until the bottom of the action-menu. It really seems like Safari just takes a snapshot of the bounds of the element, without considering whether an element is even visible or part of the element being dragged.

[driskull]

Yeah, i'll see if there's a workaround otherwise I might have to find a safari bug to link this to or open one.