Use addEventListener when possible.

[gojefferson]

matcher. addListener is deprecated, and my testing shows that it does not work on the iPad version of Chrome. There are probably other browsers where ember-responsive is also broken for the same reason.

I've submitted a PR to fix this issue: #336.

[gojefferson]

Bump on this. Please consider merging the #336.

[edflips]

I would very much like to see this PR merged

[tcjr]

This should definitely get merged.

The W3C spec says this:

Note: This specification initially had a custom callback mechanism with addListener() and removeListener(), and the callback was invoked with the associated media query list as argument. Now the normal event mechanism is used instead. For backwards compatibility, the addListener() and removeListener() methods are basically aliases for addEventListener() and removeEventListener(), respectively, and the change event masquerades as a MediaQueryList.

And the Mozilla docs on MediaQueryList says this about addListener:

Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; ... Be aware that this feature may cease to work at any time.

I just verified that all the existing tests already pass using this code since it checks for addEventListener first. Browsers will likely stop supporting the legacy addListener.