setup: function() {
Ember.lookup = lookup = { Ember: Ember };
MyApp = lookup.MyApp = EmberObject.create({});
registry = new Registry();
container = registry.container();
registry.optionsForType('template', { instantiate: false });
},
test("should target the with-controller inside an {{#with controller='person'}} [DEPRECATED]", function() {
var registeredTarget;
ActionHelper.registerAction = function(actionName, options) {
registeredTarget = options.target.value();
};
var PersonController = EmberObjectController.extend();
var registry = new Registry();
var container = registry.container();
var parentController = EmberObject.create({
container: container
});
view = EmberView.create({
container: container,
template: compile('{{#with view.person controller="person"}}<div {{action "editTodo"}}></div>{{/with}}'),
person: EmberObject.create(),
controller: parentController
});
registry.register('controller:person', PersonController);
expectDeprecation(function() {
runAppend(view);
}, 'Using the context switching form of `{{with}}` is deprecated. Please use the keyword form (`{{with foo as bar}}`) instead. See http://emberjs.com/guides/deprecations/#toc_more-consistent-handlebars-scope for more details.');
ok(registeredTarget instanceof PersonController, "the with-controller is the target of action");
});
QUnit.test('should give its item views the property specified by itemProperty', function() {
var registry = new Registry();
var ItemPropertyBindingTestItemView = EmberView.extend({
tagName: 'li'
});
registry.register('view:item-property-binding-test-item-view', ItemPropertyBindingTestItemView);
// Use preserveContext=false so the itemView handlebars context is the view context
// Set itemView bindings using item*
view = EmberView.create({
baz: 'baz',
content: A([EmberObject.create(), EmberObject.create(), EmberObject.create()]),
container: registry.container(),
template: compile('{{#collection content=view.content tagName="ul" itemViewClass="item-property-binding-test-item-view" itemProperty=view.baz preserveContext=false}}{{view.property}}{{/collection}}')
});
runAppend(view);
equal(view.$('ul li').length, 3, 'adds 3 itemView');
view.$('ul li').each(function(i, li) {
equal(jQuery(li).text(), 'baz', 'creates the li with the property = baz');
});
run(function() {
set(view, 'baz', 'yobaz');
});
equal(view.$('ul li:first').text(), 'yobaz', 'change property of sub view');
});
QUnit.test("should render nested collections", function() {
var registry = new Registry();
var container = registry.container();
registry.register('view:inner-list', CollectionView.extend({
tagName: 'ul',
content: A(['one','two','three'])
}));
registry.register('view:outer-list', CollectionView.extend({
tagName: 'ul',
content: A(['foo'])
}));
view = EmberView.create({
container: container,
template: compile('{{#collection "outer-list" class="outer"}}{{content}}{{#collection "inner-list" class="inner"}}{{content}}{{/collection}}{{/collection}}')
});
runAppend(view);
equal(view.$('ul.outer > li').length, 1, "renders the outer list with correct number of items");
equal(view.$('ul.inner').length, 1, "the inner list exsits");
equal(view.$('ul.inner > li').length, 3, "renders the inner list with correct number of items");
});
QUnit.test('destroys the controller generated with {{with foo as |bar| controller=\'blah\'}}', function() {
var destroyed = false;
var Controller = EmberController.extend({
willDestroy() {
this._super.apply(this, arguments);
destroyed = true;
}
});
var person = EmberObject.create({ name: 'Steve Holt' });
var registry = new Registry();
var container = registry.container();
var parentController = EmberObject.create({
container: container,
person: person,
name: 'Bob Loblaw'
});
view = EmberView.create({
container: container,
template: compile('{{#with person controller="person" as |steve|}}{{controllerName}}{{/with}}'),
controller: parentController
});
registry.register('controller:person', Controller);
runAppend(view);
runDestroy(view);
ok(destroyed, 'controller was destroyed properly');
});
QUnit.test("should target the with-controller inside an {{#with controller='person'}} [DEPRECATED]", function() {
var registeredTarget;
ActionHelper.registerAction = function({ node }) {
registeredTarget = node.state.target;
};
var PersonController = EmberController.extend();
var registry = new Registry();
var container = registry.container();
var parentController = EmberObject.create({
container: container
});
view = EmberView.create({
container: container,
template: compile('{{#with view.person controller="person"}}<div {{action "editTodo"}}></div>{{/with}}'),
person: EmberObject.create(),
controller: parentController
});
registry.register('controller:person', PersonController);
expectDeprecation(function() {
runAppend(view);
}, 'Using the context switching form of `{{with}}` is deprecated. Please use the block param form (`{{#with bar as |foo|}}`) instead.');
ok(registeredTarget instanceof PersonController, "the with-controller is the target of action");
});
QUnit.test('should be able to specify which class should be used for the empty view', function() {
var registry = new Registry();
var App;
run(function() {
lookup.App = App = Namespace.create();
});
var EmptyView = EmberView.extend({
template: compile('This is an empty view')
});
registry.register('view:empty-view', EmptyView);
view = EmberView.create({
container: registry.container(),
template: compile('{{collection emptyViewClass="empty-view"}}')
});
runAppend(view);
equal(view.$().text(), 'This is an empty view', 'Empty view should be rendered.');
runDestroy(App);
});
setup: function() {
Ember.lookup = lookup = { Ember: Ember };
template = templateFor("{{#each view.people}}{{name}}{{/each}}");
people = A([{ name: "Steve Holt" }, { name: "Annabelle" }]);
registry = new Registry();
container = registry.container();
registry.register('view:default', _MetamorphView);
registry.register('view:toplevel', EmberView.extend());
view = EmberView.create({
container: container,
template: template,
people: people
});
templateMyView = templateFor("{{name}}");
lookup.MyView = MyView = EmberView.extend({
template: templateMyView
});
expectDeprecation(function() {
runAppend(view);
},'Using the context switching form of {{each}} is deprecated. Please use the keyword form (`{{#each foo in bar}}`) instead. See http://emberjs.com/guides/deprecations/#toc_more-consistent-handlebars-scope for more details.');
},
QUnit.test("itemController specified in ArrayController with name binding does not change context", function() {
people = A([{ name: "Steve Holt" }, { name: "Annabelle" }]);
var PersonController = EmberController.extend({
controllerName: computed(function() {
return "controller:" + get(this, 'model.name') + ' of ' + get(this, 'parentController.company');
})
});
var PeopleController = ArrayController.extend({
model: people,
itemController: 'person',
company: 'Yapp',
controllerName: 'controller:people'
});
registry = new Registry();
registry.register('view:-legacy-each', LegacyEachView);
container = registry.container();
registry.register('controller:people', PeopleController);
registry.register('controller:person', PersonController);
view = EmberView.create({
container: container,
template: templateFor('{{#EACH|this|person}}{{controllerName}} - {{person.controllerName}} - {{/each}}', useBlockParams),
controller: container.lookup('controller:people')
});
runAppend(view);
equal(view.$().text(), "controller:people - controller:Steve Holt of Yapp - controller:people - controller:Annabelle of Yapp - ");
});
setup: function() {
registry = new Registry();
container = registry.container();
registry.optionsForType('template', { instantiate: false });
registry.register('view:default', _MetamorphView);
registry.register('view:toplevel', EmberView.extend());
},
setup: function() {
registry = new Registry();
container = registry.container();
registry.register('view:default', _MetamorphView);
registry.register('view:toplevel', EmberView.extend());
},
QUnit.test("destroys the controller generated with {{with foo controller='blah'}} [DEPRECATED]", function() {
var destroyed = false;
var Controller = EmberController.extend({
willDestroy() {
this._super.apply(this, arguments);
destroyed = true;
}
});
var person = EmberObject.create({ name: 'Steve Holt' });
var registry = new Registry();
var container = registry.container();
var parentController = EmberObject.create({
container: container,
person: person,
name: 'Bob Loblaw'
});
view = EmberView.create({
container: container,
template: compile('{{#with person controller="person"}}{{controllerName}}{{/with}}'),
controller: parentController
});
registry.register('controller:person', Controller);
expectDeprecation(function() {
runAppend(view);
}, 'Using the context switching form of `{{with}}` is deprecated. Please use the keyword form (`{{with foo as bar}}`) instead.');
runDestroy(view);
ok(destroyed, 'controller was destroyed properly');
});
QUnit.test("context should be content", function() {
var view;
registry = new Registry();
container = registry.container();
var items = A([
EmberObject.create({ name: 'Dave' }),
EmberObject.create({ name: 'Mary' }),
EmberObject.create({ name: 'Sara' })
]);
registry.register('view:an-item', EmberView.extend({
template: compile("Greetings {{name}}")
}));
view = EmberView.create({
container: container,
controller: {
items: items
},
template: compile('{{collection content=items itemViewClass="an-item"}}')
});
runAppend(view);
equal(view.$().text(), "Greetings DaveGreetings MaryGreetings Sara");
runDestroy(view);
});
QUnit.test("it should wrap context with object controller [DEPRECATED]", function() {
expectDeprecation(objectControllerDeprecation);
var Controller = ObjectController.extend({
controllerName: computed(function() {
return "controller:"+this.get('model.name') + ' and ' + this.get('parentController.name');
})
});
var person = EmberObject.create({ name: 'Steve Holt' });
var registry = new Registry();
var container = registry.container();
var parentController = EmberObject.create({
container: container,
name: 'Bob Loblaw'
});
view = EmberView.create({
container: container,
template: compile('{{#with view.person controller="person"}}{{controllerName}}{{/with}}'),
person: person,
controller: parentController
});
registry.register('controller:person', Controller);
expectDeprecation(function() {
runAppend(view);
}, 'Using the context switching form of `{{with}}` is deprecated. Please use the keyword form (`{{with foo as bar}}`) instead.');
equal(view.$().text(), "controller:Steve Holt and Bob Loblaw");
run(function() {
view.rerender();
});
equal(view.$().text(), "controller:Steve Holt and Bob Loblaw");
run(function() {
parentController.set('name', 'Carl Weathers');
view.rerender();
});
equal(view.$().text(), "controller:Steve Holt and Carl Weathers");
run(function() {
person.set('name', 'Gob');
view.rerender();
});
equal(view.$().text(), "controller:Gob and Carl Weathers");
strictEqual(view._childViews[0].get('controller.target'), parentController, "the target property of the child controllers are set correctly");
runDestroy(view);
});
setup: function() {
Ember.lookup = lookup = {};
lookup.TemplateTests = TemplateTests = Namespace.create();
registry = new Registry();
container = registry.container();
registry.optionsForType('template', { instantiate: false });
registry.register('view:default', _MetamorphView);
registry.register('view:toplevel', EmberView.extend());
},
QUnit.test("it should wrap keyword with object controller [DEPRECATED]", function() {
expectDeprecation(objectControllerDeprecation);
var PersonController = ObjectController.extend({
name: computed('model.name', function() {
return get(this, 'model.name').toUpperCase();
})
});
var person = EmberObject.create({ name: 'Steve Holt' });
var registry = new Registry();
var container = registry.container();
var parentController = EmberObject.create({
container: container,
person: person,
name: 'Bob Loblaw'
});
view = EmberView.create({
container: container,
template: compile('{{#with person as steve controller="person"}}{{name}} - {{steve.name}}{{/with}}'),
controller: parentController
});
registry.register('controller:person', PersonController);
runAppend(view);
equal(view.$().text(), "Bob Loblaw - STEVE HOLT");
run(function() {
view.rerender();
});
equal(view.$().text(), "Bob Loblaw - STEVE HOLT");
run(function() {
parentController.set('name', 'Carl Weathers');
view.rerender();
});
equal(view.$().text(), "Carl Weathers - STEVE HOLT");
run(function() {
person.set('name', 'Gob');
view.rerender();
});
equal(view.$().text(), "Carl Weathers - GOB");
runDestroy(view);
});
QUnit.test("itemController specified in template with name binding does not change context [DEPRECATED]", function() {
var Controller = EmberController.extend({
controllerName: computed(function() {
return "controller:"+this.get('model.name');
})
});
registry = new Registry();
registry.register('view:-legacy-each', LegacyEachView);
container = registry.container();
people = A([{ name: "Steve Holt" }, { name: "Annabelle" }]);
var parentController = {
container: container,
people: people,
controllerName: 'controller:parentController'
};
registry.register('controller:array', ArrayController.extend());
var template;
expectDeprecation(function() {
template = templateFor('{{#EACH|people|person|itemController="person"}}{{controllerName}} - {{person.controllerName}} - {{/each}}', useBlockParams);
}, /Using 'itemController' with '{{each}}'/);
view = EmberView.create({
template,
container: container,
controller: parentController
});
registry.register('controller:person', Controller);
runAppend(view);
equal(view.$().text(), "controller:parentController - controller:Steve Holt - controller:parentController - controller:Annabelle - ");
run(function() {
people.pushObject({ name: "Yehuda Katz" });
});
assertText(view, "controller:parentController - controller:Steve Holt - controller:parentController - controller:Annabelle - controller:parentController - controller:Yehuda Katz - ");
run(function() {
set(parentController, 'people', A([{ name: "Trek Glowacki" }, { name: "Geoffrey Grosenbach" }]));
});
assertText(view, "controller:parentController - controller:Trek Glowacki - controller:parentController - controller:Geoffrey Grosenbach - ");
strictEqual(view.childViews[0].get('_arrayController.target'), parentController, "the target property of the child controllers are set correctly");
});
test("raises if a dependency with a period is requested", function() {
var registry = new Registry();
var container = registry.container();
registry.register('controller:big.bird', Controller.extend());
registry.register('controller:foo', Controller.extend({
needs: 'big.bird'
}));
expectAssertion(function() {
container.lookup('controller:foo');
}, /needs must not specify dependencies with periods in their names \(big\.bird\)/,
'throws if periods used');
});
expectAssertion(function() {
var registry = new Registry();
var container = registry.container();
var AnObject = Object.extend({
container: container,
foo: inject.controller('bar')
});
registry.register('foo:main', AnObject);
container.lookupFactory('foo:main');
}, /Defining an injected controller property on a non-controller is not allowed./);
test("controllers can be injected into controllers", function() {
var registry = new Registry();
var container = registry.container();
registry.register('controller:post', Controller.extend({
postsController: inject.controller('posts')
}));
registry.register('controller:posts', Controller.extend());
var postController = container.lookup('controller:post');
var postsController = container.lookup('controller:posts');
equal(postsController, postController.get('postsController'), "controller.posts is injected");
});
QUnit.test('services can be injected into components', function() {
var registry = new Registry();
var container = registry.container();
registry.register('component:application', Component.extend({
profilerService: inject.service('profiler')
}));
registry.register('service:profiler', Service.extend());
var appComponent = container.lookup('component:application');
var profilerService = container.lookup('service:profiler');
equal(profilerService, appComponent.get('profilerService'), 'service.profiler is injected');
});
test("services can be injected into controllers", function() {
var registry = new Registry();
var container = registry.container();
registry.register('controller:application', Controller.extend({
authService: inject.service('auth')
}));
registry.register('service:auth', Service.extend());
var appController = container.lookup('controller:application');
var authService = container.lookup('service:auth');
equal(authService, appController.get('authService'), "service.auth is injected");
});
QUnit.test("services can be injected into views", function() {
var registry = new Registry();
var container = registry.container();
registry.register('view:application', View.extend({
profilerService: inject.service('profiler')
}));
registry.register('service:profiler', Service.extend());
var appView = container.lookup('view:application');
var profilerService = container.lookup('service:profiler');
equal(profilerService, appView.get('profilerService'), "service.profiler is injected");
});
test("If a controller specifies a dependency, it is accessible", function() {
var registry = new Registry();
var container = registry.container();
registry.register('controller:post', Controller.extend({
needs: 'posts'
}));
registry.register('controller:posts', Controller.extend());
var postController = container.lookup('controller:post');
var postsController = container.lookup('controller:posts');
equal(postsController, postController.get('controllers.posts'), "controller.posts must be auto synthesized");
});
QUnit.test('collection helper should try to use container to resolve view', function() {
var registry = new Registry();
var container = registry.container();
var ACollectionView = CollectionView.extend({
tagName: 'ul',
content: A(['foo', 'bar', 'baz'])
});
registry.register('view:collectionTest', ACollectionView);
view = EmberView.create({
container: container,
template: compile('{{#collection "collectionTest"}} <label></label> {{/collection}}')
});
runAppend(view);
equal(view.$('label').length, 3, 'one label element is created for each content item');
});
test("If a controller specifies an unavailable dependency, it raises", function() {
var registry = new Registry();
var container = registry.container();
registry.register('controller:post', Controller.extend({
needs: ['comments']
}));
throws(function() {
container.lookup('controller:post');
}, /controller:comments/);
registry.register('controller:blog', Controller.extend({
needs: ['posts', 'comments']
}));
throws(function() {
container.lookup('controller:blog');
}, /controller:posts, controller:comments/);
});
test("Mixin sets up controllers if there is needs before calling super", function() {
var registry = new Registry();
var container = registry.container();
registry.register('controller:other', ArrayController.extend({
needs: 'posts',
model: computed.alias('controllers.posts')
}));
registry.register('controller:another', ArrayController.extend({
needs: 'posts',
modelBinding: 'controllers.posts'
}));
registry.register('controller:posts', ArrayController.extend());
container.lookup('controller:posts').set('model', A(['a','b','c']));
deepEqual(['a','b','c'], container.lookup('controller:other').toArray());
deepEqual(['a','b','c'], container.lookup('controller:another').toArray());
});
test ("setting the value of a controller dependency should not be possible", function(){
var registry = new Registry();
var container = registry.container();
registry.register('controller:post', Controller.extend({
needs: 'posts'
}));
registry.register('controller:posts', Controller.extend());
var postController = container.lookup('controller:post');
container.lookup('controller:posts');
throws(function(){
postController.set('controllers.posts', 'epic-self-troll');
},
/You cannot overwrite the value of `controllers.posts` of .+/,
'should raise when attempting to set the value of a controller dependency property');
postController.set('controllers.posts.title', "A Troll's Life");
equal(postController.get('controllers.posts.title'), "A Troll's Life", "can set the value of controllers.posts.title");
});
QUnit.skip("should target the with-controller inside an {{each}} in a {{#with controller='person'}} [DEPRECATED]", function() {
expectDeprecation(eachDeprecation);
expectDeprecation('Using the context switching form of `{{with}}` is deprecated. Please use the keyword form (`{{with foo as bar}}`) instead.');
var eventsCalled = [];
var PeopleController = EmberArrayController.extend({
actions: {
robert() { eventsCalled.push('robert'); },
brian() { eventsCalled.push('brian'); }
}
});
var registry = new Registry();
var container = registry.container();
var parentController = EmberObject.create({
container: container,
people: Ember.A([
{ name: 'robert' },
{ name: 'brian' }
])
});
view = EmberView.create({
container: container,
template: compile('{{#with people controller="people"}}{{#each}}<a href="#" {{action name}}>{{name}}</a>{{/each}}{{/with}}'),
controller: parentController
});
registry.register('controller:people', PeopleController);
runAppend(view);
view.$('a').trigger('click');
deepEqual(eventsCalled, ['robert', 'brian'], 'the events are fired properly');
});
test("raises if trying to get a controller that was not pre-defined in `needs`", function() {
var registry = new Registry();
var container = registry.container();
registry.register('controller:foo', Controller.extend());
registry.register('controller:bar', Controller.extend({
needs: 'foo'
}));
var fooController = container.lookup('controller:foo');
var barController = container.lookup('controller:bar');
throws(function(){
fooController.get('controllers.bar');
}, /#needs does not include `bar`/,
'throws if controllers is accesed but needs not defined');
equal(barController.get('controllers.foo'), fooController, 'correctly needed controllers should continue to work');
throws(function(){
barController.get('controllers.baz');
}, /#needs does not include `baz`/,
'should throw if no such controller was needed');
});