Skip to content

fix: additional check for touch event before calling preventDefault#138

Merged
mattlewis92 merged 1 commit intomainfrom
prevent-default-not-called-for-touch-events
Mar 12, 2026
Merged

fix: additional check for touch event before calling preventDefault#138
mattlewis92 merged 1 commit intomainfrom
prevent-default-not-called-for-touch-events

Conversation

@jcrymble-clickup
Copy link
Copy Markdown
Collaborator

Summary

Only call event.preventDefault() for mouse events. For touch events we no longer call it, so touch listeners can stay passive and browsers don’t warn about non-passive listeners.

Changes

isTouchEvent() utility (util/is-touch-event.ts)

  • New helper that detects touch events via event.type.startsWith('touch').

Resize handle (resize-handle.directive.ts)

  • In onMousedown, call preventDefault() only when the event is cancelable and not a touch event:
  • if (event.cancelable && !isTouchEvent(event)) { event.preventDefault(); }

Resizable (resizable.directive.ts)

  • Same guard in the mousemove tap: only call preventDefault() when a resize is active, the event is cancelable, and it’s not a touch event.

Removed util/get-listen-options.ts

  • No longer used (touch listeners are handled via the new check instead).

Tests (resizable.spec.ts)

  • “touch event listeners”: added tests that do not call preventDefault for cancelable touch events and do call it for cancelable mouse events.

Result

Touch resize/drag no longer triggers “passive event listener” warnings while mouse behavior (and preventDefault for mouse when needed) is unchanged.

@codecov
Copy link
Copy Markdown

codecov bot commented Mar 12, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 81.20%. Comparing base (a1e8edc) to head (1f87a55).
⚠️ Report is 2 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main     #138      +/-   ##
==========================================
- Coverage   81.27%   81.20%   -0.07%     
==========================================
  Files           6        6              
  Lines         283      282       -1     
  Branches       61       59       -2     
==========================================
- Hits          230      229       -1     
  Misses         42       42              
  Partials       11       11              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

).pipe(
tap(({ event }) => {
if (currentResize && event.cancelable) {
if (currentResize && event.cancelable && !isTouchEvent(event)) {
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Isn't this what event.cancelable is meant to do?

https://developer.mozilla.org/en-US/docs/Web/API/Event/cancelable

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

event.cancelable tells us if the event can be cancelled or not, but the touchEvent check is due to https://chromestatus.com/feature/5093566007214080 which now treats touch events as passive and we shouldn't be calling preventDefault on these even if they are cancelable.

@mattlewis92 mattlewis92 merged commit 8fbcd06 into main Mar 12, 2026
3 checks passed
@mattlewis92 mattlewis92 deleted the prevent-default-not-called-for-touch-events branch March 12, 2026 16:20
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants