Deprecation warning for mouseEnter/mouseLeave component methods

[rahulk94]

We're using [email protected] in our EmberJS 3.24 application and are seeing the following deprecation warnings when using @mouseEnter and @mouseLeave attributes.

DEPRECATION: <my-app@component:swiper-container::ember2737>: Using `mouseEnter` event handler methods in components has been deprecated. [deprecation id: ember-views.event-dispatcher.mouseenter-leave-move] See https://emberjs.com/deprecations/v3.x#toc_component-mouseenter-leave-move for more details.
        at logDeprecationStackTrace (http://localhost:4200/assets/vendor.js:43287:21)
        at HANDLERS.<computed> (http://localhost:4200/assets/vendor.js:43420:9)
        at raiseOnDeprecation (http://localhost:4200/assets/vendor.js:43314:9)
        at HANDLERS.<computed> (http://localhost:4200/assets/vendor.js:43420:9)
        at handleDeprecationWorkflow (http://localhost:4200/assets/vendor.js:73069:9)
        at HANDLERS.<computed> (http://localhost:4200/assets/vendor.js:43420:9)
        at deprecationCollector (http://localhost:4200/assets/vendor.js:73104:5)
        at HANDLERS.<computed> (http://localhost:4200/assets/vendor.js:43420:9)
        at invoke (http://localhost:4200/assets/vendor.js:43432:9)

DEPRECATION: <my-app@component:swiper-container::ember2737>: Using `mouseLeave` event handler methods in components has been deprecated. [deprecation id: ember-views.event-dispatcher.mouseenter-leave-move] See https://emberjs.com/deprecations/v3.x#toc_component-mouseenter-leave-move for more details.
        at logDeprecationStackTrace (http://localhost:4200/assets/vendor.js:43287:21)
        at HANDLERS.<computed> (http://localhost:4200/assets/vendor.js:43420:9)
        at raiseOnDeprecation (http://localhost:4200/assets/vendor.js:43314:9)
        at HANDLERS.<computed> (http://localhost:4200/assets/vendor.js:43420:9)
        at handleDeprecationWorkflow (http://localhost:4200/assets/vendor.js:73069:9)
        at HANDLERS.<computed> (http://localhost:4200/assets/vendor.js:43420:9)
        at deprecationCollector (http://localhost:4200/assets/vendor.js:73104:5)
        at HANDLERS.<computed> (http://localhost:4200/assets/vendor.js:43420:9)
        at invoke (http://localhost:4200/assets/vendor.js:43432:9)

These deprecation warnings were added in Ember 3.13. See https://deprecations.emberjs.com/v3.x/#toc_component-mouseenter-leave-move for more information.

In order to get around these deprecation warnings you should instead use the on modifier for these callbacks e.g.

      <SwiperContainer
        @options={{this.swiperOptions}}
        @registerAs={{this.carousel}}
        {{on "mouseenter" this.doThingOnEnter}}
        {{on "mouseleave" this.doThingOnLeave}}
      >
      ...