aboutsummaryrefslogtreecommitdiffstats
path: root/test/directivesSpec.js
diff options
context:
space:
mode:
authorMisko Hevery2011-10-25 22:21:21 -0700
committerMisko Hevery2011-11-14 16:39:32 -0800
commitd12df0d360fe0dabdca3591654327834bee2803b (patch)
tree605694ecc056869e9dd20283d8256c92655a44d4 /test/directivesSpec.js
parentd9b58f23f6b3fe5635c3ec5259e6a0002cff78b7 (diff)
downloadangular.js-d12df0d360fe0dabdca3591654327834bee2803b.tar.bz2
refactor(compiler) turn compiler into a service
BREAK - remove angular.compile() since the compile method is now a service and needs to be injected
Diffstat (limited to 'test/directivesSpec.js')
-rw-r--r--test/directivesSpec.js168
1 files changed, 84 insertions, 84 deletions
diff --git a/test/directivesSpec.js b/test/directivesSpec.js
index eb74d227..96d0993b 100644
--- a/test/directivesSpec.js
+++ b/test/directivesSpec.js
@@ -2,14 +2,14 @@
describe("directive", function() {
- it("should ng:init", inject(function($rootScope) {
- var element = angular.compile('<div ng:init="a=123"></div>')($rootScope);
+ it("should ng:init", inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:init="a=123"></div>')($rootScope);
expect($rootScope.a).toEqual(123);
}));
describe('ng:bind', function() {
- it('should set text', inject(function($rootScope) {
- var element = angular.compile('<div ng:bind="a"></div>')($rootScope);
+ it('should set text', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:bind="a"></div>')($rootScope);
expect(element.text()).toEqual('');
$rootScope.a = 'misko';
$rootScope.$digest();
@@ -17,8 +17,8 @@ describe("directive", function() {
expect(element.text()).toEqual('misko');
}));
- it('should set text to blank if undefined', inject(function($rootScope) {
- var element = angular.compile('<div ng:bind="a"></div>')($rootScope);
+ it('should set text to blank if undefined', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:bind="a"></div>')($rootScope);
$rootScope.a = 'misko';
$rootScope.$digest();
expect(element.text()).toEqual('misko');
@@ -27,76 +27,76 @@ describe("directive", function() {
expect(element.text()).toEqual('');
}));
- it('should set html', inject(function($rootScope) {
- var element = angular.compile('<div ng:bind="html|html"></div>')($rootScope);
+ it('should set html', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:bind="html|html"></div>')($rootScope);
$rootScope.html = '<div unknown>hello</div>';
$rootScope.$digest();
expect(lowercase(element.html())).toEqual('<div>hello</div>');
}));
- it('should set unsafe html', inject(function($rootScope) {
- var element = angular.compile('<div ng:bind="html|html:\'unsafe\'"></div>')($rootScope);
+ it('should set unsafe html', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:bind="html|html:\'unsafe\'"></div>')($rootScope);
$rootScope.html = '<div onclick="">hello</div>';
$rootScope.$digest();
expect(lowercase(element.html())).toEqual('<div onclick="">hello</div>');
}));
- it('should set element element', inject(function($rootScope) {
+ it('should set element element', inject(function($rootScope, $compile) {
angularFilter.myElement = function() {
return jqLite('<a>hello</a>');
};
- var element = angular.compile('<div ng:bind="0|myElement"></div>')($rootScope);
+ var element = $compile('<div ng:bind="0|myElement"></div>')($rootScope);
$rootScope.$digest();
expect(lowercase(element.html())).toEqual('<a>hello</a>');
}));
- it('should have $element set to current bind element', inject(function($rootScope) {
+ it('should have $element set to current bind element', inject(function($rootScope, $compile) {
angularFilter.myFilter = function() {
this.$element.addClass("filter");
return 'HELLO';
};
- var element = angular.compile('<div>before<div ng:bind="0|myFilter"></div>after</div>')($rootScope);
+ var element = $compile('<div>before<div ng:bind="0|myFilter"></div>after</div>')($rootScope);
$rootScope.$digest();
expect(sortedHtml(element)).toEqual('<div>before<div class="filter" ng:bind="0|myFilter">HELLO</div>after</div>');
}));
- it('should suppress rendering of falsy values', inject(function($rootScope) {
- var element = angular.compile('<div>{{ null }}{{ undefined }}{{ "" }}-{{ 0 }}{{ false }}</div>')($rootScope);
+ it('should suppress rendering of falsy values', inject(function($rootScope, $compile) {
+ var element = $compile('<div>{{ null }}{{ undefined }}{{ "" }}-{{ 0 }}{{ false }}</div>')($rootScope);
$rootScope.$digest();
expect(element.text()).toEqual('-0false');
}));
- it('should render object as JSON ignore $$', inject(function($rootScope) {
- var element = angular.compile('<div>{{ {key:"value", $$key:"hide"} }}</div>')($rootScope);
+ it('should render object as JSON ignore $$', inject(function($rootScope, $compile) {
+ var element = $compile('<div>{{ {key:"value", $$key:"hide"} }}</div>')($rootScope);
$rootScope.$digest();
expect(fromJson(element.text())).toEqual({key:'value'});
}));
});
describe('ng:bind-template', function() {
- it('should ng:bind-template', inject(function($rootScope) {
- var element = angular.compile('<div ng:bind-template="Hello {{name}}!"></div>')($rootScope);
+ it('should ng:bind-template', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:bind-template="Hello {{name}}!"></div>')($rootScope);
$rootScope.name = 'Misko';
$rootScope.$digest();
expect(element.hasClass('ng-binding')).toEqual(true);
expect(element.text()).toEqual('Hello Misko!');
}));
- it('should have $element set to current bind element', inject(function($rootScope) {
+ it('should have $element set to current bind element', inject(function($rootScope, $compile) {
var innerText;
angularFilter.myFilter = function(text) {
innerText = innerText || this.$element.text();
return text;
};
- var element = angular.compile('<div>before<span ng:bind-template="{{\'HELLO\'|myFilter}}">INNER</span>after</div>')($rootScope);
+ var element = $compile('<div>before<span ng:bind-template="{{\'HELLO\'|myFilter}}">INNER</span>after</div>')($rootScope);
$rootScope.$digest();
expect(element.text()).toEqual("beforeHELLOafter");
expect(innerText).toEqual('INNER');
}));
- it('should render object as JSON ignore $$', inject(function($rootScope) {
- var element = angular.compile('<pre>{{ {key:"value", $$key:"hide"} }}</pre>')($rootScope);
+ it('should render object as JSON ignore $$', inject(function($rootScope, $compile) {
+ var element = $compile('<pre>{{ {key:"value", $$key:"hide"} }}</pre>')($rootScope);
$rootScope.$digest();
expect(fromJson(element.text())).toEqual({key:'value'});
}));
@@ -104,22 +104,22 @@ describe("directive", function() {
});
describe('ng:bind-attr', function() {
- it('should bind attributes', inject(function($rootScope) {
- var element = angular.compile('<div ng:bind-attr="{src:\'http://localhost/mysrc\', alt:\'myalt\'}"/>')($rootScope);
+ it('should bind attributes', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:bind-attr="{src:\'http://localhost/mysrc\', alt:\'myalt\'}"/>')($rootScope);
$rootScope.$digest();
expect(element.attr('src')).toEqual('http://localhost/mysrc');
expect(element.attr('alt')).toEqual('myalt');
}));
- it('should not pretty print JSON in attributes', inject(function($rootScope) {
- var element = angular.compile('<img alt="{{ {a:1} }}"/>')($rootScope);
+ it('should not pretty print JSON in attributes', inject(function($rootScope, $compile) {
+ var element = $compile('<img alt="{{ {a:1} }}"/>')($rootScope);
$rootScope.$digest();
expect(element.attr('alt')).toEqual('{"a":1}');
}));
});
- it('should remove special attributes on false', inject(function($rootScope) {
- var element = angular.compile('<input ng:bind-attr="{disabled:\'{{disabled}}\', readonly:\'{{readonly}}\', checked:\'{{checked}}\'}"/>')($rootScope);
+ it('should remove special attributes on false', inject(function($rootScope, $compile) {
+ var element = $compile('<input ng:bind-attr="{disabled:\'{{disabled}}\', readonly:\'{{readonly}}\', checked:\'{{checked}}\'}"/>')($rootScope);
var input = element[0];
expect(input.disabled).toEqual(false);
expect(input.readOnly).toEqual(false);
@@ -136,8 +136,8 @@ describe("directive", function() {
}));
describe('ng:click', function() {
- it('should get called on a click', inject(function($rootScope) {
- var element = angular.compile('<div ng:click="clicked = true"></div>')($rootScope);
+ it('should get called on a click', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:click="clicked = true"></div>')($rootScope);
$rootScope.$digest();
expect($rootScope.clicked).toBeFalsy();
@@ -145,8 +145,8 @@ describe("directive", function() {
expect($rootScope.clicked).toEqual(true);
}));
- it('should stop event propagation', inject(function($rootScope) {
- var element = angular.compile('<div ng:click="outer = true"><div ng:click="inner = true"></div></div>')($rootScope);
+ it('should stop event propagation', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:click="outer = true"><div ng:click="inner = true"></div></div>')($rootScope);
$rootScope.$digest();
expect($rootScope.outer).not.toBeDefined();
expect($rootScope.inner).not.toBeDefined();
@@ -161,8 +161,8 @@ describe("directive", function() {
describe('ng:submit', function() {
- it('should get called on form submit', inject(function($rootScope) {
- var element = angular.compile('<form action="" ng:submit="submitted = true">' +
+ it('should get called on form submit', inject(function($rootScope, $compile) {
+ var element = $compile('<form action="" ng:submit="submitted = true">' +
'<input type="submit"/>' +
'</form>')($rootScope);
$rootScope.$digest();
@@ -174,8 +174,8 @@ describe("directive", function() {
});
describe('ng:class', function() {
- it('should add new and remove old classes dynamically', inject(function($rootScope) {
- var element = angular.compile('<div class="existing" ng:class="dynClass"></div>')($rootScope);
+ it('should add new and remove old classes dynamically', inject(function($rootScope, $compile) {
+ var element = $compile('<div class="existing" ng:class="dynClass"></div>')($rootScope);
$rootScope.dynClass = 'A';
$rootScope.$digest();
expect(element.hasClass('existing')).toBe(true);
@@ -195,8 +195,8 @@ describe("directive", function() {
}));
- it('should support adding multiple classes via an array', inject(function($rootScope) {
- var element = angular.compile('<div class="existing" ng:class="[\'A\', \'B\']"></div>')($rootScope);
+ it('should support adding multiple classes via an array', inject(function($rootScope, $compile) {
+ var element = $compile('<div class="existing" ng:class="[\'A\', \'B\']"></div>')($rootScope);
$rootScope.$digest();
expect(element.hasClass('existing')).toBeTruthy();
expect(element.hasClass('A')).toBeTruthy();
@@ -204,8 +204,8 @@ describe("directive", function() {
}));
- it('should support adding multiple classes via a space delimited string', inject(function($rootScope) {
- var element = angular.compile('<div class="existing" ng:class="\'A B\'"></div>')($rootScope);
+ it('should support adding multiple classes via a space delimited string', inject(function($rootScope, $compile) {
+ var element = $compile('<div class="existing" ng:class="\'A B\'"></div>')($rootScope);
$rootScope.$digest();
expect(element.hasClass('existing')).toBeTruthy();
expect(element.hasClass('A')).toBeTruthy();
@@ -213,8 +213,8 @@ describe("directive", function() {
}));
- it('should preserve class added post compilation with pre-existing classes', inject(function($rootScope) {
- var element = angular.compile('<div class="existing" ng:class="dynClass"></div>')($rootScope);
+ it('should preserve class added post compilation with pre-existing classes', inject(function($rootScope, $compile) {
+ var element = $compile('<div class="existing" ng:class="dynClass"></div>')($rootScope);
$rootScope.dynClass = 'A';
$rootScope.$digest();
expect(element.hasClass('existing')).toBe(true);
@@ -230,8 +230,8 @@ describe("directive", function() {
}));
- it('should preserve class added post compilation without pre-existing classes"', inject(function($rootScope) {
- var element = angular.compile('<div ng:class="dynClass"></div>')($rootScope);
+ it('should preserve class added post compilation without pre-existing classes"', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:class="dynClass"></div>')($rootScope);
$rootScope.dynClass = 'A';
$rootScope.$digest();
expect(element.hasClass('A')).toBe(true);
@@ -246,8 +246,8 @@ describe("directive", function() {
}));
- it('should preserve other classes with similar name"', inject(function($rootScope) {
- var element = angular.compile('<div class="ui-panel ui-selected" ng:class="dynCls"></div>')($rootScope);
+ it('should preserve other classes with similar name"', inject(function($rootScope, $compile) {
+ var element = $compile('<div class="ui-panel ui-selected" ng:class="dynCls"></div>')($rootScope);
$rootScope.dynCls = 'panel';
$rootScope.$digest();
$rootScope.dynCls = 'foo';
@@ -256,16 +256,16 @@ describe("directive", function() {
}));
- it('should not add duplicate classes', inject(function($rootScope) {
- var element = angular.compile('<div class="panel bar" ng:class="dynCls"></div>')($rootScope);
+ it('should not add duplicate classes', inject(function($rootScope, $compile) {
+ var element = $compile('<div class="panel bar" ng:class="dynCls"></div>')($rootScope);
$rootScope.dynCls = 'panel';
$rootScope.$digest();
expect(element[0].className).toBe('panel bar ng-directive');
}));
- it('should remove classes even if it was specified via class attribute', inject(function($rootScope) {
- var element = angular.compile('<div class="panel bar" ng:class="dynCls"></div>')($rootScope);
+ it('should remove classes even if it was specified via class attribute', inject(function($rootScope, $compile) {
+ var element = $compile('<div class="panel bar" ng:class="dynCls"></div>')($rootScope);
$rootScope.dynCls = 'panel';
$rootScope.$digest();
$rootScope.dynCls = 'window';
@@ -274,8 +274,8 @@ describe("directive", function() {
}));
- it('should remove classes even if they were added by another code', inject(function($rootScope) {
- var element = angular.compile('<div ng:class="dynCls"></div>')($rootScope);
+ it('should remove classes even if they were added by another code', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:class="dynCls"></div>')($rootScope);
$rootScope.dynCls = 'foo';
$rootScope.$digest();
element.addClass('foo');
@@ -285,8 +285,8 @@ describe("directive", function() {
}));
- it('should convert undefined and null values to an empty string', inject(function($rootScope) {
- var element = angular.compile('<div ng:class="dynCls"></div>')($rootScope);
+ it('should convert undefined and null values to an empty string', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:class="dynCls"></div>')($rootScope);
$rootScope.dynCls = [undefined, null];
$rootScope.$digest();
expect(element[0].className).toBe('ng-directive');
@@ -294,8 +294,8 @@ describe("directive", function() {
});
- it('should ng:class odd/even', inject(function($rootScope) {
- var element = angular.compile('<ul><li ng:repeat="i in [0,1]" class="existing" ng:class-odd="\'odd\'" ng:class-even="\'even\'"></li><ul>')($rootScope);
+ it('should ng:class odd/even', inject(function($rootScope, $compile) {
+ var element = $compile('<ul><li ng:repeat="i in [0,1]" class="existing" ng:class-odd="\'odd\'" ng:class-even="\'even\'"></li><ul>')($rootScope);
$rootScope.$digest();
var e1 = jqLite(element[0].childNodes[1]);
var e2 = jqLite(element[0].childNodes[2]);
@@ -306,8 +306,8 @@ describe("directive", function() {
}));
- it('should allow both ng:class and ng:class-odd/even on the same element', inject(function($rootScope) {
- var element = angular.compile('<ul>' +
+ it('should allow both ng:class and ng:class-odd/even on the same element', inject(function($rootScope, $compile) {
+ var element = $compile('<ul>' +
'<li ng:repeat="i in [0,1]" ng:class="\'plainClass\'" ' +
'ng:class-odd="\'odd\'" ng:class-even="\'even\'"></li>' +
'<ul>')($rootScope);
@@ -324,8 +324,8 @@ describe("directive", function() {
}));
- it('should allow both ng:class and ng:class-odd/even with multiple classes', inject(function($rootScope) {
- var element = angular.compile('<ul>' +
+ it('should allow both ng:class and ng:class-odd/even with multiple classes', inject(function($rootScope, $compile) {
+ var element = $compile('<ul>' +
'<li ng:repeat="i in [0,1]" ng:class="[\'A\', \'B\']" ' +
'ng:class-odd="[\'C\', \'D\']" ng:class-even="[\'E\', \'F\']"></li>' +
'<ul>')($rootScope);
@@ -351,15 +351,15 @@ describe("directive", function() {
describe('ng:style', function() {
- it('should set', inject(function($rootScope) {
- var element = angular.compile('<div ng:style="{height: \'40px\'}"></div>')($rootScope);
+ it('should set', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:style="{height: \'40px\'}"></div>')($rootScope);
$rootScope.$digest();
expect(element.css('height')).toEqual('40px');
}));
- it('should silently ignore undefined style', inject(function($rootScope) {
- var element = angular.compile('<div ng:style="myStyle"></div>')($rootScope);
+ it('should silently ignore undefined style', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:style="myStyle"></div>')($rootScope);
$rootScope.$digest();
expect(element.hasClass('ng-exception')).toBeFalsy();
}));
@@ -368,7 +368,7 @@ describe("directive", function() {
describe('preserving styles set before and after compilation', function() {
var scope, preCompStyle, preCompVal, postCompStyle, postCompVal, element;
- beforeEach(inject(function($rootScope) {
+ beforeEach(inject(function($rootScope, $compile) {
preCompStyle = 'width';
preCompVal = '300px';
postCompStyle = 'height';
@@ -376,7 +376,7 @@ describe("directive", function() {
element = jqLite('<div ng:style="styleObj"></div>');
element.css(preCompStyle, preCompVal);
jqLite(document.body).append(element);
- angular.compile(element)($rootScope);
+ $compile(element)($rootScope);
scope = $rootScope;
scope.styleObj = {'margin-top': '44px'};
scope.$apply();
@@ -431,9 +431,9 @@ describe("directive", function() {
describe('ng:show', function() {
- it('should show and hide an element', inject(function($rootScope) {
+ it('should show and hide an element', inject(function($rootScope, $compile) {
var element = jqLite('<div ng:show="exp"></div>');
- var element = angular.compile(element)($rootScope);
+ var element = $compile(element)($rootScope);
$rootScope.$digest();
expect(isCssVisible(element)).toEqual(false);
$rootScope.exp = true;
@@ -442,9 +442,9 @@ describe("directive", function() {
}));
- it('should make hidden element visible', inject(function($rootScope) {
+ it('should make hidden element visible', inject(function($rootScope, $compile) {
var element = jqLite('<div style="display: none" ng:show="exp"></div>');
- var element = angular.compile(element)($rootScope);
+ var element = $compile(element)($rootScope);
expect(isCssVisible(element)).toBe(false);
$rootScope.exp = true;
$rootScope.$digest();
@@ -453,9 +453,9 @@ describe("directive", function() {
});
describe('ng:hide', function() {
- it('should hide an element', inject(function($rootScope) {
+ it('should hide an element', inject(function($rootScope, $compile) {
var element = jqLite('<div ng:hide="exp"></div>');
- var element = angular.compile(element)($rootScope);
+ var element = $compile(element)($rootScope);
expect(isCssVisible(element)).toBe(true);
$rootScope.exp = true;
$rootScope.$digest();
@@ -485,13 +485,13 @@ describe("directive", function() {
window.temp = undefined;
});
- it('should bind', inject(function($rootScope) {
- var element = angular.compile('<div ng:controller="temp.Greeter"></div>')($rootScope);
+ it('should bind', inject(function($rootScope, $compile) {
+ var element = $compile('<div ng:controller="temp.Greeter"></div>')($rootScope);
expect($rootScope.greeter.greeting).toEqual('hello');
expect($rootScope.greeter.greet('misko')).toEqual('hello misko!');
}));
- it('should support nested controllers', inject(function($rootScope) {
+ it('should support nested controllers', inject(function($rootScope, $compile) {
temp.ChildGreeter = function() {
this.greeting = 'hey';
this.$root.childGreeter = this;
@@ -501,7 +501,7 @@ describe("directive", function() {
return this.greeting + ' dude' + this.suffix;
}
};
- var element = angular.compile('<div ng:controller="temp.Greeter"><div ng:controller="temp.ChildGreeter">{{greet("misko")}}</div></div>')($rootScope);
+ var element = $compile('<div ng:controller="temp.Greeter"><div ng:controller="temp.ChildGreeter">{{greet("misko")}}</div></div>')($rootScope);
expect($rootScope.greeting).not.toBeDefined();
expect($rootScope.greeter.greeting).toEqual('hello');
expect($rootScope.greeter.greet('misko')).toEqual('hello misko!');
@@ -512,33 +512,33 @@ describe("directive", function() {
expect(element.text()).toEqual('hey dude!');
}));
- it('should infer injection arguments', inject(function($rootScope) {
+ it('should infer injection arguments', inject(function($rootScope, $compile) {
temp.MyController = function($xhr){
this.$root.someService = $xhr;
};
- var element = angular.compile('<div ng:controller="temp.MyController"></div>')($rootScope);
+ var element = $compile('<div ng:controller="temp.MyController"></div>')($rootScope);
expect($rootScope.someService).toBe($rootScope.$service('$xhr'));
}));
});
describe('ng:cloak', function() {
- it('should get removed when an element is compiled', inject(function($rootScope) {
+ it('should get removed when an element is compiled', inject(function($rootScope, $compile) {
var element = jqLite('<div ng:cloak></div>');
expect(element.attr('ng:cloak')).toBe('');
- angular.compile(element);
+ $compile(element);
expect(element.attr('ng:cloak')).toBeUndefined();
}));
- it('should remove ng-cloak class from a compiled element', inject(function($rootScope) {
+ it('should remove ng-cloak class from a compiled element', inject(function($rootScope, $compile) {
var element = jqLite('<div ng:cloak class="foo ng-cloak bar"></div>');
expect(element.hasClass('foo')).toBe(true);
expect(element.hasClass('ng-cloak')).toBe(true);
expect(element.hasClass('bar')).toBe(true);
- angular.compile(element);
+ $compile(element);
expect(element.hasClass('foo')).toBe(true);
expect(element.hasClass('ng-cloak')).toBe(false);