Fails with Octane blueprint

[mehulkar]

Just tried running my app with the Octane blueprint and boot failed because jquery is used in this addon. It looks like it's not specified as a dependency though, so it's failing to import:

• https://github.com/ember-cli/ember-ajax/blob/master/addon/utils/ajax.ts#L4
• https://github.com/ember-cli/ember-ajax/blob/master/package.json

[rwjblue]

The octane blueprint should not depend on ember-ajax, would you mind filing a bug for that?

[mehulkar]

Blueprint doesn’t depend on it but my app does :)

I’m actually a little unclear on why it was throwing this error since in my stack trace it was throwing on Ember.$ being unavailable, whereas ^ points to a jQuery import. I also tried installing jQuery manually but still same stack trace. My only guess is that I have multiple versions of ember-Ajax and some history version depends on Ember.$. Didn’t finish the trace.

[samuelherzog]

It seems like I've stumbled into the same case while trying to work through the superrentals tutorial with an ember octane app. As part of the tutorial, I installed ember-simple-leaflet-maps which depends on ember-ajax.

My minimal reproduction steps are as follows (repository):

ember new octane-with-ember-ajax -b @ember/octane-app-blueprint --yarn --no-welcome
cd octane-with-ember-ajax/
ember g route index
ember install ember-ajax

Add the following app/routes/index.js:

import Route from '@ember/routing/route';
import { inject as service } from '@ember/service';

export default class IndexRoute extends Route {
    @service ajax;
}

The following error appears in Chromes Console:

Uncaught (in promise) TypeError: Cannot read property 'ajax' of undefined
    at Module.callback (ajax.js:8)

Where the contents of ajax.js as part of the vendor.js are as follows

define("ember-ajax/utils/ajax", ["exports"], function (_exports) {
  "use strict";

  Object.defineProperty(_exports, "__esModule", {
    value: true
  });
  _exports.default = void 0;
  const ajax = typeof FastBoot === 'undefined' ? Ember.$.ajax : FastBoot.require('najax');
  var _default = ajax;
  _exports.default = _default;
});

which leads me to believe this is the transpiled output of https://github.com/ember-cli/ember-ajax/blob/master/addon/utils/ajax.ts#L4 .

The question I can't answer is why the imported jQuery line would be transpiled to Ember.$.ajax. I also searched the complete repository for another line of Ember.$.ajax. The only one I could find is in ember-data version referenced in the octane blueprint. I can't tell if there's any relation.

What are the next steps to get a working octane/ember-ajax combination? I'd be happy to assist with my limited means. Thanks!

---

$ ember -v
ember-cli: 3.10.0-beta.2
node: 10.15.3
os: darwin x64
$ yarn -v
1.15.2

Edit: Added a link to my repository for ease of reproduction

[rwjblue]

@samuelherzog - Thank you for reporting! I think we need to migrate this to an issue in the ember-learn/guides repo, would you mind doing that?

[samuelherzog]

@rwjblue happy to do that. One question which might be related: I since learned that I can get things running by running ember install @ember/jquery and changing the optional feature setting for jQuery. Could it be that jQuery should be a dependency for ember-ajax, or do you plan to make it optional here too?

[rwjblue]

@samuelherzog I think we should actually make ember-simple-leaflet-maps not depend on ember-ajax (because the octane blueprint will not ship with jQuery). I created https://github.com/ember-learn/ember-simple-leaflet-maps/issues/2 to track that (but we still need to track the issue in the guides too).