components icon indicating copy to clipboard operation
components copied to clipboard

bug(cdkTargetMenuAim): directive does not really work

Open Beilinson opened this issue 1 month ago • 0 comments

Description

According to the docs, the cdkTargetMenuAim allows for a "Smart Aim" behavior which calculates the intended slope of the mouse pointer and does not switch to another submenu unless some timeout is reached or the mouse deviates from the slope. This behavior does not seem to work at all (tested on several versions: 16.1.2, 17.3.6).

Reproduction

StackBlitz link: https://stackblitz.com/edit/qwy1he?file=src%2Fexample%2Fcdk-menu-menubar-example.html Steps to reproduce:

  1. Try moving in a diagonal line from the edit menu item to the cut menu item in the submenu.
  2. Doing so will immediately open the share submenu instead, no matter how fast the action is done (unless its faster than the refresh rate of the monitor)

Expected Behavior

That moving the mouse along a diagonal line only opens a different subMenu if the mouse took too long to travel. see https://rawgit.com/kamens/jQuery-menu-aim/master/example/example.html for an example

Actual Behavior

The different submenus disappear immediately.

From my limited debugging I was able to glean that the issue seems to stem from the PointerTracker, where the _getItemPointerEntries() stream doesn't seem to get output any value on entering children menu items, while the exit is called every time, meaning the previousElement and activeElement are set as undefined for the duration of the mouse interaction with the menu items and submenus.

Environment

  • Angular: 17.3.6
  • CDK: 17.3.6
  • Browser(s): Chrome, Firefox
  • Operating System (e.g. Windows, macOS, Ubuntu): Windows

Beilinson avatar May 01 '24 20:05 Beilinson