mobileQuery is undefined in Safari

[Kynson]

What is the expected behavior?

No error is resulted.

What is the current behavior?

Safari returns an error: TypeError: this.mobileQueryLarge.addEventListener is not a function. (In 'this.mobileQueryLarge.addEventListener("change",this.mobileQueryListener)', 'this.mobileQueryLarge.addEventListener' is undefined)

export class AppComponent implements OnInit {

  public mobileQueryLarge: MediaQueryList;
  private mobileQueryListener: () => void;

  constructor(private media: MediaMatcher,
    private changeDetectorRef: ChangeDetectorRef) {
    this.mobileQueryLarge = media.matchMedia('(max-width: 787px)');
    this.mobileQueryListener = () => changeDetectorRef.detectChanges();
    this.mobileQueryLarge.addEventListener('change', this.mobileQueryListener);
  }
}

What are the steps to reproduce?

Please clone this repo: https://github.com/Kynson/Angular-cdk-mobileQuery-issue.git

And run

http-server .

or any test serve you want

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

Angular CLI: 7.3.1
Node: 10.14.1
OS: darwin x64
Angular: 7.2.5
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, platform-server, router
... service-worker

Package Version

@angular-devkit/.DS_Store
@angular-devkit/architect 0.13.1
@angular-devkit/architect 2
@angular-devkit/build-angular 0.12.4
@angular-devkit/build-angular 2
@angular-devkit/build-optimizer 0.12.4
@angular-devkit/build-webpack 0.12.4
@angular-devkit/core 7.3.1
@angular-devkit/schematics 7.3.1
@angular-devkit/schematics 2
@angular/.DS_Store
@angular/cdk 7.3.2
@angular/cdk 2
@angular/cdk 3
@angular/cli 7.3.1
@angular/fire 5.1.1
@angular/material 7.3.2
@angular/material 2
@ngtools/webpack 7.2.4
@schematics/angular 7.3.1
@schematics/update 0.13.1
rxjs 6.4.0
typescript 3.2.4
webpack 4.28.4

Is there anything else we should know?

Both FAIL in production and development mode
Test is run on Safari version 12.0.3 (14606.4.5)
Test on mobile both Chrome and Safari FAIL in iOS
Test on Desktop Chrome SUCCESS

[CosmoFruit]

use addtListener instead addEventListener and removeListener instead removeEventListener

[angular-automatic-lock-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.}