IgxNavigationDrawer gestures suppress Navbar actions inside the edge zone on iOS

[viktorkombov]

Description

On iOS, a Navbar action positioned inside the edge activation zone of a closed,
unpinned IgxNavigationDrawerComponent may require two taps before its
interaction is emitted when drawer gestures are enabled.

The issue occurs in a routed application shell even though the drawer and the
Navbar are separate components. The drawer registers its native gesture
manager on document, so it observes touches elsewhere on the page. The
Navbar's left action is inside the drawer's default 50 px maxEdgeZone and is
therefore accepted as a potential drawer gesture.

With drawer gestures enabled, the failing iOS sequence reaches pointerup and
touchend, but WebKit does not produce the compatibility click; consequently,
the Navbar action event is not emitted. Disabling drawer gestures restores the
click and the action emits after one tap.

This is a regression from the HammerJS gesture path. A fix that stops tracking
touches outside the drawer edge zone does not cover this case because Navbar
actions are normally located inside that zone. The drawer should distinguish a
candidate edge touch from a committed horizontal pan so that an ordinary tap
remains available to interactive content.

Framework

Angular

Angular Version

22.0.x

Ignite UI for Angular Version

22.1.0-beta.0 and current master (22.1.x)

Component / Area

IgxNavigationDrawerComponent, IgxNavbarComponent,
IgxIconButtonDirective, and the native touch manager

Browser

Safari and Chrome on iOS

Operating System

iOS

Command Not Working

Not applicable.

Steps to Reproduce

They are mostly in sync, but step 9 is ambiguous because the checkbox is already on the diagnostics route. I would use:

1. Download and open the attached navbar-navdrawer-ios-touch-repro sample.

2. Run:

   npm install
   npm start -- --host 0.0.0.0 --port 4200

3. Connect an iOS device to the same network and open http://<computer-ip>:4200 .

4. From the initially open drawer, select Navbar diagnostics. The link closes the drawer while gestures remain enabled.

5. Tap the shell Navbar menu action once and check Shell Navbar actions.

6. If the drawer does not open, tap it a second time, then select Navbar diagnostics again.

7. Tap the inner Navbar back action once and check Inner Navbar actions and the event log.

8. Tap the projected IgxIconButtonDirective action once and check its counter.

9. Enable Call Location.back() after the action emits, then tap the inner back action. When it emits, the application navigates to the previous route. Open the shell menu and select Navbar diagnostics to repeat the test.

10. As a control, clear Navigation Drawer gestures enabled and repeat the shell, inner Navbar, and projected icon-button actions. Each should respond on the first tap.

Chrome DevTools mobile emulation is not reliable for this iOS WebKit behavior; use a physical iOS device.

Actual Result

With Navigation Drawer gestures enabled, a single tap inside the drawer edge
zone may end at pointerup/touchend without producing a click. The shell
menu does not open and the corresponding action counter does not increment
until a second tap.

Observed failing sequence, displayed newest-first:

touchend target=igx-icon.igx-icon.material-icons defaultPrevented=false
pointerup target=igx-icon.igx-icon.material-icons defaultPrevented=false
touchstart target=igx-icon.igx-icon.material-icons defaultPrevented=false
pointerdown target=igx-icon.igx-icon.material-icons defaultPrevented=false

With drawer gestures disabled, the first tap succeeds:

click target=igx-icon.igx-icon.material-icons defaultPrevented=false
ACTION emitted (#1)
touchend target=igx-icon.igx-icon.material-icons defaultPrevented=false
pointerup target=igx-icon.igx-icon.material-icons defaultPrevented=false
touchstart target=igx-icon.igx-icon.material-icons defaultPrevented=false
pointerdown target=igx-icon.igx-icon.material-icons defaultPrevented=false

A click target=a defaultPrevented=true entry can appear after selecting a
drawer route. This is the Angular Router preventing the anchor's native
navigation and is unrelated to the missing Navbar click.

Expected Result

An ordinary tap on a Navbar action or another interactive element inside the
drawer edge zone should emit exactly one interaction. The drawer should begin
panning only after the touch is recognized as a horizontal drawer gesture.

Reproduction URL

Attached sample: navbar-navdrawer-ios-touch-repro (public URL to be added).

Attachments

navbar-navdrawer-ios-touch-repro.zip