Uncaught Error: translation: 'auth.signIn' on locale: 'null' was not found

[ryrych]

import Ember from 'ember';
import hbs from 'htmlbars-inline-precompile';
import { moduleForComponent, test } from 'ember-qunit';
import instanceInitializer from 'ntfrontend/instance-initializers/ember-intl';

moduleForComponent('auth-button', 'Integration | Component | auth button', {
  integration: true,
  setup() {
    instanceInitializer.initialize(this);
    const intl = this.container.lookup('service:intl');
    intl.setLocale('en-us');
  },
[…]
});

    {{content-for 'body'}}
    {{content-for 'test-body'}}
    <script src="assets/intl/intl.min.js"></script>
    <script src="assets/intl/locales/en-us.js"></script>
    <script src="assets/vendor.js"></script>

# translations/auth/en-us.yaml
auth:
  signUp: "Sign up"
  signIn: "Sign In"
  logout: "Logout"

[jasonmit]

Which versions of ember and ember-qunit

I also don't see references to some_key, is this coming from a test or app code? Any chance you can provide this issue isolated in an example app. Would speed up turn around time.

[ryrych]

"ember-qunit": "0.4.14",
"ember": "2.1.0",

I used some_key so that the issue title is more generic. If the versions don't help you much with debugging, I can prepare a single app—can you example app serve as a base app?

[jasonmit]

I can prepare a single app—can you example app serve as a base app

Yup, just throw together an example app and I'll look into what is happening. It's unclear by the description of the issue.

[ryrych]

This is the working example: https://github.com/jasonmit/ember-intl-example/pull/2/files

The difference with the original is that I use pods and nested translations. Now I'll try to reproduce that.

[ryrych]

Here's another example: when I keep translations in one file, it works. When I'd move it to translations/auth/en_us.yaml it doesn't. I'll create another example for that. I'm not sure if is related to this bug.

[ryrych]

When I use nested translations:

version: 1.13.7
Build failed.
EISDIR: illegal operation on a directory, read
Error: EISDIR: illegal operation on a directory, read
    at Error (native)
    at Object.fs.readSync (fs.js:603:19)
    at Object.fs.readFileSync (fs.js:438:24)
    at readAsObject (/Users/wojtekryrych/projects/ember-intl-example/node_modules/ember-intl/lib/broccoli/translation-preprocessor.js:55:19)
    at TranslationPreprocessor.<anonymous> (/Users/wojtekryrych/projects/ember-intl-example/node_modules/ember-intl/lib/broccoli/translation-preprocessor.js:126:23)
    at Array.forEach (native)
    at TranslationPreprocessor.updateCache (/Users/wojtekryrych/projects/ember-intl-example/node_modules/ember-intl/lib/broccoli/translation-preprocessor.js:125:27)
    at /Users/wojtekryrych/projects/ember-intl-example/node_modules/ember-intl/node_modules/broccoli-caching-writer/index.js:107:21
    at lib$rsvp$$internal$$tryCatch (/Users/wojtekryrych/projects/ember-intl-example/node_modules/ember-intl/node_modules/broccoli-caching-writer/node_modules/rsvp/dist/rsvp.js:493:16)
    at lib$rsvp$$internal$$invokeCallback (/Users/wojtekryrych/projects/ember-intl-example/node_modules/ember-intl/node_modules/broccoli-caching-writer/node_modules/rsvp/dist/rsvp.js:505:17)

[jasonmit]

When I use nested translations

Could not reproduce this on the latest version of ember-intl.

[jasonmit]

Thanks for taking the time to creates those branches. I ran each one against the latest version of ember-intl and all tests were passing on each. If you upgrade, and it still persists after you reinstall all deps, feel free to reopen and we'll need to pair on trying to solve this.

http://i.imgur.com/egTohZ9.png

[ryrych]

@jasonmit Hi. I forgot to update it yesterday. The problem was with setup and beforeEach section.

Before (not working)

import Ember from 'ember';
import hbs from 'htmlbars-inline-precompile';
import { moduleForComponent, test } from 'ember-qunit';
import instanceInitializer from 'ntfrontend/instance-initializers/ember-intl';

const userStub = Ember.Service.extend({
  loggedIn: false,
});

moduleForComponent('auth-button', 'Integration | Component | auth button', {
  integration: true,
  setup() {
    instanceInitializer.initialize(this);
    const intl = this.container.lookup('service:intl');
    intl.setLocale('en-us');
  },
  beforeEach: function () {
    this.register('service:current-user', userStub);
    this.inject.service('current-user', { as: 'user' });
  },
});

test('it renders', function(assert) {
  assert.expect(1);

  this.render(hbs`{{auth/auth-button}}`);

  assert.equal(this.$().text().trim(), 'login');
});

After (working, removed beforeEach)

moduleForComponent('auth-button', 'Integration | Component | auth button', {
  integration: true,
  setup() {
    this.register('service:current-user', userStub);
    this.inject.service('current-user', { as: 'user' });
    instanceInitializer.initialize(this);
    const intl = this.container.lookup('service:intl');
    intl.setLocale('en-us');
  }
});

test('should render auth links', function(assert) {
  assert.expect(2);
  this.render(hbs`{{auth/auth-button}}`);
  assert.equal(this.$().text().trim(), 'Sign In');

  this.set('user.loggedIn', true);
  this.render(hbs`{{auth/auth-button}}`);
  assert.equal(this.$().text().trim(), 'Logout');
});

Now it seems obvious. :)