Prevent scrolling on mobile devices while dragging Portlets in Layout

• Type: Bug
• Status: Closed
• Resolution: Fixed
• Affects Version/s: 7.0.X, 7.1.X, Master
• Fix Version/s: 7.0.0 DXP FP63, 7.0.X, 7.1.10 DXP FP3, 7.1.1 CE GA2, 7.1.10.1 SP1, 7.1.X, Master
• Component/s: Frontend Infrastructure
• Labels:
  • ee-ts
  • liferay-dxp-70-sp10
  • liferay-dxp-71-sp1
  • liferay-fixpack-de-63-7010
  • liferay-fixpack-dxp-3-7110
• Branch Version/s:
  7.1.x, 7.0.x
• Backported to Branch:
  Committed
• Story Points: 0.25
• Fix Priority: 3
• OS:
  Android, iOS
• Browsers:
  iOS Safari, Mobile Chrome
• Git Pull Request: https://github.com/brianchandotcom/liferay-portal/pull/64568

Steps to Reproduce:

1. Add some portlets to a the page. Ensure there's enough to make the page scroll on a mobile device. Use a single column layout to simplify test.
2. Login in as an admin on a mobile device (test both Android Chrome, and iOS Safari)
3. Attempt to drag a portlet to another position.
4. Attempt to drag a portlet to another position beyond the browser's viewport.

Expected Behavior:

• Browser should not scroll while dragging within viewport.
• Browser should scroll while dragging near edge of viewport.
• The portlet can be moved to new desired position.

Actual Behavior:

• Browser scrolls while dragging within viewport.
• On iOS Safari, while dragging, the portlet is dropped/placed immediately to the bottom of the column.
• On iOS Safari, while dragging, it's very impractical to place the portlet in desired position.