Components: [mat-sort] causing warning when running unit tests: WARN: 'The "longpress" event cannot be bound because Hammer.JS is not loaded and no custom loader has been specified.'

[philmayfield]

What is the expected behavior?

Expect to not see a warning running a test

What is the current behavior?

Seeing a warning running a unit test

What are the steps to reproduce?

I cant seem to figuire out how to run a Jasmine test with StackBlitz, but I copied the example from the sorting section, and created the this unit test.

Which does pass, but throws the warning:

WARN: 'The "longpress" event cannot be bound because Hammer.JS is not loaded and no custom loader has been specified.'

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 7.1.4 (down to 7.0.0)
Material 7.2.0
Jasmine 3.3.0
Karma 3.1.4

Is there anything else we should know?

[crisbeto]

It's because the sort header is using some gestures from Hammer.js. You should be able to work around it by providing a dummy Hammer loader:

providers: [{
  provide: HAMMER_LOADER,
  useValue: () => new Promise(() => {})
}]

[philmayfield]

That indeed worked for me, thank you very much @crisbeto! Closing this issue.

[philmayfield]

Just another solution in case someone stumbles across this is to add hammer to the scripts arrays in your angular.json file. eg "scripts": ["node_modules/hammerjs/hammer.min.js"]

[DanielP42]

If you use jest for testing you can import 'hammerjs' in your jest.ts file.

[AKlaus]

Adding import 'hammerjs'; into the test.ts solves the problem.
The one which appears in angular.json under:

"test": {
    "builder": "@angular-devkit/build-angular:karma",
    "options": {
        "main": "src/test.ts",
...

Adding HammerJs to the scripts section of angular.json (as @philmayfield suggested above) didn't help.

[geyuqiu]

@crisbeto adding the code in app.module.ts unfortunately did not solve the issue for me :(

importing hammerjs did thx 👍

[izerozlu]

Adding import 'hammerjs'; into the test.ts solves the problem.
The one which appears in angular.json under:

"test": {
  "builder": "@angular-devkit/build-angular:karma",
  "options": {
      "main": "src/test.ts",
...

Adding HammerJs to the scripts section of angular.json (as @philmayfield suggested above) didn't help.

That precise suggestion ( from @philmayfield ) resolved my problem. That's weird.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}