Ember 3.9 DEPRECATION: Using this.$() in a component has been deprecated, consider using this.element [deprecation id: ember-views.curly-components.jquery-element]

[arun-prasad-r]

I've recently upgraded to ember 3.9 and I get a ton of this deprecation warning in the console.

DEPRECATION: Using this.$() in a component has been deprecated, consider using this.element [deprecation id: ember-views.curly-components.jquery-element]

In my case the error came from using semantic ui dropdown component. The error originates from the semantic base mixin. (mixins/base.js)

// /assets/addon-tree-output/semantic-ui-ember/mixins/base.js
    getSemanticScope() {
      if (Ember.isPresent(this.get('onElement'))) {
        return this.$(this.get('onElement'));
      }
      return this.$(); //<-- Error
    },

[Unkrass]

I'd appreciate a fix as well.

[nerdiken]

Guys i tried fix this issue here https://github.com/Semantic-Org/Semantic-UI-Ember/pull/250 . Hope it helps!

[Polve]

I would appreciate the fix as well

[MonsieurDart]

With the version 3.0.4 (tagged yesterday), this issue has been fixed! A simple yarn upgrade semantic-ui-ember and no more warnings. 😊

[allthesignals]

@MonsieurDart is that true? I'm still seeing the warning after upgrading to 3.0.4.

[MonsieurDart]

Yep, quite sure. Maybe your warnings also come from an other addon?

[iamareebjamal]

I'm pretty sure just enabling jquery integration does not stop deprecation messages. You have to move away from this.$ for that

[iamareebjamal]

https://deprecations.emberjs.com/v3.x/#toc_jquery-apis

[allthesignals]

Right, sorry, some minor detail context: I am seeing this in Ember Octane (3.15) :) which might explain why we're seeing different behavior.

So I think we should find a way to move away from this.$ or some other workaround for addons that require jQuery...

Also, maybe something is up with the deprecation warning? I wonder what would happen if this.$ were defined explicitly in the addon?