Why do I get "Ajax authorization fails" in my tests

Question

I am following the ember tutorials, and specifically I'm on services.

I am 99.9% certain that I have the exact code in place -- I am copying by hand, because I believe that helps me absorb it more completely, but if anything fails I start using a diff checker to see if I made a typo. To my knowledge, no typos.

The App I have written performs identically to the screen shots in the tutorials, and the only error I get is a lint error for having a test that doesn't have an assert in it (yet).

Prior to this unit, all other tests have passed as well. But now I am getting failed tests that previously passed. They appear to all stem from the stubbed call to the map service failing. The first test that fails is integration/component/rental-listing-test.js:

hooks.beforeEach(function() {
  this.rental = {
    image: 'fake.png',
    title: 'test-title',
    owner: 'test-owner',
    type: 'test-type',
    city: 'test-city',
    bedrooms: 3
  };
});
test('should display rental details', async function(assert) {
  await render(hbs`{{rental-listing rental=rental}}`);
  assert.equal(this.element.querySelector('.listing h3').textContent.trim(), 'test-title', 'Title: test-title');
  assert.equal(this.element.querySelector('.listing .owner').textContent.trim(), 'Owner: test-owner', 'Owner: test-owner');
});

If I remove the new line from rental-listing.hbs ( {{location-map location=rental.city}} ), thus preventing the map from being used, these tests once again pass (though the new tests for the component using the service have issues).

So either I am doing something wrong that I can't find, or else the fine folk at emberjs.com have not provided complete information in this tutorial. Do I need to somehow stub the map service? that appears in the .hbs file for the above test to pass? If so, why do you think they failed to mention this?

ETA assertion:

Ajax authorization failed                      @ 273 ms
Source: Error: Ajax authorization failed
  at new EmberError (http://localhost:7357/assets/vendor.js:13635:31)
  at new AjaxError (http://localhost:7357/assets/vendor.js:116954:13)
  at new UnauthorizedError (http://localhost:7357/assets/vendor.js:116968:13)
  at Class._createCorrectError (http://localhost:7357/assets/vendor.js:117533:25)
  at Class.handleResponse (http://localhost:7357/assets/vendor.js:117528:25)
  at Object.jqXHR.done.fail (http://localhost:7357/assets/vendor.js:117380:41)
  at fire (http://localhost:7357/assets/vendor.js:3609:31)
  at Object.fireWith [as rejectWith] (http://localhost:7357/assets/vendor.js:3739:7)
  at done (http://localhost:7357/assets/vendor.js:9648:14)
  at XMLHttpRequest.<anonymous> (http://localhost:7357/assets/vendor.js:9889:9)

Not in the terminal I'm running the server or the tests in. Not in the Chrome Console. Not in the browser window showing the test results. — The E, Dec 29 '18 at 18:51
What assertion is failing? It may not be one in your test but a general assertion that your application should not throw. If that's the case we need the error message provided by that assertion. — jelhan, Dec 29 '18 at 19:08

Todd Jordan · Accepted Answer · 2018-12-30T20:21:12.483

1

You shouldn't need the api key to run the tests. Have you tried the super rentals repo to see if it has the same issue? https://github.com/ember-learn/super-rentals

If it does have the same problem we'll probably need to PR a fix to the tutorial.

Update

I see that the integration test in question is missing a stub maps service definition. It is there in the rentals repo, but not mentioned in the guides tutorial. See https://github.com/ember-learn/super-rentals/blob/master/tests/integration/components/rental-listing-test.js for the code. I've added this info to an issue for updating the guides: https://github.com/ember-learn/guides-source/issues/347

edited Dec 30 '18 at 20:21

answered Dec 30 '18 at 19:52

Todd Jordan

76
2

My way worked, but obviously it would be better to stub the service. I will not have time to play with it till tomorrow night tho, so I'll update then and make sure it works. This would be my preferred method – The E Dec 31 '18 at 02:36
FYI, I did finally get around to double checking this. Works very smoothly. Thanks for pointing it out! – The E Jan 01 '19 at 23:51

score 0 · Answer 2 · answered Dec 29 '18 at 23:23

0

So I finally had time to look at it. The problem is that this is set up for the external map service to use an environment variable for an API key. This is why it runs the app fine (I use KEY=value ember s to start the app) but the tests were not. Simply using KEY=value ember t -s causes these tests to pass. And I'm left with only linting issues.

For the record, this is the sort of thing that should be in the tutorial itself, and I'm not sure why I didn't think of it before.

answered Dec 29 '18 at 23:23

The E

697
1
9
23

1

FYI, your question has been referenced on the Ember Discord for potential updates to the tutorial – maxwondercorn Dec 30 '18 at 19:19
This is great. Be sure to check out the answer from @todd-jordan above. The code for stubbing it (a better solution than running the tests with an environment variable) is in the repo. The ideal solution is to put that code into the tutorial text as well. – The E Jan 01 '19 at 23:50

Why do I get "Ajax authorization fails" in my tests

2 Answers2