question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Incompatiblity with hammerjs components

See original GitHub issue

I haven’t gotten to the root of this one, but my normal Angular tests are passing fine, but those that leverage shallow-render are failing now that I have added some material components that support hammerjs.

See https://material.angular.io/guide/getting-started#step-5-gesture-support

When running in the browser, the console merely states that hammerjs is needed to support some gestures. I haven’t added hammerjs to the project yet.

Instead of seeing the warning in my tests, I see

TypeError: Cannot read property 'indexOf' of undefined

      at HammerGesturesPlugin.isCustomEvent (../packages/platform-browser/src/dom/events/hammer_gestures.ts:236:74)
      at HammerGesturesPlugin.supports (../packages/platform-browser/src/dom/events/hammer_gestures.ts:163:71)
      at EventManager._findPluginFor (../packages/platform-browser/src/dom/events/event_manager.ts:83:18)
      at EventManager.addEventListener (../packages/platform-browser/src/dom/events/event_manager.ts:50:25)
      at DefaultDomRenderer2.listen (../packages/platform-browser/src/dom/dom_renderer.ts:218:42)
      at BaseAnimationRenderer.listen (../../packages/platform-browser/animations/src/animation_renderer.ts:194:26)

So it appears that some hammer placeholder module is being mocked when it shouldn’t be.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:6 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
kreatemorecommented, Mar 20, 2019

I can’t yet give you a reproducible example, but I can confirm that shallow(...).dontMock(HAMMER_GESTURE_CONFIG) did work for us.

1reaction
getsafcommented, Feb 7, 2019

Aww man, I remember Hammer being weird in some tests on another project I worked on. Are you using the NoopAnimationsModule?

Last project I worked on that used Animations, we did it globally with something like this so all the Shallow tests automatically hooked up the test module:

Shallow
  .alwaysReplaceModule(BrowserAnimationsModule, NoopAnimationsModule)
  .neverMock(NoopAnimationsModule);

I vaguely remember someone needing to either provide a HAMMER_GESTURE_CONFIG or neverMock that too.

If those don’t work out for you, maybe we can reproduce it in a StackBlitz and collaborate on it there.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How can I suppress "WARN: 'Could not find HammerJS." on ...
When executing tests, each test logs the following: WARN: 'Could not find HammerJS. Certain Angular Material components may not work correctly.'.
Read more >
Hammer.js overrides native drag&drop #1457 - GitHub
The dragstart event gets overriden by Hammer.js, so you can't access required event properties like dataTransfer.
Read more >
Changelog - Hammer.js
#665; Fix multi-touch at different elements. #668; Added experimental single-user Touch input handler. This to improve performance/ux when ...
Read more >
Gesture Recognition: A Hands-On Example With HammerJS
In this article, you'll learn how to create web experiences with touch gestures using simple and easy HTML, CSS and a little bit...
Read more >
ReactJS / HammerJS integration. Support touch events in your ...
React-HammerJS wraps a React component, binding Hammer events to it so it can fire the handlers specified. Properties. Event Listener properties. onTap ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found