Replacement for deprecated MediaQueryList.addListener() method

The Mozilla Developers Network docs say MediaQueryList.addListener() is deprecated.

Though it’s working in my (Angular 8) code, the linting in VS Code is warning about deprecation.

What’s the replacement for MediaQueryList.addListener()?

Answer

Quoting from the MDN docs about MediaQueryList:

MediaQueryList.addListener() Adds a listener to the MediaQueryListener that will run a custom callback function in response to the media query status changing. This is basically an alias for EventTarget.addEventListener(), for backwards compatibility purposes.

addEventListener needs an event type as the first argument, so it becomes this:

// deprecated: MediaQueryList.addListener(listener);
MediaQueryList.addEventListener('change', listener);

The same stands true for removeListener():

// deprecated: MediaQueryList.removeListener(listener);
MediaQueryList.removeEventListener('change', listener);