Components: Material 7 Upgrade Error - normalizePassiveListenerOptions' was not found in '@angular/cdk/platform

[naveedahmed1]

Bug, feature request, or proposal:

After updating my project to Angular 7, Material 7 I am receiving below warning:

WARNING in ./node_modules/@angular/material/esm5/core.es5.js 1582:40-71
"export 'normalizePassiveListenerOptions' was not found in '@angular/cdk/platform'
i ｢wdm｣: Compiled with warnings.

And when I run my app in browser it throws below error:

Uncaught TypeError: Object(...) is not a function
    at Object.Wf4p (main.73d3a35a166575881912.js:1)
    at f (runtime.568a81b1ca8e8de7d15c.js:1)
    at Object.t68o (main.73d3a35a166575881912.js:1)
    at f (runtime.568a81b1ca8e8de7d15c.js:1)
    at Module.zUnb (main.73d3a35a166575881912.js:1)
    at f (runtime.568a81b1ca8e8de7d15c.js:1)
    at Object.0 (main.73d3a35a166575881912.js:1)
    at f (runtime.568a81b1ca8e8de7d15c.js:1)
    at a (runtime.568a81b1ca8e8de7d15c.js:1)
    at Array.c [as push] (runtime.568a81b1ca8e8de7d15c.js:1)

Its strange that everything was working perfectly with Material 7.0.0-rc.2 and throwing error after upgrade even though there aren't any breaking changes mentioned in changelog.

What is the expected behavior?

It should compile without warning and work without error in browser.

What is the current behavior?

Its broken and throw above error.

What are the steps to reproduce?

I just updated Angular packages to the following and it started throwing error:

    "@angular/animations": "7.0.0",
    "@angular/cdk": "7.0.0-rc.2",
    "@angular/cdk-experimental": "7.0.1",
    "@angular/common": "7.0.0",
    "@angular/compiler": "7.0.0",
    "@angular/core": "7.0.0",
    "@angular/flex-layout": "7.0.0-beta.19",
    "@angular/forms": "7.0.0",
    "@angular/http": "7.0.0",
    "@angular/material": "7.0.1",
    "@angular/material-moment-adapter": "7.0.1",
    "@angular/platform-browser": "7.0.0",
    "@angular/platform-browser-dynamic": "7.0.0",
    "@angular/platform-server": "7.0.0",
    "@angular/pwa": "0.10.2",
    "@angular/router": "7.0.0",
    "@angular/service-worker": "7.0.0",

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

node v8.11.4
npm 5.6.0
ng versions:

@angular-devkit/architect          0.10.2
@angular-devkit/build-angular      0.10.2
@angular-devkit/build-optimizer    0.10.2
@angular-devkit/build-webpack      0.10.2
@angular-devkit/core               7.0.2
@angular-devkit/schematics         7.0.2
@angular/cdk                       7.0.0-rc.2
@angular/cdk-experimental          7.0.1
@angular/cli                       7.0.2
@angular/fire                      5.1.0
@angular/flex-layout               7.0.0-beta.19
@angular/material                  7.0.1
@angular/material-moment-adapter   7.0.1
@angular/pwa                       0.10.2
@ngtools/webpack                   7.0.2
@schematics/angular                7.0.2
@schematics/update                 0.10.2
rxjs                               6.3.3
typescript                         3.1.3
webpack                            4.19.1

[Splaktar]

You need to update CDK to 7.0.1, it's still on rc.2. You can avoid missing things like this by doing ng update @angular/material. Also just ng update will let you know if any of your dependencies need updating.

[naveedahmed1]

Thank you so much @Splaktar for pointing that out, it fixed the error :)

[nefcanto]

I have the same issue here, after upgrading to material 7. I'm using umd modules as we're not using Angular CLI. Here's the packages.json dependencies:

    "@angular/animations": "^7.0.2", 
    "@angular/cdk": "^7.0.2",
    "@angular/common": "~7.0.0",
    "@angular/compiler": "~7.0.0",
    "@angular/core": "~7.0.0",
    "@angular/forms": "~7.0.0",
    "@angular/http": "~7.0.0",
    "@angular/material": "^7.0.2",
    "@angular/platform-browser": "~7.0.0",
    "@angular/platform-browser-dynamic": "~7.0.0",
    "@angular/router": "~7.0.0",
    "core-js": "^2.5.4",
    "rxjs": "~6.3.3",
    "zone.js": "~0.8.26"`

Any ideas?

[Splaktar]

@nefcanto it looks like your @angular/animations package may not be aligned with the other versions of @angular/core, @angular/common, etc. This is both due to the 7.0.2 vs 7.0.0 and the ^ versus ~.

[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._}