Ember helper unit test - inject or mock service - ember.js

I'm on Ember 1.13 (not 2.x yet), and I need to be able to run a helper unit test. My helper has a line:
const i18n = Frontend.__container__.lookup('service:i18n');
which injects a service the ugly way, since before Ember 2.x helpers are not "real" objects and cannot do something like:
i18n: Ember.inject.service('i18n')
When I try to run simple unit tests for the helper, I get:
Can't find variable: Frontend
How do I import/inject/mock the global app namespace in this case? Or is there another way to get past this?

Related

Global beforeEach/afterEach for ember qunit tests

My app stores some information about the current session in localStorage. Therefore I need my tests to clear localStorage before or after each single test throughout all test files. Is there a way to define a beforeEach or afterEach callback globally instead of on each test file?
We had wrapped ember-qunit's module, moduleFor and moduleForComponent for a nearly the same reason. And we are importing those wrappers instead of ember-qunit.
Another suggestion is to wrap localStorage with a service. Never access to localStorage except this service. So you can use a mock implementation of it in tests.
Updated:
How it is realised:
import { moduleFor, moduleForModel, test, only, setResolver } from 'ember-qunit';
import { moduleForComponent as qunitModuleForComponent } from 'ember-qunit';
function moduleForComponent(name, description, callbacks) {
//our implementation that wraps "qunitModuleForComponent"
//eg. init commonly used services vs.
}
export {
moduleFor,
moduleForComponent,
moduleForModel,
test,
only,
setResolver
};
Pros:
Prevents code duplication
Centralize unit test management
Easy to add new methods for custom needs, such as: moduleForValidatableComponent, moduleForLocalStorage
Cons:
ember-cli generates tests those are importing ember-qunit. Developers must change the import statements to these wrappers. It was sometimes forgotten. (When a test fails, developers remember that they need to change import statements.)
For some tests, wrapping is unnecessary.

Ember component unit testing inject service defined in initalizer

I am writing a unit test case for my component.
Ember 0.12,
Ember-qunit 0.3.13
Ember-i18n: "4.1.1",
I am initialising this i18n service in via Ember initaliazers, so that i can access i18n serivces as this.i18n.t('some key'). which i am using in my component
some: computed('', {
get(){
this.i18n.t('somekey') + "Test"
}
})
My component unit test for this component fails, because i am not able to inject the i18n service. Please help me in solving it and i tried
needs: ['serivces:i18n'] it wont work because i have initialised via Intializers Issue injecting via initalizer
and the below code also wont work because i am using older version of ember-qunit (Please i don't wont to update to newest version because it affects all other test cases)
this.register('service:user-session', userSession);
this.inject.service('user-session', { as: 'userSession' });
Help me in solving in this issue , if there is a need for more clarity in the question , please do comment. Thanks

How do enable the format.js helpers in Ember Unit tests

I am using Ember with formatjs to internationalize my application, and ember-cli to build it all.
When I generate a component with
ember g component some-component
Ember also creates a test that checks that the component renders. However, if I use the intl-get helper from formatjs in the component template, the unit test fails.
So how can I register the custom helpers that formatjs creates for a unit test?
I first tried to add the intl-get helper:
moduleForComponent('some-component', {
needs: ['helper:intl-get']
});
However, this just fails inside intl-get when it tries to access "intl:main". I would like for the intl initializer to run, but I am not sure if there is even application setup. Or is it some way to just mock those methods using sinon?
My current workaround is to just delete the 'it renders' tests. But I would like for these tests to pass as well, so I can further test rendering later if I want.
Try:
moduleForComponent('some-component', {
integration: true
});

Global teardown function in Jasmine.js

I´m testing a Rails 4 / ember.js application with Jasmine.
How do I reset Ember after each spec without writing the teardown into every spec file?
# Spec/javascript/support/spec_helper.js.coffee
App.ApplicationAdapter = DS.FixtureAdapter
App.setupForTesting()
App.injectTestHelpers()
# Reset Ember after each spec
# How do I tell jasmine to run a function after each spec?
# Metacode:
jasmine.afterEach ->
App.reset()
beforeEach/afterEach can be declared globally as well, just use
beforeEach(function() {
console.log('before');
});
or
afterEach(function() {
console.log('after');
});
Here's an example of global implementation (not Ember).
http://jsbin.com/pavokiru/1/edit
Personally I would use qunit with Ember, they've built so many helpers for use with qunit, it'd be a lot of work to make it work with jasmine, especially when it comes to asynchronous processes (which are many in Ember).

Best practice for avoiding namespace collision and initialization functions testing Ember.js

What is the best thing to do to avoid name collision between development/production environment and testing environment for ember based application.
Usually, every Ember application has a namespace :
window.MyApp = Em.Application.create();
in production, I run some initialization functions by redefining the ready property of Em.Application
window.MyApp = Em.Application.create(
ready: function() {
// create some objects
}
);
But, in my test enviroment, I don't want to run these initialization functions because I create objects myself. Using the same definition of MyApp causes a collision because objects I create insert the same element in the DOM. So how can I use the same namespace MyApp without the ready function when I test my application ? I use jasmine to test the application.
I keep the glue code which instantiates my controllers, creates and setups views out of the Application#ready function.
Take pangratz/ember.js-dashboard for an example: core.js holds just the Namespace definitiion, whereas controllers.js, views.js and so on define my classes. The glue code which instantiates the controllers, creates the views and setups the bindings is defined in main.js. The main.js is then used among the others in the 'real' application in the index.html.
I use interline/ember-skeleton for the basic application layout, which itself uses QUnit for testing. But this should be applicable for Jasmine too.