+
//demo.label//
@@ -199,6 +199,11 @@ function $InterpolateProvider() {
*
*
*
+ * @knownIssue
+ * It is currently not possible for an interpolated expression to contain the interpolation end
+ * symbol. For example, `{{ '}}' }}` will be incorrectly interpreted as `{{ ' }}` + `' }}`, i.e.
+ * an interpolated expression consisting of a single-quote (`'`) and the `' }}` string.
+ *
* @param {string} text The text with markup to interpolate.
* @param {boolean=} mustHaveExpression if set to true then the interpolation string must have
* embedded expression in order to return an interpolation function. Strings with no
diff --git a/src/ng/location.js b/src/ng/location.js
index a904b100b7c6..4e804b30852e 100644
--- a/src/ng/location.js
+++ b/src/ng/location.js
@@ -482,7 +482,7 @@ var locationPrototype = {
* ```
*
* @param {(string|number)=} path New path
- * @return {string} path
+ * @return {(string|object)} path if called with no parameters, or `$location` if called with a parameter
*/
path: locationGetterSetter('$$path', function(path) {
path = path !== null ? path.toString() : '';
@@ -574,9 +574,9 @@ var locationPrototype = {
* @description
* This method is getter / setter.
*
- * Return hash fragment when called without any parameter.
+ * Returns the hash fragment when called without any parameters.
*
- * Change hash fragment when called with parameter and return `$location`.
+ * Changes the hash fragment when called with a parameter and returns `$location`.
*
*
* ```js
@@ -597,8 +597,8 @@ var locationPrototype = {
* @name $location#replace
*
* @description
- * If called, all changes to $location during current `$digest` will be replacing current history
- * record, instead of adding new one.
+ * If called, all changes to $location during the current `$digest` will replace the current history
+ * record, instead of adding a new one.
*/
replace: function() {
this.$$replace = true;
@@ -918,7 +918,7 @@ function $LocationProvider() {
var oldUrl = $location.absUrl();
var oldState = $location.$$state;
var defaultPrevented;
-
+ newUrl = trimEmptyHash(newUrl);
$location.$$parse(newUrl);
$location.$$state = newState;
diff --git a/src/ng/parse.js b/src/ng/parse.js
index 529d701b44a3..3f933061999c 100644
--- a/src/ng/parse.js
+++ b/src/ng/parse.js
@@ -38,20 +38,30 @@ var $parseMinErr = minErr('$parse');
function ensureSafeMemberName(name, fullExpression) {
+ if (name === "__defineGetter__" || name === "__defineSetter__"
+ || name === "__lookupGetter__" || name === "__lookupSetter__"
+ || name === "__proto__") {
+ throw $parseMinErr('isecfld',
+ 'Attempting to access a disallowed field in Angular expressions! '
+ + 'Expression: {0}', fullExpression);
+ }
+ return name;
+}
+
+function getStringValue(name, fullExpression) {
// From the JavaScript docs:
// Property names must be strings. This means that non-string objects cannot be used
// as keys in an object. Any non-string object, including a number, is typecasted
// into a string via the toString method.
//
// So, to ensure that we are checking the same `name` that JavaScript would use,
- // we cast it to a string, if possible
- name = (isObject(name) && name.toString) ? name.toString() : name;
-
- if (name === "__defineGetter__" || name === "__defineSetter__"
- || name === "__lookupGetter__" || name === "__lookupSetter__"
- || name === "__proto__") {
- throw $parseMinErr('isecfld',
- 'Attempting to access a disallowed field in Angular expressions! '
+ // we cast it to a string, if possible.
+ // Doing `name + ''` can cause a repl error if the result to `toString` is not a string,
+ // this is, this will handle objects that misbehave.
+ name = name + '';
+ if (!isString(name)) {
+ throw $parseMinErr('iseccst',
+ 'Cannot convert object to primitive value! '
+ 'Expression: {0}', fullExpression);
}
return name;
@@ -102,6 +112,16 @@ function ensureSafeFunction(obj, fullExpression) {
}
}
+function ensureSafeAssignContext(obj, fullExpression) {
+ if (obj) {
+ if (obj === (0).constructor || obj === (false).constructor || obj === ''.constructor ||
+ obj === {}.constructor || obj === [].constructor || obj === Function.constructor) {
+ throw $parseMinErr('isecaf',
+ 'Assigning to a constructor is disallowed! Expression: {0}', fullExpression);
+ }
+ }
+}
+
var OPERATORS = createMap();
forEach('+ - * / % === !== == != < > <= >= && || ! = |'.split(' '), function(operator) { OPERATORS[operator] = true; });
var ESCAPE = {"n":"\n", "f":"\f", "r":"\r", "t":"\t", "v":"\v", "'":"'", '"':'"'};
@@ -816,6 +836,8 @@ ASTCompiler.prototype = {
'ensureSafeMemberName',
'ensureSafeObject',
'ensureSafeFunction',
+ 'getStringValue',
+ 'ensureSafeAssignContext',
'ifDefined',
'plus',
'text',
@@ -824,6 +846,8 @@ ASTCompiler.prototype = {
ensureSafeMemberName,
ensureSafeObject,
ensureSafeFunction,
+ getStringValue,
+ ensureSafeAssignContext,
ifDefined,
plusFn,
expression);
@@ -964,9 +988,13 @@ ASTCompiler.prototype = {
intoId = intoId || this.nextId();
self.recurse(ast.object, left, undefined, function() {
self.if_(self.notNull(left), function() {
+ if (create && create !== 1) {
+ self.addEnsureSafeAssignContext(left);
+ }
if (ast.computed) {
right = self.nextId();
self.recurse(ast.property, right);
+ self.getStringValue(right);
self.addEnsureSafeMemberName(right);
if (create && create !== 1) {
self.if_(self.not(self.computedMember(left, right)), self.lazyAssign(self.computedMember(left, right), '{}'));
@@ -1044,12 +1072,13 @@ ASTCompiler.prototype = {
right = this.nextId();
left = {};
if (!isAssignable(ast.left)) {
- throw $parseMinErr('lval', 'Trying to assing a value to a non l-value');
+ throw $parseMinErr('lval', 'Trying to assign a value to a non l-value');
}
this.recurse(ast.left, undefined, left, function() {
self.if_(self.notNull(left.context), function() {
self.recurse(ast.right, right);
self.addEnsureSafeObject(self.member(left.context, left.name, left.computed));
+ self.addEnsureSafeAssignContext(left.context);
expression = self.member(left.context, left.name, left.computed) + ast.operator + right;
self.assign(intoId, expression);
recursionFn(intoId || expression);
@@ -1175,6 +1204,10 @@ ASTCompiler.prototype = {
this.current().body.push(this.ensureSafeFunction(item), ';');
},
+ addEnsureSafeAssignContext: function(item) {
+ this.current().body.push(this.ensureSafeAssignContext(item), ';');
+ },
+
ensureSafeObject: function(item) {
return 'ensureSafeObject(' + item + ',text)';
},
@@ -1187,6 +1220,14 @@ ASTCompiler.prototype = {
return 'ensureSafeFunction(' + item + ',text)';
},
+ getStringValue: function(item) {
+ this.assign(item, 'getStringValue(' + item + ',text)');
+ },
+
+ ensureSafeAssignContext: function(item) {
+ return 'ensureSafeAssignContext(' + item + ',text)';
+ },
+
lazyRecurse: function(ast, intoId, nameId, recursionFn, create, skipWatchIdCheck) {
var self = this;
return function() {
@@ -1364,6 +1405,7 @@ ASTInterpreter.prototype = {
var lhs = left(scope, locals, assign, inputs);
var rhs = right(scope, locals, assign, inputs);
ensureSafeObject(lhs.value, self.expression);
+ ensureSafeAssignContext(lhs.context);
lhs.context[lhs.name] = rhs;
return context ? {value: rhs} : rhs;
};
@@ -1561,9 +1603,13 @@ ASTInterpreter.prototype = {
var value;
if (lhs != null) {
rhs = right(scope, locals, assign, inputs);
+ rhs = getStringValue(rhs);
ensureSafeMemberName(rhs, expression);
- if (create && create !== 1 && lhs && !(lhs[rhs])) {
- lhs[rhs] = {};
+ if (create && create !== 1) {
+ ensureSafeAssignContext(lhs);
+ if (lhs && !(lhs[rhs])) {
+ lhs[rhs] = {};
+ }
}
value = lhs[rhs];
ensureSafeObject(value, expression);
@@ -1578,8 +1624,11 @@ ASTInterpreter.prototype = {
nonComputedMember: function(left, right, expensiveChecks, context, create, expression) {
return function(scope, locals, assign, inputs) {
var lhs = left(scope, locals, assign, inputs);
- if (create && create !== 1 && lhs && !(lhs[right])) {
- lhs[right] = {};
+ if (create && create !== 1) {
+ ensureSafeAssignContext(lhs);
+ if (lhs && !(lhs[right])) {
+ lhs[right] = {};
+ }
}
var value = lhs != null ? lhs[right] : undefined;
if (expensiveChecks || isPossiblyDangerousMemberName(right)) {
@@ -1620,9 +1669,6 @@ Parser.prototype = {
}
};
-var getterFnCacheDefault = createMap();
-var getterFnCacheExpensive = createMap();
-
function isPossiblyDangerousMemberName(name) {
return name == 'constructor';
}
@@ -1698,10 +1744,19 @@ function $ParseProvider() {
csp: noUnsafeEval,
expensiveChecks: true
};
+ var runningChecksEnabled = false;
+
+ $parse.$$runningExpensiveChecks = function() {
+ return runningChecksEnabled;
+ };
+
+ return $parse;
- return function $parse(exp, interceptorFn, expensiveChecks) {
+ function $parse(exp, interceptorFn, expensiveChecks) {
var parsedExpression, oneTime, cacheKey;
+ expensiveChecks = expensiveChecks || runningChecksEnabled;
+
switch (typeof exp) {
case 'string':
exp = exp.trim();
@@ -1727,6 +1782,9 @@ function $ParseProvider() {
} else if (parsedExpression.inputs) {
parsedExpression.$$watchDelegate = inputsWatchDelegate;
}
+ if (expensiveChecks) {
+ parsedExpression = expensiveChecksInterceptor(parsedExpression);
+ }
cache[cacheKey] = parsedExpression;
}
return addInterceptor(parsedExpression, interceptorFn);
@@ -1735,9 +1793,33 @@ function $ParseProvider() {
return addInterceptor(exp, interceptorFn);
default:
- return noop;
+ return addInterceptor(noop, interceptorFn);
}
- };
+ }
+
+ function expensiveChecksInterceptor(fn) {
+ if (!fn) return fn;
+ expensiveCheckFn.$$watchDelegate = fn.$$watchDelegate;
+ expensiveCheckFn.assign = expensiveChecksInterceptor(fn.assign);
+ expensiveCheckFn.constant = fn.constant;
+ expensiveCheckFn.literal = fn.literal;
+ for (var i = 0; fn.inputs && i < fn.inputs.length; ++i) {
+ fn.inputs[i] = expensiveChecksInterceptor(fn.inputs[i]);
+ }
+ expensiveCheckFn.inputs = fn.inputs;
+
+ return expensiveCheckFn;
+
+ function expensiveCheckFn(scope, locals, assign, inputs) {
+ var expensiveCheckOldValue = runningChecksEnabled;
+ runningChecksEnabled = true;
+ try {
+ return fn(scope, locals, assign, inputs);
+ } finally {
+ runningChecksEnabled = expensiveCheckOldValue;
+ }
+ }
+ }
function expressionInputDirtyCheck(newValue, oldValueOfValue) {
@@ -1866,13 +1948,14 @@ function $ParseProvider() {
function addInterceptor(parsedExpression, interceptorFn) {
if (!interceptorFn) return parsedExpression;
var watchDelegate = parsedExpression.$$watchDelegate;
+ var useInputs = false;
var regularWatch =
watchDelegate !== oneTimeLiteralWatchDelegate &&
watchDelegate !== oneTimeWatchDelegate;
var fn = regularWatch ? function regularInterceptedExpression(scope, locals, assign, inputs) {
- var value = parsedExpression(scope, locals, assign, inputs);
+ var value = useInputs && inputs ? inputs[0] : parsedExpression(scope, locals, assign, inputs);
return interceptorFn(value, scope, locals);
} : function oneTimeInterceptedExpression(scope, locals, assign, inputs) {
var value = parsedExpression(scope, locals, assign, inputs);
@@ -1890,6 +1973,7 @@ function $ParseProvider() {
// If there is an interceptor, but no watchDelegate then treat the interceptor like
// we treat filters - it is assumed to be a pure function unless flagged with $stateful
fn.$$watchDelegate = inputsWatchDelegate;
+ useInputs = !parsedExpression.inputs;
fn.inputs = parsedExpression.inputs ? parsedExpression.inputs : [parsedExpression];
}
diff --git a/src/ng/q.js b/src/ng/q.js
index 9466a2e9384d..8b7c89e1e501 100644
--- a/src/ng/q.js
+++ b/src/ng/q.js
@@ -13,15 +13,15 @@
* [Kris Kowal's Q](https://github.com/kriskowal/q).
*
* $q can be used in two fashions --- one which is more similar to Kris Kowal's Q or jQuery's Deferred
- * implementations, and the other which resembles ES6 promises to some degree.
+ * implementations, and the other which resembles ES6 (ES2015) promises to some degree.
*
* # $q constructor
*
* The streamlined ES6 style promise is essentially just using $q as a constructor which takes a `resolver`
- * function as the first argument. This is similar to the native Promise implementation from ES6 Harmony,
+ * function as the first argument. This is similar to the native Promise implementation from ES6,
* see [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise).
*
- * While the constructor-style use is supported, not all of the supporting methods from ES6 Harmony promises are
+ * While the constructor-style use is supported, not all of the supporting methods from ES6 promises are
* available yet.
*
* It can be used like so:
@@ -53,6 +53,8 @@
*
* Note: progress/notify callbacks are not currently supported via the ES6-style interface.
*
+ * Note: unlike ES6 behaviour, an exception thrown in the constructor function will NOT implicitly reject the promise.
+ *
* However, the more traditional CommonJS-style usage is still available, and documented below.
*
* [The CommonJS Promise proposal](http://wiki.commonjs.org/wiki/Promises) describes a promise as an
diff --git a/src/ng/rootScope.js b/src/ng/rootScope.js
index 952f4b92d484..db7ea1b040f7 100644
--- a/src/ng/rootScope.js
+++ b/src/ng/rootScope.js
@@ -14,15 +14,15 @@
* exposed as $$____ properties
*
* Loop operations are optimized by using while(count--) { ... }
- * - this means that in order to keep the same order of execution as addition we have to add
+ * - This means that in order to keep the same order of execution as addition we have to add
* items to the array at the beginning (unshift) instead of at the end (push)
*
* Child scopes are created and removed often
- * - Using an array would be slow since inserts in middle are expensive so we use linked list
+ * - Using an array would be slow since inserts in the middle are expensive; so we use linked lists
*
- * There are few watches then a lot of observers. This is why you don't want the observer to be
- * implemented in the same way as watch. Watch requires return of initialization function which
- * are expensive to construct.
+ * There are fewer watches than observers. This is why you don't want the observer to be implemented
+ * in the same way as watch. Watch requires return of the initialization function which is expensive
+ * to construct.
*/
@@ -64,7 +64,7 @@
* Every application has a single root {@link ng.$rootScope.Scope scope}.
* All other scopes are descendant scopes of the root scope. Scopes provide separation
* between the model and the view, via a mechanism for watching the model for changes.
- * They also provide an event emission/broadcast and subscription facility. See the
+ * They also provide event emission/broadcast and subscription facility. See the
* {@link guide/scope developer guide on scopes}.
*/
function $RootScopeProvider() {
@@ -101,6 +101,29 @@ function $RootScopeProvider() {
$event.currentScope.$$destroyed = true;
}
+ function cleanUpScope($scope) {
+
+ if (msie === 9) {
+ // There is a memory leak in IE9 if all child scopes are not disconnected
+ // completely when a scope is destroyed. So this code will recurse up through
+ // all this scopes children
+ //
+ // See issue https://github.com/angular/angular.js/issues/10706
+ $scope.$$childHead && cleanUpScope($scope.$$childHead);
+ $scope.$$nextSibling && cleanUpScope($scope.$$nextSibling);
+ }
+
+ // The code below works around IE9 and V8's memory leaks
+ //
+ // See:
+ // - https://code.google.com/p/v8/issues/detail?id=2073#c26
+ // - https://github.com/angular/angular.js/issues/6794#issuecomment-38648909
+ // - https://github.com/angular/angular.js/issues/1313#issuecomment-10378451
+
+ $scope.$parent = $scope.$$nextSibling = $scope.$$prevSibling = $scope.$$childHead =
+ $scope.$$childTail = $scope.$root = $scope.$$watchers = null;
+ }
+
/**
* @ngdoc type
* @name $rootScope.Scope
@@ -721,7 +744,7 @@ function $RootScopeProvider() {
*
*/
$digest: function() {
- var watch, value, last,
+ var watch, value, last, fn, get,
watchers,
length,
dirty, ttl = TTL,
@@ -767,7 +790,8 @@ function $RootScopeProvider() {
// Most common watches are on primitives, in which case we can short
// circuit it with === operator, only when === fails do we use .equals
if (watch) {
- if ((value = watch.get(current)) !== (last = watch.last) &&
+ get = watch.get;
+ if ((value = get(current)) !== (last = watch.last) &&
!(watch.eq
? equals(value, last)
: (typeof value === 'number' && typeof last === 'number'
@@ -775,7 +799,8 @@ function $RootScopeProvider() {
dirty = true;
lastDirtyWatch = watch;
watch.last = watch.eq ? copy(value, null) : value;
- watch.fn(value, ((last === initWatchVal) ? value : last), current);
+ fn = watch.fn;
+ fn(value, ((last === initWatchVal) ? value : last), current);
if (ttl < 5) {
logIdx = 4 - ttl;
if (!watchLog[logIdx]) watchLog[logIdx] = [];
@@ -897,16 +922,9 @@ function $RootScopeProvider() {
this.$on = this.$watch = this.$watchGroup = function() { return noop; };
this.$$listeners = {};
- // All of the code below is bogus code that works around V8's memory leak via optimized code
- // and inline caches.
- //
- // see:
- // - https://code.google.com/p/v8/issues/detail?id=2073#c26
- // - https://github.com/angular/angular.js/issues/6794#issuecomment-38648909
- // - https://github.com/angular/angular.js/issues/1313#issuecomment-10378451
-
- this.$parent = this.$$nextSibling = this.$$prevSibling = this.$$childHead =
- this.$$childTail = this.$root = this.$$watchers = null;
+ // Disconnect the next sibling to prevent `cleanUpScope` destroying those too
+ this.$$nextSibling = null;
+ cleanUpScope(this);
},
/**
@@ -982,7 +1000,7 @@ function $RootScopeProvider() {
});
}
- asyncQueue.push({scope: this, expression: expr, locals: locals});
+ asyncQueue.push({scope: this, expression: $parse(expr), locals: locals});
},
$$postDigest: function(fn) {
@@ -1074,6 +1092,7 @@ function $RootScopeProvider() {
$applyAsync: function(expr) {
var scope = this;
expr && applyAsyncQueue.push($applyAsyncExpression);
+ expr = $parse(expr);
scheduleApplyAsync();
function $applyAsyncExpression() {
diff --git a/src/ng/sce.js b/src/ng/sce.js
index d11419ff0f25..4159c4f52c32 100644
--- a/src/ng/sce.js
+++ b/src/ng/sce.js
@@ -144,13 +144,15 @@ function $SceDelegateProvider() {
* @kind function
*
* @param {Array=} whitelist When provided, replaces the resourceUrlWhitelist with the value
- * provided. This must be an array or null. A snapshot of this array is used so further
- * changes to the array are ignored.
+ * provided. This must be an array or null. A snapshot of this array is used so further
+ * changes to the array are ignored.
*
- * Follow {@link ng.$sce#resourceUrlPatternItem this link} for a description of the items
- * allowed in this array.
+ * Follow {@link ng.$sce#resourceUrlPatternItem this link} for a description of the items
+ * allowed in this array.
*
- * Note: **an empty whitelist array will block all URLs**!
+ *
+ * **Note:** an empty whitelist array will block all URLs!
+ *
*
* @return {Array} the currently set whitelist array.
*
@@ -173,17 +175,17 @@ function $SceDelegateProvider() {
* @kind function
*
* @param {Array=} blacklist When provided, replaces the resourceUrlBlacklist with the value
- * provided. This must be an array or null. A snapshot of this array is used so further
- * changes to the array are ignored.
+ * provided. This must be an array or null. A snapshot of this array is used so further
+ * changes to the array are ignored.
*
- * Follow {@link ng.$sce#resourceUrlPatternItem this link} for a description of the items
- * allowed in this array.
+ * Follow {@link ng.$sce#resourceUrlPatternItem this link} for a description of the items
+ * allowed in this array.
*
- * The typical usage for the blacklist is to **block
- * [open redirects](http://cwe.mitre.org/data/definitions/601.html)** served by your domain as
- * these would otherwise be trusted but actually return content from the redirected domain.
+ * The typical usage for the blacklist is to **block
+ * [open redirects](http://cwe.mitre.org/data/definitions/601.html)** served by your domain as
+ * these would otherwise be trusted but actually return content from the redirected domain.
*
- * Finally, **the blacklist overrides the whitelist** and has the final say.
+ * Finally, **the blacklist overrides the whitelist** and has the final say.
*
* @return {Array} the currently set blacklist array.
*
@@ -484,7 +486,7 @@ function $SceDelegateProvider() {
* By default, Angular only loads templates from the same domain and protocol as the application
* document. This is done by calling {@link ng.$sce#getTrustedResourceUrl
* $sce.getTrustedResourceUrl} on the template URL. To load templates from other domains and/or
- * protocols, you may either either {@link ng.$sceDelegateProvider#resourceUrlWhitelist whitelist
+ * protocols, you may either {@link ng.$sceDelegateProvider#resourceUrlWhitelist whitelist
* them} or {@link ng.$sce#trustAsResourceUrl wrap it} into a trusted value.
*
* *Please note*:
@@ -625,12 +627,12 @@ function $SceDelegateProvider() {
*
* describe('SCE doc demo', function() {
* it('should sanitize untrusted values', function() {
- * expect(element.all(by.css('.htmlComment')).first().getInnerHtml())
+ * expect(element.all(by.css('.htmlComment')).first().getAttribute('innerHTML'))
* .toBe('Is anyone reading this? ');
* });
*
* it('should NOT sanitize explicitly trusted values', function() {
- * expect(element(by.id('explicitlyTrustedHtml')).getInnerHtml()).toBe(
+ * expect(element(by.id('explicitlyTrustedHtml')).getAttribute('innerHTML')).toBe(
* 'Hover over this text. ');
* });
diff --git a/src/ng/templateRequest.js b/src/ng/templateRequest.js
index 6219308ed671..47f756f54434 100644
--- a/src/ng/templateRequest.js
+++ b/src/ng/templateRequest.js
@@ -31,7 +31,7 @@ function $TemplateRequestProvider() {
// are included in there. This also makes Angular accept any script
// directive, no matter its name. However, we still need to unwrap trusted
// types.
- if (!isString(tpl) || !$templateCache.get(tpl)) {
+ if (!isString(tpl) || isUndefined($templateCache.get(tpl))) {
tpl = $sce.getTrustedResourceUrl(tpl);
}
diff --git a/src/ng/timeout.js b/src/ng/timeout.js
index 305739527c4c..6253d788e121 100644
--- a/src/ng/timeout.js
+++ b/src/ng/timeout.js
@@ -33,8 +33,8 @@ function $TimeoutProvider() {
* @param {boolean=} [invokeApply=true] If set to `false` skips model dirty checking, otherwise
* will invoke `fn` within the {@link ng.$rootScope.Scope#$apply $apply} block.
* @param {...*=} Pass additional parameters to the executed function.
- * @returns {Promise} Promise that will be resolved when the timeout is reached. The value this
- * promise will be resolved with is the return value of the `fn` function.
+ * @returns {Promise} Promise that will be resolved when the timeout is reached. The promise
+ * will be resolved with the return value of the `fn` function.
*
*/
function timeout(fn, delay, invokeApply) {
diff --git a/src/ngAnimate/.jshintrc b/src/ngAnimate/.jshintrc
index ee79a690d2a8..5e7ad602cae7 100644
--- a/src/ngAnimate/.jshintrc
+++ b/src/ngAnimate/.jshintrc
@@ -7,6 +7,7 @@
"angular": false,
"noop": false,
+ "copy": false,
"forEach": false,
"extend": false,
"jqLite": false,
@@ -28,6 +29,7 @@
"REMOVE_CLASS_SUFFIX": false,
"EVENT_CLASS_PREFIX": false,
"ACTIVE_CLASS_SUFFIX": false,
+ "PREPARE_CLASS_SUFFIX": false,
"TRANSITION_DURATION_PROP": false,
"TRANSITION_DELAY_PROP": false,
@@ -47,7 +49,7 @@
"assertArg": false,
"isPromiseLike": false,
"mergeClasses": false,
- "mergeAnimationOptions": false,
+ "mergeAnimationDetails": false,
"prepareAnimationOptions": false,
"applyAnimationStyles": false,
"applyAnimationFromStyles": false,
diff --git a/src/ngAnimate/animateChildrenDirective.js b/src/ngAnimate/animateChildrenDirective.js
index 3962a632d890..129fe5bad1fe 100644
--- a/src/ngAnimate/animateChildrenDirective.js
+++ b/src/ngAnimate/animateChildrenDirective.js
@@ -1,15 +1,100 @@
'use strict';
-var $$AnimateChildrenDirective = [function() {
- return function(scope, element, attrs) {
- var val = attrs.ngAnimateChildren;
- if (angular.isString(val) && val.length === 0) { //empty attribute
- element.data(NG_ANIMATE_CHILDREN_DATA, true);
- } else {
- attrs.$observe('ngAnimateChildren', function(value) {
+/**
+ * @ngdoc directive
+ * @name ngAnimateChildren
+ * @restrict AE
+ * @element ANY
+ *
+ * @description
+ *
+ * ngAnimateChildren allows you to specify that children of this element should animate even if any
+ * of the children's parents are currently animating. By default, when an element has an active `enter`, `leave`, or `move`
+ * (structural) animation, child elements that also have an active structural animation are not animated.
+ *
+ * Note that even if `ngAnimteChildren` is set, no child animations will run when the parent element is removed from the DOM (`leave` animation).
+ *
+ *
+ * @param {string} ngAnimateChildren If the value is empty, `true` or `on`,
+ * then child animations are allowed. If the value is `false`, child animations are not allowed.
+ *
+ * @example
+ *
+
+
+
Show container?
+
Animate children?
+
+
+
+ List of items:
+
Item {{item}}
+
+
+
+
+
+ .container.ng-enter,
+ .container.ng-leave {
+ transition: all ease 1.5s;
+ }
+
+ .container.ng-enter,
+ .container.ng-leave-active {
+ opacity: 0;
+ }
+
+ .container.ng-leave,
+ .container.ng-enter-active {
+ opacity: 1;
+ }
+
+ .item {
+ background: firebrick;
+ color: #FFF;
+ margin-bottom: 10px;
+ }
+
+ .item.ng-enter,
+ .item.ng-leave {
+ transition: transform 1.5s ease;
+ }
+
+ .item.ng-enter {
+ transform: translateX(50px);
+ }
+
+ .item.ng-enter-active {
+ transform: translateX(0);
+ }
+
+
+ angular.module('ngAnimateChildren', ['ngAnimate'])
+ .controller('mainController', function() {
+ this.animateChildren = false;
+ this.enterElement = false;
+ });
+
+
+ */
+var $$AnimateChildrenDirective = ['$interpolate', function($interpolate) {
+ return {
+ link: function(scope, element, attrs) {
+ var val = attrs.ngAnimateChildren;
+ if (angular.isString(val) && val.length === 0) { //empty attribute
+ element.data(NG_ANIMATE_CHILDREN_DATA, true);
+ } else {
+ // Interpolate and set the value, so that it is available to
+ // animations that run right after compilation
+ setData($interpolate(val)(scope));
+ attrs.$observe('ngAnimateChildren', setData);
+ }
+
+ function setData(value) {
value = value === 'on' || value === 'true';
element.data(NG_ANIMATE_CHILDREN_DATA, value);
- });
+ }
}
};
}];
diff --git a/src/ngAnimate/animateCss.js b/src/ngAnimate/animateCss.js
index f15929614246..65dc170428c4 100644
--- a/src/ngAnimate/animateCss.js
+++ b/src/ngAnimate/animateCss.js
@@ -186,8 +186,10 @@ var ANIMATE_TIMER_KEY = '$$animateCss';
*
* * `event` - The DOM event (e.g. enter, leave, move). When used, a generated CSS class of `ng-EVENT` and `ng-EVENT-active` will be applied
* to the element during the animation. Multiple events can be provided when spaces are used as a separator. (Note that this will not perform any DOM operation.)
+ * * `structural` - Indicates that the `ng-` prefix will be added to the event class. Setting to `false` or omitting will turn `ng-EVENT` and
+ * `ng-EVENT-active` in `EVENT` and `EVENT-active`. Unused if `event` is omitted.
* * `easing` - The CSS easing value that will be applied to the transition or keyframe animation (or both).
- * * `transition` - The raw CSS transition style that will be used (e.g. `1s linear all`).
+ * * `transitionStyle` - The raw CSS transition style that will be used (e.g. `1s linear all`).
* * `keyframeStyle` - The raw CSS keyframe animation style that will be used (e.g. `1s my_animation linear`).
* * `from` - The starting CSS styles (a key/value object) that will be applied at the start of the animation.
* * `to` - The ending CSS styles (a key/value object) that will be applied across the animation via a CSS transition.
@@ -204,6 +206,10 @@ var ANIMATE_TIMER_KEY = '$$animateCss';
* * `staggerIndex` - The numeric index representing the stagger item (e.g. a value of 5 is equal to the sixth item in the stagger; therefore when a
* * `stagger` option value of `0.1` is used then there will be a stagger delay of `600ms`)
* * `applyClassesEarly` - Whether or not the classes being added or removed will be used when detecting the animation. This is set by `$animate` when enter/leave/move animations are fired to ensure that the CSS classes are resolved in time. (Note that this will prevent any transitions from occuring on the classes being added and removed.)
+ * * `cleanupStyles` - Whether or not the provided `from` and `to` styles will be removed once
+ * the animation is closed. This is useful for when the styles are used purely for the sake of
+ * the animation and do not have a lasting visual effect on the element (e.g. a colapse and open animation).
+ * By default this value is set to `false`.
*
* @return {object} an object with start and end methods and details about the animation.
*
@@ -324,14 +330,31 @@ function createLocalCacheLookup() {
};
}
+// we do not reassign an already present style value since
+// if we detect the style property value again we may be
+// detecting styles that were added via the `from` styles.
+// We make use of `isDefined` here since an empty string
+// or null value (which is what getPropertyValue will return
+// for a non-existing style) will still be marked as a valid
+// value for the style (a falsy value implies that the style
+// is to be removed at the end of the animation). If we had a simple
+// "OR" statement then it would not be enough to catch that.
+function registerRestorableStyles(backup, node, properties) {
+ forEach(properties, function(prop) {
+ backup[prop] = isDefined(backup[prop])
+ ? backup[prop]
+ : node.style.getPropertyValue(prop);
+ });
+}
+
var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
var gcsLookup = createLocalCacheLookup();
var gcsStaggerLookup = createLocalCacheLookup();
this.$get = ['$window', '$$jqLite', '$$AnimateRunner', '$timeout',
- '$$forceReflow', '$sniffer', '$$rAFScheduler', '$animate',
+ '$$forceReflow', '$sniffer', '$$rAFScheduler', '$$animateQueue',
function($window, $$jqLite, $$AnimateRunner, $timeout,
- $$forceReflow, $sniffer, $$rAFScheduler, $animate) {
+ $$forceReflow, $sniffer, $$rAFScheduler, $$animateQueue) {
var applyAnimationClasses = applyAnimationClassesFactory($$jqLite);
@@ -423,16 +446,24 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
return timings;
}
- return function init(element, options) {
+ return function init(element, initialOptions) {
+ // all of the animation functions should create
+ // a copy of the options data, however, if a
+ // parent service has already created a copy then
+ // we should stick to using that
+ var options = initialOptions || {};
+ if (!options.$$prepared) {
+ options = prepareAnimationOptions(copy(options));
+ }
+
+ var restoreStyles = {};
var node = getDomNode(element);
if (!node
|| !node.parentNode
- || !$animate.enabled()) {
+ || !$$animateQueue.enabled()) {
return closeAndReturnNoopAnimator();
}
- options = prepareAnimationOptions(options);
-
var temporaryStyles = [];
var classes = element.attr('class');
var styles = packageStyles(options);
@@ -445,6 +476,8 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
var maxDelayTime;
var maxDuration;
var maxDurationTime;
+ var startTime;
+ var events = [];
if (options.duration === 0 || (!$sniffer.animations && !$sniffer.transitions)) {
return closeAndReturnNoopAnimator();
@@ -598,7 +631,12 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
}
if (options.delay != null) {
- var delayStyle = parseFloat(options.delay);
+ var delayStyle;
+ if (typeof options.delay !== "boolean") {
+ delayStyle = parseFloat(options.delay);
+ // number in options.delay means we have to recalculate the delay for the closing timeout
+ maxDelay = Math.max(delayStyle, 0);
+ }
if (flags.applyTransitionDelay) {
temporaryStyles.push(getCssDelayStyle(delayStyle));
@@ -625,7 +663,12 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
stagger.animationDuration === 0;
}
- applyAnimationFromStyles(element, options);
+ if (options.from) {
+ if (options.cleanupStyles) {
+ registerRestorableStyles(restoreStyles, node, Object.keys(options.from));
+ }
+ applyAnimationFromStyles(element, options);
+ }
if (flags.blockTransition || flags.blockKeyframeAnimation) {
applyBlocking(maxDuration);
@@ -692,6 +735,13 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
applyAnimationClasses(element, options);
applyAnimationStyles(element, options);
+ if (Object.keys(restoreStyles).length) {
+ forEach(restoreStyles, function(value, prop) {
+ value ? node.style.setProperty(prop, value)
+ : node.style.removeProperty(prop);
+ });
+ }
+
// the reason why we have this option is to allow a synchronous closing callback
// that is fired as SOON as the animation ends (when the CSS is removed) or if
// the animation never takes off at all. A good example is a leave animation since
@@ -701,6 +751,18 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
options.onDone();
}
+ if (events && events.length) {
+ // Remove the transitionend / animationend listener(s)
+ element.off(events.join(' '), onAnimationProgress);
+ }
+
+ //Cancel the fallback closing timeout and remove the timer data
+ var animationTimerData = element.data(ANIMATE_TIMER_KEY);
+ if (animationTimerData) {
+ $timeout.cancel(animationTimerData[0].timer);
+ element.removeData(ANIMATE_TIMER_KEY);
+ }
+
// if the preparation function fails then the promise is not setup
if (runner) {
runner.complete(!rejected);
@@ -736,6 +798,33 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
};
}
+ function onAnimationProgress(event) {
+ event.stopPropagation();
+ var ev = event.originalEvent || event;
+
+ // we now always use `Date.now()` due to the recent changes with
+ // event.timeStamp in Firefox, Webkit and Chrome (see #13494 for more info)
+ var timeStamp = ev.$manualTimeStamp || Date.now();
+
+ /* Firefox (or possibly just Gecko) likes to not round values up
+ * when a ms measurement is used for the animation */
+ var elapsedTime = parseFloat(ev.elapsedTime.toFixed(ELAPSED_TIME_MAX_DECIMAL_PLACES));
+
+ /* $manualTimeStamp is a mocked timeStamp value which is set
+ * within browserTrigger(). This is only here so that tests can
+ * mock animations properly. Real events fallback to event.timeStamp,
+ * or, if they don't, then a timeStamp is automatically created for them.
+ * We're checking to see if the timeStamp surpasses the expected delay,
+ * but we're using elapsedTime instead of the timeStamp on the 2nd
+ * pre-condition since animationPauseds sometimes close off early */
+ if (Math.max(timeStamp - startTime, 0) >= maxDelayTime && elapsedTime >= maxDuration) {
+ // we set this flag to ensure that if the transition is paused then, when resumed,
+ // the animation will automatically close itself since transitions cannot be paused.
+ animationCompleted = true;
+ close();
+ }
+ }
+
function start() {
if (animationClosed) return;
if (!node.parentNode) {
@@ -743,8 +832,6 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
return;
}
- var startTime, events = [];
-
// even though we only pause keyframe animations here the pause flag
// will still happen when transitions are used. Only the transition will
// not be paused since that is not possible. If the animation ends when
@@ -885,8 +972,16 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
element.data(ANIMATE_TIMER_KEY, animationsData);
}
- element.on(events.join(' '), onAnimationProgress);
- applyAnimationToStyles(element, options);
+ if (events.length) {
+ element.on(events.join(' '), onAnimationProgress);
+ }
+
+ if (options.to) {
+ if (options.cleanupStyles) {
+ registerRestorableStyles(restoreStyles, node, Object.keys(options.to));
+ }
+ applyAnimationToStyles(element, options);
+ }
}
function onAnimationExpired() {
@@ -902,30 +997,6 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
element.removeData(ANIMATE_TIMER_KEY);
}
}
-
- function onAnimationProgress(event) {
- event.stopPropagation();
- var ev = event.originalEvent || event;
- var timeStamp = ev.$manualTimeStamp || ev.timeStamp || Date.now();
-
- /* Firefox (or possibly just Gecko) likes to not round values up
- * when a ms measurement is used for the animation */
- var elapsedTime = parseFloat(ev.elapsedTime.toFixed(ELAPSED_TIME_MAX_DECIMAL_PLACES));
-
- /* $manualTimeStamp is a mocked timeStamp value which is set
- * within browserTrigger(). This is only here so that tests can
- * mock animations properly. Real events fallback to event.timeStamp,
- * or, if they don't, then a timeStamp is automatically created for them.
- * We're checking to see if the timeStamp surpasses the expected delay,
- * but we're using elapsedTime instead of the timeStamp on the 2nd
- * pre-condition since animations sometimes close off early */
- if (Math.max(timeStamp - startTime, 0) >= maxDelayTime && elapsedTime >= maxDuration) {
- // we set this flag to ensure that if the transition is paused then, when resumed,
- // the animation will automatically close itself since transitions cannot be paused.
- animationCompleted = true;
- close();
- }
- }
}
};
}];
diff --git a/src/ngAnimate/animateCssDriver.js b/src/ngAnimate/animateCssDriver.js
index 12afe34abc76..d2cb67db0f70 100644
--- a/src/ngAnimate/animateCssDriver.js
+++ b/src/ngAnimate/animateCssDriver.js
@@ -9,16 +9,25 @@ var $$AnimateCssDriverProvider = ['$$animationProvider', function($$animationPro
var NG_OUT_ANCHOR_CLASS_NAME = 'ng-anchor-out';
var NG_IN_ANCHOR_CLASS_NAME = 'ng-anchor-in';
- this.$get = ['$animateCss', '$rootScope', '$$AnimateRunner', '$rootElement', '$$body', '$sniffer', '$$jqLite',
- function($animateCss, $rootScope, $$AnimateRunner, $rootElement, $$body, $sniffer, $$jqLite) {
+ function isDocumentFragment(node) {
+ return node.parentNode && node.parentNode.nodeType === 11;
+ }
+
+ this.$get = ['$animateCss', '$rootScope', '$$AnimateRunner', '$rootElement', '$sniffer', '$$jqLite', '$document',
+ function($animateCss, $rootScope, $$AnimateRunner, $rootElement, $sniffer, $$jqLite, $document) {
// only browsers that support these properties can render animations
if (!$sniffer.animations && !$sniffer.transitions) return noop;
- var bodyNode = getDomNode($$body);
+ var bodyNode = $document[0].body;
var rootNode = getDomNode($rootElement);
- var rootBodyElement = jqLite(bodyNode.parentNode === rootNode ? bodyNode : rootNode);
+ var rootBodyElement = jqLite(
+ // this is to avoid using something that exists outside of the body
+ // we also special case the doc fragement case because our unit test code
+ // appends the $rootElement to the body after the app has been bootstrapped
+ isDocumentFragment(rootNode) || bodyNode.contains(rootNode) ? rootNode : bodyNode
+ );
var applyAnimationClasses = applyAnimationClassesFactory($$jqLite);
diff --git a/src/ngAnimate/animateJs.js b/src/ngAnimate/animateJs.js
index ef356cb2a30e..d8ec683b5f40 100644
--- a/src/ngAnimate/animateJs.js
+++ b/src/ngAnimate/animateJs.js
@@ -11,6 +11,8 @@ var $$AnimateJsProvider = ['$animateProvider', function($animateProvider) {
var applyAnimationClasses = applyAnimationClassesFactory($$jqLite);
// $animateJs(element, 'enter');
return function(element, event, classes, options) {
+ var animationClosed = false;
+
// the `classes` argument is optional and if it is not used
// then the classes will be resolved from the element's className
// property as well as options.addClass/options.removeClass.
@@ -63,8 +65,32 @@ var $$AnimateJsProvider = ['$animateProvider', function($animateProvider) {
applyAnimationClasses(element, options);
}
+ function close() {
+ animationClosed = true;
+ applyOptions();
+ applyAnimationStyles(element, options);
+ }
+
+ var runner;
+
return {
+ $$willAnimate: true,
+ end: function() {
+ if (runner) {
+ runner.end();
+ } else {
+ close();
+ runner = new $$AnimateRunner();
+ runner.complete(true);
+ }
+ return runner;
+ },
start: function() {
+ if (runner) {
+ return runner;
+ }
+
+ runner = new $$AnimateRunner();
var closeActiveAnimations;
var chain = [];
@@ -89,8 +115,7 @@ var $$AnimateJsProvider = ['$animateProvider', function($animateProvider) {
});
}
- var animationClosed = false;
- var runner = new $$AnimateRunner({
+ runner.setHost({
end: function() {
endAnimations();
},
@@ -103,9 +128,7 @@ var $$AnimateJsProvider = ['$animateProvider', function($animateProvider) {
return runner;
function onComplete(success) {
- animationClosed = true;
- applyOptions();
- applyAnimationStyles(element, options);
+ close(success);
runner.complete(success);
}
diff --git a/src/ngAnimate/animateQueue.js b/src/ngAnimate/animateQueue.js
index 6337ec0c03c2..eec8b9ec4099 100644
--- a/src/ngAnimate/animateQueue.js
+++ b/src/ngAnimate/animateQueue.js
@@ -5,6 +5,7 @@ var NG_ANIMATE_PIN_DATA = '$ngAnimatePin';
var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
var PRE_DIGEST_STATE = 1;
var RUNNING_STATE = 2;
+ var ONE_SPACE = ' ';
var rules = this.rules = {
skip: [],
@@ -12,28 +13,50 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
join: []
};
+ function makeTruthyCssClassMap(classString) {
+ if (!classString) {
+ return null;
+ }
+
+ var keys = classString.split(ONE_SPACE);
+ var map = Object.create(null);
+
+ forEach(keys, function(key) {
+ map[key] = true;
+ });
+ return map;
+ }
+
+ function hasMatchingClasses(newClassString, currentClassString) {
+ if (newClassString && currentClassString) {
+ var currentClassMap = makeTruthyCssClassMap(currentClassString);
+ return newClassString.split(ONE_SPACE).some(function(className) {
+ return currentClassMap[className];
+ });
+ }
+ }
+
function isAllowed(ruleType, element, currentAnimation, previousAnimation) {
return rules[ruleType].some(function(fn) {
return fn(element, currentAnimation, previousAnimation);
});
}
- function hasAnimationClasses(options, and) {
- options = options || {};
- var a = (options.addClass || '').length > 0;
- var b = (options.removeClass || '').length > 0;
+ function hasAnimationClasses(animation, and) {
+ var a = (animation.addClass || '').length > 0;
+ var b = (animation.removeClass || '').length > 0;
return and ? a && b : a || b;
}
rules.join.push(function(element, newAnimation, currentAnimation) {
// if the new animation is class-based then we can just tack that on
- return !newAnimation.structural && hasAnimationClasses(newAnimation.options);
+ return !newAnimation.structural && hasAnimationClasses(newAnimation);
});
rules.skip.push(function(element, newAnimation, currentAnimation) {
// there is no need to animate anything if no classes are being added and
// there is no structural animation that will be triggered
- return !newAnimation.structural && !hasAnimationClasses(newAnimation.options);
+ return !newAnimation.structural && !hasAnimationClasses(newAnimation);
});
rules.skip.push(function(element, newAnimation, currentAnimation) {
@@ -59,21 +82,48 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
});
rules.cancel.push(function(element, newAnimation, currentAnimation) {
- var nO = newAnimation.options;
- var cO = currentAnimation.options;
+ var nA = newAnimation.addClass;
+ var nR = newAnimation.removeClass;
+ var cA = currentAnimation.addClass;
+ var cR = currentAnimation.removeClass;
+
+ // early detection to save the global CPU shortage :)
+ if ((isUndefined(nA) && isUndefined(nR)) || (isUndefined(cA) && isUndefined(cR))) {
+ return false;
+ }
- // if the exact same CSS class is added/removed then it's safe to cancel it
- return (nO.addClass && nO.addClass === cO.removeClass) || (nO.removeClass && nO.removeClass === cO.addClass);
+ return hasMatchingClasses(nA, cR) || hasMatchingClasses(nR, cA);
});
- this.$get = ['$$rAF', '$rootScope', '$rootElement', '$document', '$$body', '$$HashMap',
+ this.$get = ['$$rAF', '$rootScope', '$rootElement', '$document', '$$HashMap',
'$$animation', '$$AnimateRunner', '$templateRequest', '$$jqLite', '$$forceReflow',
- function($$rAF, $rootScope, $rootElement, $document, $$body, $$HashMap,
+ function($$rAF, $rootScope, $rootElement, $document, $$HashMap,
$$animation, $$AnimateRunner, $templateRequest, $$jqLite, $$forceReflow) {
var activeAnimationsLookup = new $$HashMap();
var disabledElementsLookup = new $$HashMap();
var animationsEnabled = null;
+ // $document might be mocked out in tests and won't include a real document.
+ // Providing an empty object with hidden = true will prevent animations from running
+ var rawDocument = $document[0] || {hidden: true};
+
+ function postDigestTaskFactory() {
+ var postDigestCalled = false;
+ return function(fn) {
+ // we only issue a call to postDigest before
+ // it has first passed. This prevents any callbacks
+ // from not firing once the animation has completed
+ // since it will be out of the digest cycle.
+ if (postDigestCalled) {
+ fn();
+ } else {
+ $rootScope.$$postDigest(function() {
+ postDigestCalled = true;
+ fn();
+ });
+ }
+ };
+ }
// Wait until all directive and route-related templates are downloaded and
// compiled. The $templateRequest.totalPendingRequests variable keeps track of
@@ -117,18 +167,28 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
var applyAnimationClasses = applyAnimationClassesFactory($$jqLite);
- function normalizeAnimationOptions(element, options) {
- return mergeAnimationOptions(element, options, {});
+ function normalizeAnimationDetails(element, animation) {
+ return mergeAnimationDetails(element, animation, {});
}
- function findCallbacks(element, event) {
+ // IE9-11 has no method "contains" in SVG element and in Node.prototype. Bug #10259.
+ var contains = Node.prototype.contains || function(arg) {
+ // jshint bitwise: false
+ return this === arg || !!(this.compareDocumentPosition(arg) & 16);
+ // jshint bitwise: true
+ };
+
+ function findCallbacks(parent, element, event) {
var targetNode = getDomNode(element);
+ var targetParentNode = getDomNode(parent);
var matches = [];
var entries = callbackRegistry[event];
if (entries) {
forEach(entries, function(entry) {
- if (entry.node.contains(targetNode)) {
+ if (contains.call(entry.node, targetNode)) {
+ matches.push(entry.callback);
+ } else if (event === 'leave' && contains.call(entry.node, targetParentNode)) {
matches.push(entry.callback);
}
});
@@ -137,14 +197,6 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
return matches;
}
- function triggerCallback(event, element, phase, data) {
- $$rAF(function() {
- forEach(findCallbacks(element, event), function(callback) {
- callback(element, phase, data);
- });
- });
- }
-
return {
on: function(event, container, callback) {
var node = extractElementNode(container);
@@ -211,12 +263,7 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
bool = !recordExists;
} else {
// (element, bool) - Element setter
- bool = !!bool;
- if (!bool) {
- disabledElementsLookup.put(node, true);
- } else if (recordExists) {
- disabledElementsLookup.remove(node);
- }
+ disabledElementsLookup.put(node, !bool);
}
}
}
@@ -225,7 +272,12 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
}
};
- function queueAnimation(element, event, options) {
+ function queueAnimation(element, event, initialOptions) {
+ // we always make a copy of the options since
+ // there should never be any side effects on
+ // the input data when running `$animateCss`.
+ var options = copy(initialOptions);
+
var node, parent;
element = stripCommentsFromElement(element);
if (element) {
@@ -239,6 +291,9 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
// These methods will become available after the digest has passed
var runner = new $$AnimateRunner();
+ // this is used to trigger callbacks in postDigest mode
+ var runInNextPostDigestOrNow = postDigestTaskFactory();
+
if (isArray(options.addClass)) {
options.addClass = options.addClass.join(' ');
}
@@ -279,10 +334,14 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
var isStructural = ['enter', 'move', 'leave'].indexOf(event) >= 0;
+ var documentHidden = rawDocument.hidden;
+
// this is a hard disable of all animations for the application or on
// the element itself, therefore there is no need to continue further
// past this point if not enabled
- var skipAnimations = !animationsEnabled || disabledElementsLookup.get(node);
+ // Animations are also disabled if the document is currently hidden (page is not visible
+ // to the user), because browsers slow down or do not flush calls to requestAnimationFrame
+ var skipAnimations = !animationsEnabled || documentHidden || disabledElementsLookup.get(node);
var existingAnimation = (!skipAnimations && activeAnimationsLookup.get(node)) || {};
var hasExistingAnimation = !!existingAnimation.state;
@@ -293,7 +352,10 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
}
if (skipAnimations) {
+ // Callbacks should fire even if the document is hidden (regression fix for issue #14120)
+ if (documentHidden) notifyProgress(runner, event, 'start');
close();
+ if (documentHidden) notifyProgress(runner, event, 'close');
return runner;
}
@@ -305,6 +367,8 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
structural: isStructural,
element: element,
event: event,
+ addClass: options.addClass,
+ removeClass: options.removeClass,
close: close,
options: options,
runner: runner
@@ -317,11 +381,10 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
close();
return runner;
} else {
- mergeAnimationOptions(element, existingAnimation.options, options);
+ mergeAnimationDetails(element, existingAnimation, newAnimation);
return existingAnimation.runner;
}
}
-
var cancelAnimationFlag = isAllowed('cancel', element, newAnimation, existingAnimation);
if (cancelAnimationFlag) {
if (existingAnimation.state === RUNNING_STATE) {
@@ -336,7 +399,8 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
existingAnimation.close();
} else {
// this will merge the new animation options into existing animation options
- mergeAnimationOptions(element, existingAnimation.options, newAnimation.options);
+ mergeAnimationDetails(element, existingAnimation, newAnimation);
+
return existingAnimation.runner;
}
} else {
@@ -346,12 +410,12 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
var joinAnimationFlag = isAllowed('join', element, newAnimation, existingAnimation);
if (joinAnimationFlag) {
if (existingAnimation.state === RUNNING_STATE) {
- normalizeAnimationOptions(element, options);
+ normalizeAnimationDetails(element, newAnimation);
} else {
applyGeneratedPreparationClasses(element, isStructural ? event : null, options);
event = newAnimation.event = existingAnimation.event;
- options = mergeAnimationOptions(element, existingAnimation.options, newAnimation.options);
+ options = mergeAnimationDetails(element, existingAnimation, newAnimation);
//we return the same runner since only the option values of this animation will
//be fed into the `existingAnimation`.
@@ -362,7 +426,7 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
} else {
// normalization in this case means that it removes redundant CSS classes that
// already exist (addClass) or do not exist (removeClass) on the element
- normalizeAnimationOptions(element, options);
+ normalizeAnimationDetails(element, newAnimation);
}
// when the options are merged and cleaned up we may end up not having to do
@@ -372,7 +436,7 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
if (!isValidAnimation) {
// animate (from/to) can be quickly checked first, otherwise we check if any classes are present
isValidAnimation = (newAnimation.event === 'animate' && Object.keys(newAnimation.options.to || {}).length > 0)
- || hasAnimationClasses(newAnimation.options);
+ || hasAnimationClasses(newAnimation);
}
if (!isValidAnimation) {
@@ -402,7 +466,7 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
var isValidAnimation = parentElement.length > 0
&& (animationDetails.event === 'animate'
|| animationDetails.structural
- || hasAnimationClasses(animationDetails.options));
+ || hasAnimationClasses(animationDetails));
// this means that the previous animation was cancelled
// even if the follow-up animation is the same event
@@ -434,13 +498,18 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
// this combined multiple class to addClass / removeClass into a setClass event
// so long as a structural event did not take over the animation
- event = !animationDetails.structural && hasAnimationClasses(animationDetails.options, true)
+ event = !animationDetails.structural && hasAnimationClasses(animationDetails, true)
? 'setClass'
: animationDetails.event;
markElementAnimationState(element, RUNNING_STATE);
var realRunner = $$animation(element, event, animationDetails.options);
+ // this will update the runner's flow-control events based on
+ // the `realRunner` object.
+ runner.setHost(realRunner);
+ notifyProgress(runner, event, 'start', {});
+
realRunner.done(function(status) {
close(!status);
var animationDetails = activeAnimationsLookup.get(node);
@@ -449,17 +518,25 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
}
notifyProgress(runner, event, 'close', {});
});
-
- // this will update the runner's flow-control events based on
- // the `realRunner` object.
- runner.setHost(realRunner);
- notifyProgress(runner, event, 'start', {});
});
return runner;
function notifyProgress(runner, event, phase, data) {
- triggerCallback(event, element, phase, data);
+ runInNextPostDigestOrNow(function() {
+ var callbacks = findCallbacks(parent, element, event);
+ if (callbacks.length) {
+ // do not optimize this call here to RAF because
+ // we don't know how heavy the callback code here will
+ // be and if this code is buffered then this can
+ // lead to a performance regression.
+ $$rAF(function() {
+ forEach(callbacks, function(callback) {
+ callback(element, phase, data);
+ });
+ });
+ }
+ });
runner.progress(event, phase, data);
}
@@ -478,15 +555,15 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
forEach(children, function(child) {
var state = parseInt(child.getAttribute(NG_ANIMATE_ATTR_NAME));
var animationDetails = activeAnimationsLookup.get(child);
- switch (state) {
- case RUNNING_STATE:
- animationDetails.runner.end();
- /* falls through */
- case PRE_DIGEST_STATE:
- if (animationDetails) {
+ if (animationDetails) {
+ switch (state) {
+ case RUNNING_STATE:
+ animationDetails.runner.end();
+ /* falls through */
+ case PRE_DIGEST_STATE:
activeAnimationsLookup.remove(child);
- }
- break;
+ break;
+ }
}
});
}
@@ -501,40 +578,61 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
return getDomNode(nodeOrElmA) === getDomNode(nodeOrElmB);
}
+ /**
+ * This fn returns false if any of the following is true:
+ * a) animations on any parent element are disabled, and animations on the element aren't explicitly allowed
+ * b) a parent element has an ongoing structural animation, and animateChildren is false
+ * c) the element is not a child of the body
+ * d) the element is not a child of the $rootElement
+ */
function areAnimationsAllowed(element, parentElement, event) {
- var bodyElementDetected = isMatchingElement(element, $$body) || element[0].nodeName === 'HTML';
+ var bodyElement = jqLite(rawDocument.body);
+ var bodyElementDetected = isMatchingElement(element, bodyElement) || element[0].nodeName === 'HTML';
var rootElementDetected = isMatchingElement(element, $rootElement);
var parentAnimationDetected = false;
var animateChildren;
+ var elementDisabled = disabledElementsLookup.get(getDomNode(element));
- var parentHost = element.data(NG_ANIMATE_PIN_DATA);
+ var parentHost = jqLite.data(element[0], NG_ANIMATE_PIN_DATA);
if (parentHost) {
parentElement = parentHost;
}
- while (parentElement && parentElement.length) {
+ parentElement = getDomNode(parentElement);
+
+ while (parentElement) {
if (!rootElementDetected) {
// angular doesn't want to attempt to animate elements outside of the application
// therefore we need to ensure that the rootElement is an ancestor of the current element
rootElementDetected = isMatchingElement(parentElement, $rootElement);
}
- var parentNode = parentElement[0];
- if (parentNode.nodeType !== ELEMENT_NODE) {
+ if (parentElement.nodeType !== ELEMENT_NODE) {
// no point in inspecting the #document element
break;
}
- var details = activeAnimationsLookup.get(parentNode) || {};
+ var details = activeAnimationsLookup.get(parentElement) || {};
// either an enter, leave or move animation will commence
// therefore we can't allow any animations to take place
// but if a parent animation is class-based then that's ok
if (!parentAnimationDetected) {
- parentAnimationDetected = details.structural || disabledElementsLookup.get(parentNode);
+ var parentElementDisabled = disabledElementsLookup.get(parentElement);
+
+ if (parentElementDisabled === true && elementDisabled !== false) {
+ // disable animations if the user hasn't explicitly enabled animations on the
+ // current element
+ elementDisabled = true;
+ // element is disabled via parent element, no need to check anything else
+ break;
+ } else if (parentElementDisabled === false) {
+ elementDisabled = false;
+ }
+ parentAnimationDetected = details.structural;
}
if (isUndefined(animateChildren) || animateChildren === true) {
- var value = parentElement.data(NG_ANIMATE_CHILDREN_DATA);
+ var value = jqLite.data(parentElement, NG_ANIMATE_CHILDREN_DATA);
if (isDefined(value)) {
animateChildren = value;
}
@@ -543,28 +641,32 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
// there is no need to continue traversing at this point
if (parentAnimationDetected && animateChildren === false) break;
- if (!rootElementDetected) {
- // angular doesn't want to attempt to animate elements outside of the application
- // therefore we need to ensure that the rootElement is an ancestor of the current element
- rootElementDetected = isMatchingElement(parentElement, $rootElement);
- if (!rootElementDetected) {
- parentHost = parentElement.data(NG_ANIMATE_PIN_DATA);
- if (parentHost) {
- parentElement = parentHost;
- }
- }
- }
-
if (!bodyElementDetected) {
- // we also need to ensure that the element is or will be apart of the body element
+ // we also need to ensure that the element is or will be a part of the body element
// otherwise it is pointless to even issue an animation to be rendered
- bodyElementDetected = isMatchingElement(parentElement, $$body);
+ bodyElementDetected = isMatchingElement(parentElement, bodyElement);
+ }
+
+ if (bodyElementDetected && rootElementDetected) {
+ // If both body and root have been found, any other checks are pointless,
+ // as no animation data should live outside the application
+ break;
+ }
+
+ if (!rootElementDetected) {
+ // If no rootElement is detected, check if the parentElement is pinned to another element
+ parentHost = jqLite.data(parentElement, NG_ANIMATE_PIN_DATA);
+ if (parentHost) {
+ // The pin target element becomes the next parent element
+ parentElement = getDomNode(parentHost);
+ continue;
+ }
}
- parentElement = parentElement.parent();
+ parentElement = parentElement.parentNode;
}
- var allowAnimation = !parentAnimationDetected || animateChildren;
+ var allowAnimation = (!parentAnimationDetected || animateChildren) && elementDisabled !== true;
return allowAnimation && rootElementDetected && bodyElementDetected;
}
diff --git a/src/ngAnimate/animateRunner.js b/src/ngAnimate/animateRunner.js
deleted file mode 100644
index 1a2e6264a5e5..000000000000
--- a/src/ngAnimate/animateRunner.js
+++ /dev/null
@@ -1,166 +0,0 @@
-'use strict';
-
-var $$AnimateAsyncRunFactory = ['$$rAF', function($$rAF) {
- var waitQueue = [];
-
- function waitForTick(fn) {
- waitQueue.push(fn);
- if (waitQueue.length > 1) return;
- $$rAF(function() {
- for (var i = 0; i < waitQueue.length; i++) {
- waitQueue[i]();
- }
- waitQueue = [];
- });
- }
-
- return function() {
- var passed = false;
- waitForTick(function() {
- passed = true;
- });
- return function(callback) {
- passed ? callback() : waitForTick(callback);
- };
- };
-}];
-
-var $$AnimateRunnerFactory = ['$q', '$sniffer', '$$animateAsyncRun',
- function($q, $sniffer, $$animateAsyncRun) {
-
- var INITIAL_STATE = 0;
- var DONE_PENDING_STATE = 1;
- var DONE_COMPLETE_STATE = 2;
-
- AnimateRunner.chain = function(chain, callback) {
- var index = 0;
-
- next();
- function next() {
- if (index === chain.length) {
- callback(true);
- return;
- }
-
- chain[index](function(response) {
- if (response === false) {
- callback(false);
- return;
- }
- index++;
- next();
- });
- }
- };
-
- AnimateRunner.all = function(runners, callback) {
- var count = 0;
- var status = true;
- forEach(runners, function(runner) {
- runner.done(onProgress);
- });
-
- function onProgress(response) {
- status = status && response;
- if (++count === runners.length) {
- callback(status);
- }
- }
- };
-
- function AnimateRunner(host) {
- this.setHost(host);
-
- this._doneCallbacks = [];
- this._runInAnimationFrame = $$animateAsyncRun();
- this._state = 0;
- }
-
- AnimateRunner.prototype = {
- setHost: function(host) {
- this.host = host || {};
- },
-
- done: function(fn) {
- if (this._state === DONE_COMPLETE_STATE) {
- fn();
- } else {
- this._doneCallbacks.push(fn);
- }
- },
-
- progress: noop,
-
- getPromise: function() {
- if (!this.promise) {
- var self = this;
- this.promise = $q(function(resolve, reject) {
- self.done(function(status) {
- status === false ? reject() : resolve();
- });
- });
- }
- return this.promise;
- },
-
- then: function(resolveHandler, rejectHandler) {
- return this.getPromise().then(resolveHandler, rejectHandler);
- },
-
- 'catch': function(handler) {
- return this.getPromise()['catch'](handler);
- },
-
- 'finally': function(handler) {
- return this.getPromise()['finally'](handler);
- },
-
- pause: function() {
- if (this.host.pause) {
- this.host.pause();
- }
- },
-
- resume: function() {
- if (this.host.resume) {
- this.host.resume();
- }
- },
-
- end: function() {
- if (this.host.end) {
- this.host.end();
- }
- this._resolve(true);
- },
-
- cancel: function() {
- if (this.host.cancel) {
- this.host.cancel();
- }
- this._resolve(false);
- },
-
- complete: function(response) {
- var self = this;
- if (self._state === INITIAL_STATE) {
- self._state = DONE_PENDING_STATE;
- self._runInAnimationFrame(function() {
- self._resolve(response);
- });
- }
- },
-
- _resolve: function(response) {
- if (this._state !== DONE_COMPLETE_STATE) {
- forEach(this._doneCallbacks, function(fn) {
- fn(response);
- });
- this._doneCallbacks.length = 0;
- this._state = DONE_COMPLETE_STATE;
- }
- }
- };
-
- return AnimateRunner;
-}];
diff --git a/src/ngAnimate/animation.js b/src/ngAnimate/animation.js
index c0deb035f790..f0ac060fcb9d 100644
--- a/src/ngAnimate/animation.js
+++ b/src/ngAnimate/animation.js
@@ -135,6 +135,12 @@ var $$AnimationProvider = ['$animateProvider', function($animateProvider) {
options.tempClasses = null;
}
+ var prepareClassName;
+ if (isStructural) {
+ prepareClassName = 'ng-' + event + PREPARE_CLASS_SUFFIX;
+ $$jqLite.addClass(element, prepareClassName);
+ }
+
animationQueue.push({
// this data is used by the postDigest code and passed into
// the driver step function
@@ -357,6 +363,10 @@ var $$AnimationProvider = ['$animateProvider', function($animateProvider) {
if (tempClasses) {
$$jqLite.addClass(element, tempClasses);
}
+ if (prepareClassName) {
+ $$jqLite.removeClass(element, prepareClassName);
+ prepareClassName = null;
+ }
}
function updateAnimationRunners(animation, newRunner) {
diff --git a/src/ngAnimate/body.js b/src/ngAnimate/body.js
deleted file mode 100644
index 8c8ce21ac9e8..000000000000
--- a/src/ngAnimate/body.js
+++ /dev/null
@@ -1,7 +0,0 @@
-'use strict';
-
-function $$BodyProvider() {
- this.$get = ['$document', function($document) {
- return jqLite($document[0].body);
- }];
-}
diff --git a/src/ngAnimate/module.js b/src/ngAnimate/module.js
index d48dd73e8d9c..bee7501f5d5c 100644
--- a/src/ngAnimate/module.js
+++ b/src/ngAnimate/module.js
@@ -2,11 +2,9 @@
/* global angularAnimateModule: true,
- $$BodyProvider,
$$AnimateAsyncRunFactory,
$$rAFSchedulerFactory,
$$AnimateChildrenDirective,
- $$AnimateRunnerFactory,
$$AnimateQueueProvider,
$$AnimationProvider,
$AnimateCssProvider,
@@ -255,6 +253,34 @@
* the CSS class once an animation has completed.)
*
*
+ * ### The `ng-[event]-prepare` class
+ *
+ * This is a special class that can be used to prevent unwanted flickering / flash of content before
+ * the actual animation starts. The class is added as soon as an animation is initialized, but removed
+ * before the actual animation starts (after waiting for a $digest).
+ * It is also only added for *structural* animations (`enter`, `move`, and `leave`).
+ *
+ * In practice, flickering can appear when nesting elements with structural animations such as `ngIf`
+ * into elements that have class-based animations such as `ngClass`.
+ *
+ * ```html
+ *
+ * ```
+ *
+ * It is possible that during the `enter` animation, the `.message` div will be briefly visible before it starts animating.
+ * In that case, you can add styles to the CSS that make sure the element stays hidden before the animation starts:
+ *
+ * ```css
+ * .message.ng-enter-prepare {
+ * opacity: 0;
+ * }
+ *
+ * ```
+ *
* ## JavaScript-based Animations
*
* ngAnimate also allows for animations to be consumed by JavaScript code. The approach is similar to CSS-based animations (where there is a shared
@@ -291,7 +317,7 @@
* jQuery(element).fadeOut(1000, doneFn);
* }
* }
- * }]
+ * }]);
* ```
*
* The nice thing about JS-based animations is that we can inject other services and make use of advanced animation libraries such as
@@ -322,7 +348,7 @@
* // do some cool animation and call the doneFn
* }
* }
- * }]
+ * }]);
* ```
*
* ## CSS + JS Animations Together
@@ -344,7 +370,7 @@
* jQuery(element).slideIn(1000, doneFn);
* }
* }
- * }]
+ * }]);
* ```
*
* ```css
@@ -364,16 +390,15 @@
* ```js
* myModule.animation('.slide', ['$animateCss', function($animateCss) {
* return {
- * enter: function(element, doneFn) {
+ * enter: function(element) {
* // this will trigger `.slide.ng-enter` and `.slide.ng-enter-active`.
- * var runner = $animateCss(element, {
+ * return $animateCss(element, {
* event: 'enter',
* structural: true
- * }).start();
-* runner.done(doneFn);
+ * });
* }
* }
- * }]
+ * }]);
* ```
*
* The nice thing here is that we can save bandwidth by sticking to our CSS-based animation code and we don't need to rely on a 3rd-party animation framework.
@@ -385,19 +410,17 @@
* ```js
* myModule.animation('.slide', ['$animateCss', function($animateCss) {
* return {
- * enter: function(element, doneFn) {
- * var runner = $animateCss(element, {
+ * enter: function(element) {
+ * return $animateCss(element, {
* event: 'enter',
* structural: true,
* addClass: 'maroon-setting',
* from: { height:0 },
* to: { height: 200 }
- * }).start();
- *
- * runner.done(doneFn);
+ * });
* }
* }
- * }]
+ * }]);
* ```
*
* Now we can fill in the rest via our transition CSS code:
@@ -742,14 +765,9 @@
* Click here {@link ng.$animate to learn more about animations with `$animate`}.
*/
angular.module('ngAnimate', [])
- .provider('$$body', $$BodyProvider)
-
.directive('ngAnimateChildren', $$AnimateChildrenDirective)
.factory('$$rAFScheduler', $$rAFSchedulerFactory)
- .factory('$$AnimateRunner', $$AnimateRunnerFactory)
- .factory('$$animateAsyncRun', $$AnimateAsyncRunFactory)
-
.provider('$$animateQueue', $$AnimateQueueProvider)
.provider('$$animation', $$AnimationProvider)
diff --git a/src/ngAnimate/shared.js b/src/ngAnimate/shared.js
index ad58a1506cab..54d3c95412ae 100644
--- a/src/ngAnimate/shared.js
+++ b/src/ngAnimate/shared.js
@@ -2,6 +2,7 @@
/* jshint ignore:start */
var noop = angular.noop;
+var copy = angular.copy;
var extend = angular.extend;
var jqLite = angular.element;
var forEach = angular.forEach;
@@ -20,6 +21,7 @@ var ADD_CLASS_SUFFIX = '-add';
var REMOVE_CLASS_SUFFIX = '-remove';
var EVENT_CLASS_PREFIX = 'ng-';
var ACTIVE_CLASS_SUFFIX = '-active';
+var PREPARE_CLASS_SUFFIX = '-prepare';
var NG_ANIMATE_CLASSNAME = 'ng-animate';
var NG_ANIMATE_CHILDREN_DATA = '$$ngAnimateChildren';
@@ -71,6 +73,7 @@ var isPromiseLike = function(p) {
return p && p.then ? true : false;
};
+var ngMinErr = angular.$$minErr('ng');
function assertArg(arg, name, reason) {
if (!arg) {
throw ngMinErr('areq', "Argument '{0}' is {1}", (name || '?'), (reason || "required"));
@@ -124,7 +127,7 @@ function stripCommentsFromElement(element) {
if (element instanceof jqLite) {
switch (element.length) {
case 0:
- return [];
+ return element;
break;
case 1:
@@ -215,7 +218,10 @@ function applyAnimationToStyles(element, options) {
}
}
-function mergeAnimationOptions(element, target, newOptions) {
+function mergeAnimationDetails(element, oldAnimation, newAnimation) {
+ var target = oldAnimation.options || {};
+ var newOptions = newAnimation.options || {};
+
var toAdd = (target.addClass || '') + ' ' + (newOptions.addClass || '');
var toRemove = (target.removeClass || '') + ' ' + (newOptions.removeClass || '');
var classes = resolveElementClasses(element.attr('class'), toAdd, toRemove);
@@ -247,6 +253,9 @@ function mergeAnimationOptions(element, target, newOptions) {
target.removeClass = null;
}
+ oldAnimation.addClass = target.addClass;
+ oldAnimation.removeClass = target.removeClass;
+
return target;
}
diff --git a/src/ngAria/aria.js b/src/ngAria/aria.js
index 32ae204633b9..036dd42b47de 100644
--- a/src/ngAria/aria.js
+++ b/src/ngAria/aria.js
@@ -235,7 +235,8 @@ ngAriaModule.directive('ngShow', ['$aria', function($aria) {
}
},
post: function(scope, elem, attr, ngModel) {
- var needsTabIndex = shouldAttachAttr('tabindex', 'tabindex', elem);
+ var needsTabIndex = shouldAttachAttr('tabindex', 'tabindex', elem)
+ && !isNodeOneOf(elem, nodeBlackList);
function ngAriaWatchModelValue() {
return ngModel.$modelValue;
diff --git a/src/ngCookies/cookies.js b/src/ngCookies/cookies.js
index 5bcf39bfeb76..28a761bf21de 100644
--- a/src/ngCookies/cookies.js
+++ b/src/ngCookies/cookies.js
@@ -34,16 +34,17 @@ angular.module('ngCookies', ['ng']).
* The object may have following properties:
*
* - **path** - `{string}` - The cookie will be available only for this path and its
- * sub-paths. By default, this would be the URL that appears in your base tag.
+ * sub-paths. By default, this is the URL that appears in your `
it('should sanitize the html snippet by default', function() {
- expect(element(by.css('#bind-html-with-sanitize div')).getInnerHtml()).
+ expect(element(by.css('#bind-html-with-sanitize div')).getAttribute('innerHTML')).
toBe('an html\nclick here \nsnippet
');
});
it('should inline raw snippet if bound to a trusted value', function() {
- expect(element(by.css('#bind-html-with-trust div')).getInnerHtml()).
+ expect(element(by.css('#bind-html-with-trust div')).getAttribute('innerHTML')).
toBe("an html\n" +
"click here \n" +
"snippet
");
});
it('should escape snippet without any filter', function() {
- expect(element(by.css('#bind-default div')).getInnerHtml()).
+ expect(element(by.css('#bind-default div')).getAttribute('innerHTML')).
toBe("<p style=\"color:blue\">an html\n" +
"<em onmouseover=\"this.textContent='PWN3D!'\">click here</em>\n" +
"snippet</p>");
@@ -133,11 +133,11 @@ var $sanitizeMinErr = angular.$$minErr('$sanitize');
it('should update', function() {
element(by.model('snippet')).clear();
element(by.model('snippet')).sendKeys('new text ');
- expect(element(by.css('#bind-html-with-sanitize div')).getInnerHtml()).
+ expect(element(by.css('#bind-html-with-sanitize div')).getAttribute('innerHTML')).
toBe('new text ');
- expect(element(by.css('#bind-html-with-trust div')).getInnerHtml()).toBe(
+ expect(element(by.css('#bind-html-with-trust div')).getAttribute('innerHTML')).toBe(
'new text ');
- expect(element(by.css('#bind-default div')).getInnerHtml()).toBe(
+ expect(element(by.css('#bind-default div')).getAttribute('innerHTML')).toBe(
"new <b onclick=\"alert(1)\">text</b>");
});
diff --git a/src/ngScenario/browserTrigger.js b/src/ngScenario/browserTrigger.js
index f3c22fe5ff62..79a70934063e 100644
--- a/src/ngScenario/browserTrigger.js
+++ b/src/ngScenario/browserTrigger.js
@@ -15,6 +15,7 @@
if (!element) return;
eventData = eventData || {};
+ var relatedTarget = eventData.relatedTarget || element;
var keys = eventData.keys;
var x = eventData.x;
var y = eventData.y;
@@ -84,7 +85,7 @@
x = x || 0;
y = y || 0;
evnt.initMouseEvent(eventType, true, true, window, 0, x, y, x, y, pressed('ctrl'),
- pressed('alt'), pressed('shift'), pressed('meta'), 0, element);
+ pressed('alt'), pressed('shift'), pressed('meta'), 0, relatedTarget);
}
/* we're unable to change the timeStamp value directly so this
diff --git a/src/ngTouch/swipe.js b/src/ngTouch/swipe.js
index b15628892882..50744559a472 100644
--- a/src/ngTouch/swipe.js
+++ b/src/ngTouch/swipe.js
@@ -12,8 +12,7 @@
*
* Requires the {@link ngTouch `ngTouch`} module to be installed.
*
- * `$swipe` is used by the `ngSwipeLeft` and `ngSwipeRight` directives in `ngTouch`, and by
- * `ngCarousel` in a separate component.
+ * `$swipe` is used by the `ngSwipeLeft` and `ngSwipeRight` directives in `ngTouch`.
*
* # Usage
* The `$swipe` service is an object with a single method: `bind`. `bind` takes an element
diff --git a/test/AngularSpec.js b/test/AngularSpec.js
index 7a21a0feea39..d2b8831aa6fa 100644
--- a/test/AngularSpec.js
+++ b/test/AngularSpec.js
@@ -177,6 +177,18 @@ describe('angular', function() {
}
});
+ it('should handle Blob objects', function() {
+ if (typeof Blob !== 'undefined') {
+ var src = new Blob(['foo'], {type: 'bar'});
+ var dst = copy(src);
+
+ expect(dst).not.toBe(src);
+ expect(dst.size).toBe(3);
+ expect(dst.type).toBe('bar');
+ expect(isBlob(dst)).toBe(true);
+ }
+ });
+
it("should throw an exception if a Uint8Array is the destination", function() {
if (typeof Uint8Array !== 'undefined') {
var src = new Uint8Array();
@@ -313,11 +325,19 @@ describe('angular', function() {
it('should throw an exception if a Scope is being copied', inject(function($rootScope) {
expect(function() { copy($rootScope.$new()); }).
toThrowMinErr("ng", "cpws", "Can't copy! Making copies of Window or Scope instances is not supported.");
+ expect(function() { copy({child: $rootScope.$new()}, {}); }).
+ toThrowMinErr("ng", "cpws", "Can't copy! Making copies of Window or Scope instances is not supported.");
+ expect(function() { copy([$rootScope.$new()]); }).
+ toThrowMinErr("ng", "cpws", "Can't copy! Making copies of Window or Scope instances is not supported.");
}));
it('should throw an exception if a Window is being copied', function() {
expect(function() { copy(window); }).
toThrowMinErr("ng", "cpws", "Can't copy! Making copies of Window or Scope instances is not supported.");
+ expect(function() { copy({child: window}); }).
+ toThrowMinErr("ng", "cpws", "Can't copy! Making copies of Window or Scope instances is not supported.");
+ expect(function() { copy([window], []); }).
+ toThrowMinErr("ng", "cpws", "Can't copy! Making copies of Window or Scope instances is not supported.");
});
it('should throw an exception when source and destination are equivalent', function() {
@@ -334,6 +354,11 @@ describe('angular', function() {
hashKey(src);
dst = copy(src);
expect(hashKey(dst)).not.toEqual(hashKey(src));
+
+ src = {foo: {}};
+ hashKey(src.foo);
+ dst = copy(src);
+ expect(hashKey(src.foo)).not.toEqual(hashKey(dst.foo));
});
it('should retain the previous $$hashKey when copying object with hashKey', function() {
@@ -461,6 +486,7 @@ describe('angular', function() {
});
describe("extend", function() {
+
it('should not copy the private $$hashKey', function() {
var src,dst;
src = {};
@@ -471,6 +497,24 @@ describe('angular', function() {
});
+ it('should copy the properties of the source object onto the destination object', function() {
+ var destination, source;
+ destination = {};
+ source = {foo: true};
+ destination = extend(destination, source);
+ expect(isDefined(destination.foo)).toBe(true);
+ });
+
+
+ it('ISSUE #4751 - should copy the length property of an object source to the destination object', function() {
+ var destination, source;
+ destination = {};
+ source = {radius: 30, length: 0};
+ destination = extend(destination, source);
+ expect(isDefined(destination.length)).toBe(true);
+ expect(isDefined(destination.radius)).toBe(true);
+ });
+
it('should retain the previous $$hashKey', function() {
var src,dst,h;
src = {};
@@ -503,6 +547,17 @@ describe('angular', function() {
expect(dst.date).toBe(src.date);
});
+
+ it('should copy elements by reference', function() {
+ var src = { element: document.createElement('div'),
+ jqObject: jqLite("
s1 s2
").find("span") };
+ var dst = {};
+
+ extend(dst, src);
+
+ expect(dst.element).toBe(src.element);
+ expect(dst.jqObject).toBe(src.jqObject);
+ });
});
@@ -593,6 +648,25 @@ describe('angular', function() {
expect(isRegExp(dst.regexp)).toBe(true);
expect(dst.regexp.toString()).toBe(src.regexp.toString());
});
+
+
+ it('should copy(clone) elements', function() {
+ var src = {
+ element: document.createElement('div'),
+ jqObject: jqLite('
s1 s2
').find('span')
+ };
+ var dst = {};
+
+ merge(dst, src);
+
+ expect(dst.element).not.toBe(src.element);
+ expect(dst.jqObject).not.toBe(src.jqObject);
+
+ expect(isElement(dst.element)).toBeTruthy();
+ expect(dst.element.nodeName).toBeDefined(); // i.e it is a DOM element
+ expect(isElement(dst.jqObject)).toBeTruthy();
+ expect(dst.jqObject.nodeName).toBeUndefined(); // i.e it is a jqLite/jQuery object
+ });
});
@@ -1035,6 +1109,63 @@ describe('angular', function() {
});
});
+ describe('isArrayLike', function() {
+
+ it('should return false if passed a number', function() {
+ expect(isArrayLike(10)).toBe(false);
+ });
+
+ it('should return true if passed an array', function() {
+ expect(isArrayLike([1,2,3,4])).toBe(true);
+ });
+
+ it('should return true if passed an object', function() {
+ expect(isArrayLike({0:"test", 1:"bob", 2:"tree", length:3})).toBe(true);
+ });
+
+ it('should return true if passed arguments object', function() {
+ function test(a,b,c) {
+ expect(isArrayLike(arguments)).toBe(true);
+ }
+ test(1,2,3);
+ });
+
+ it('should return true if passed a nodelist', function() {
+ var nodes1 = document.body.childNodes;
+ expect(isArrayLike(nodes1)).toBe(true);
+
+ var nodes2 = document.getElementsByTagName('nonExistingTagName');
+ expect(isArrayLike(nodes2)).toBe(true);
+ });
+
+ it('should return false for objects with `length` but no matching indexable items', function() {
+ var obj1 = {
+ a: 'a',
+ b:'b',
+ length: 10
+ };
+ expect(isArrayLike(obj1)).toBe(false);
+
+ var obj2 = {
+ length: 0
+ };
+ expect(isArrayLike(obj2)).toBe(false);
+ });
+
+ it('should return true for empty instances of an Array subclass', function() {
+ function ArrayLike() {}
+ ArrayLike.prototype = Array.prototype;
+
+ var arrLike = new ArrayLike();
+ expect(arrLike.length).toBe(0);
+ expect(isArrayLike(arrLike)).toBe(true);
+
+ arrLike.push(1, 2, 3);
+ expect(arrLike.length).toBe(3);
+ expect(isArrayLike(arrLike)).toBe(true);
+ });
+ });
+
describe('forEach', function() {
it('should iterate over *own* object properties', function() {
@@ -1074,6 +1205,11 @@ describe('angular', function() {
forEach(jqObject, function(value, key) { log.push(key + ':' + value.innerHTML); });
expect(log).toEqual(['0:s1', '1:s2']);
+
+ log = [];
+ jqObject = jqLite("
");
+ forEach(jqObject.children(), function(value, key) { log.push(key + ':' + value.innerHTML); });
+ expect(log).toEqual([]);
});
diff --git a/test/e2e/fixtures/angular-already-loaded/index.html b/test/e2e/fixtures/angular-already-loaded/index.html
new file mode 100644
index 000000000000..292124d4fe1b
--- /dev/null
+++ b/test/e2e/fixtures/angular-already-loaded/index.html
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+
diff --git a/test/e2e/fixtures/angular-already-loaded/script.js b/test/e2e/fixtures/angular-already-loaded/script.js
new file mode 100644
index 000000000000..2d625bb4f19c
--- /dev/null
+++ b/test/e2e/fixtures/angular-already-loaded/script.js
@@ -0,0 +1,4 @@
+angular.module("test", []).
+ controller("TestCtrl", function($scope) {
+ $scope.text = "Hello, world!";
+ });
diff --git a/test/e2e/fixtures/input-hidden/index.html b/test/e2e/fixtures/input-hidden/index.html
new file mode 100644
index 000000000000..881639100ad9
--- /dev/null
+++ b/test/e2e/fixtures/input-hidden/index.html
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/test/e2e/tests/angular-already-loadedSpec.js b/test/e2e/tests/angular-already-loadedSpec.js
new file mode 100644
index 000000000000..87e4d8aabe14
--- /dev/null
+++ b/test/e2e/tests/angular-already-loadedSpec.js
@@ -0,0 +1,10 @@
+describe('App where angular is loaded more than once', function() {
+ beforeEach(function() {
+ loadFixture("angular-already-loaded").andWaitForAngular();
+ });
+
+ it('should have the interpolated text', function() {
+ expect(element(by.binding('text')).getText())
+ .toBe('Hello, world!');
+ });
+});
diff --git a/test/e2e/tests/input-hidden.spec.js b/test/e2e/tests/input-hidden.spec.js
new file mode 100644
index 000000000000..51af45e43fa6
--- /dev/null
+++ b/test/e2e/tests/input-hidden.spec.js
@@ -0,0 +1,15 @@
+describe('hidden thingy', function() {
+ it('should pass', function() {
+
+ loadFixture('input-hidden');
+ expect(element(by.css('input')).getAttribute('value')).toEqual('');
+
+ element(by.css('button')).click();
+ expect(element(by.css('input')).getAttribute('value')).toEqual('{{ 7 * 6 }}');
+
+ loadFixture('sample');
+ browser.driver.executeScript('history.back()');
+ var expectedValue = browser.params.browser === 'safari' ? '{{ 7 * 6 }}' : '';
+ expect(element(by.css('input')).getAttribute('value')).toEqual(expectedValue);
+ });
+});
diff --git a/test/helpers/privateMocks.js b/test/helpers/privateMocks.js
index f733afb8393f..ae57f116cc0e 100644
--- a/test/helpers/privateMocks.js
+++ b/test/helpers/privateMocks.js
@@ -11,7 +11,7 @@ function baseThey(msg, vals, spec, itFn) {
var valsIsArray = angular.isArray(vals);
angular.forEach(vals, function(val, key) {
- var m = msg.replace(/\$prop/g, angular.toJson(valsIsArray ? val : key));
+ var m = msg.split('$prop').join(angular.toJson(valsIsArray ? val : key));
itFn(m, function() {
/* jshint -W040 : ignore possible strict violation due to use of this */
spec.call(this, val);
@@ -40,9 +40,8 @@ function browserSupportsCssAnimations() {
return true;
}
-function createMockStyleSheet(doc, wind) {
+function createMockStyleSheet(doc, prefix) {
doc = doc ? doc[0] : document;
- wind = wind || window;
var node = doc.createElement('style');
var head = doc.getElementsByTagName('head')[0];
@@ -63,6 +62,18 @@ function createMockStyleSheet(doc, wind) {
}
},
+ addPossiblyPrefixedRule: function(selector, styles) {
+ if (prefix) {
+ var prefixedStyles = styles.split(/\s*;\s*/g).map(function(style) {
+ return !style ? '' : prefix + style;
+ }).join('; ');
+
+ this.addRule(selector, prefixedStyles);
+ }
+
+ this.addRule(selector, styles);
+ },
+
destroy: function() {
head.removeChild(node);
}
diff --git a/test/helpers/privateMocksSpec.js b/test/helpers/privateMocksSpec.js
index 019dabb576c1..c584b1d33c39 100644
--- a/test/helpers/privateMocksSpec.js
+++ b/test/helpers/privateMocksSpec.js
@@ -22,6 +22,13 @@ describe('private mocks', function() {
expect(window.it).toHaveBeenCalledWith('should fight "fire" with "fire"', jasmine.any(Function));
});
+ it('should handle replacement strings containing `$&` correctly', function() {
+ spyOn(window, 'it');
+
+ they('should replace dollar-prop with $prop', ['$&']);
+ expect(window.it).toHaveBeenCalledWith('should replace dollar-prop with "$&"', jasmine.any(Function));
+ });
+
it('should pass each item in an array to the handler', function() {
var handlerSpy = jasmine.createSpy('handler');
spyOn(window, 'it').andCallFake(function(msg, handler) {
@@ -204,7 +211,7 @@ describe('private mocks', function() {
var doc = $document[0];
var count = doc.styleSheets.length;
- var stylesheet = createMockStyleSheet($document, $window);
+ var stylesheet = createMockStyleSheet($document);
var elm;
runs(function() {
expect(doc.styleSheets.length).toBe(count + 1);
diff --git a/test/helpers/testabilityPatch.js b/test/helpers/testabilityPatch.js
index acc8060dea25..469459c39094 100644
--- a/test/helpers/testabilityPatch.js
+++ b/test/helpers/testabilityPatch.js
@@ -1,4 +1,4 @@
-/* global jQuery: true, uid: true */
+/* global jQuery: true, uid: true, jqCache: true */
'use strict';
/**
@@ -12,6 +12,7 @@ if (window._jQuery) _jQuery.event.special.change = undefined;
if (window.bindJQuery) bindJQuery();
beforeEach(function() {
+
// all this stuff is not needed for module tests, where jqlite and publishExternalAPI and jqLite are not global vars
if (window.publishExternalAPI) {
publishExternalAPI(angular);
@@ -28,7 +29,10 @@ beforeEach(function() {
// reset to jQuery or default to us.
bindJQuery();
- jqLiteCacheSizeInit();
+
+ // Clear the cache to prevent memory leak failures from previous tests
+ // breaking subsequent tests unnecessarily
+ jqCache = jqLite.cache = {};
}
angular.element(document.body).empty().removeData();
@@ -84,7 +88,6 @@ afterEach(function() {
}
}
-
// copied from Angular.js
// we need this method here so that we can run module tests with wrapped angular.js
function forEachSorted(obj, iterator, context) {
@@ -133,14 +136,7 @@ function dealoc(obj) {
function jqLiteCacheSize() {
- var size = 0;
- forEach(jqLite.cache, function() { size++; });
- return size - jqLiteCacheSize.initSize;
-}
-jqLiteCacheSize.initSize = 0;
-
-function jqLiteCacheSizeInit() {
- jqLiteCacheSize.initSize = jqLiteCacheSize.initSize + jqLiteCacheSize();
+ return Object.keys(jqLite.cache).length;
}
diff --git a/test/jqLiteSpec.js b/test/jqLiteSpec.js
index 233e298f63f7..98c91c8a42c8 100644
--- a/test/jqLiteSpec.js
+++ b/test/jqLiteSpec.js
@@ -1193,21 +1193,45 @@ describe('jqLite', function() {
});
describe('mouseenter-mouseleave', function() {
- var root, parent, sibling, child, log;
+ var root, parent, child, log;
- beforeEach(function() {
+ function setup(html, parentNode, childNode) {
log = '';
- root = jqLite('
');
- parent = root.find('p');
- sibling = root.find('ul');
- child = parent.find('span');
+ root = jqLite(html);
+ parent = root.find(parentNode);
+ child = parent.find(childNode);
parent.on('mouseenter', function() { log += 'parentEnter;'; });
parent.on('mouseleave', function() { log += 'parentLeave;'; });
child.on('mouseenter', function() { log += 'childEnter;'; });
child.on('mouseleave', function() { log += 'childLeave;'; });
- });
+ }
+
+ function browserMoveTrigger(from, to) {
+ var fireEvent = function(type, element, relatedTarget) {
+ var evnt;
+ evnt = document.createEvent('MouseEvents');
+
+ var originalPreventDefault = evnt.preventDefault,
+ appWindow = window,
+ fakeProcessDefault = true,
+ finalProcessDefault;
+
+ evnt.preventDefault = function() {
+ fakeProcessDefault = false;
+ return originalPreventDefault.apply(evnt, arguments);
+ };
+
+ var x = 0, y = 0;
+ evnt.initMouseEvent(type, true, true, window, 0, x, y, x, y, false, false,
+ false, false, 0, relatedTarget);
+
+ element.dispatchEvent(evnt);
+ };
+ fireEvent('mouseout', from[0], to[0]);
+ fireEvent('mouseover', to[0], from[0]);
+ }
afterEach(function() {
dealoc(root);
@@ -1215,30 +1239,8 @@ describe('jqLite', function() {
it('should fire mouseenter when coming from outside the browser window', function() {
if (window.jQuery) return;
- var browserMoveTrigger = function(from, to) {
- var fireEvent = function(type, element, relatedTarget) {
- var evnt;
- evnt = document.createEvent('MouseEvents');
-
- var originalPreventDefault = evnt.preventDefault,
- appWindow = window,
- fakeProcessDefault = true,
- finalProcessDefault;
-
- evnt.preventDefault = function() {
- fakeProcessDefault = false;
- return originalPreventDefault.apply(evnt, arguments);
- };
-
- var x = 0, y = 0;
- evnt.initMouseEvent(type, true, true, window, 0, x, y, x, y, false, false,
- false, false, 0, relatedTarget);
-
- element.dispatchEvent(evnt);
- };
- fireEvent('mouseout', from[0], to[0]);
- fireEvent('mouseover', to[0], from[0]);
- };
+
+ setup('
', 'p', 'span');
browserMoveTrigger(root, parent);
expect(log).toEqual('parentEnter;');
@@ -1253,6 +1255,28 @@ describe('jqLite', function() {
expect(log).toEqual('parentEnter;childEnter;childLeave;parentLeave;');
});
+
+ it('should fire the mousenter on SVG elements', function() {
+ if (window.jQuery) return;
+
+ setup(
+ '
' +
+ '
' +
+ ' ' +
+ '
',
+ 'svg', 'path');
+
+ browserMoveTrigger(parent, child);
+ expect(log).toEqual('childEnter;');
+ });
});
// Only run this test for jqLite and not normal jQuery
@@ -1407,6 +1431,60 @@ describe('jqLite', function() {
});
+ it('should correctly deregister the mouseenter/mouseleave listeners', function() {
+ var aElem = jqLite(a);
+ var onMouseenter = jasmine.createSpy('onMouseenter');
+ var onMouseleave = jasmine.createSpy('onMouseleave');
+
+ aElem.on('mouseenter', onMouseenter);
+ aElem.on('mouseleave', onMouseleave);
+ aElem.off('mouseenter', onMouseenter);
+ aElem.off('mouseleave', onMouseleave);
+ aElem.on('mouseenter', onMouseenter);
+ aElem.on('mouseleave', onMouseleave);
+
+ browserTrigger(a, 'mouseover', {relatedTarget: b});
+ expect(onMouseenter).toHaveBeenCalledOnce();
+
+ browserTrigger(a, 'mouseout', {relatedTarget: b});
+ expect(onMouseleave).toHaveBeenCalledOnce();
+ });
+
+
+ it('should call a `mouseenter/leave` listener only once when `mouseenter/leave` and `mouseover/out` '
+ + 'are triggered simultaneously', function() {
+ var aElem = jqLite(a);
+ var onMouseenter = jasmine.createSpy('mouseenter');
+ var onMouseleave = jasmine.createSpy('mouseleave');
+
+ aElem.on('mouseenter', onMouseenter);
+ aElem.on('mouseleave', onMouseleave);
+
+ browserTrigger(a, 'mouseenter', {relatedTarget: b});
+ browserTrigger(a, 'mouseover', {relatedTarget: b});
+ expect(onMouseenter).toHaveBeenCalledOnce();
+
+ browserTrigger(a, 'mouseleave', {relatedTarget: b});
+ browserTrigger(a, 'mouseout', {relatedTarget: b});
+ expect(onMouseleave).toHaveBeenCalledOnce();
+ });
+
+ it('should call a `mouseenter/leave` listener when manually triggering the event', function() {
+ var aElem = jqLite(a);
+ var onMouseenter = jasmine.createSpy('mouseenter');
+ var onMouseleave = jasmine.createSpy('mouseleave');
+
+ aElem.on('mouseenter', onMouseenter);
+ aElem.on('mouseleave', onMouseleave);
+
+ aElem.triggerHandler('mouseenter');
+ expect(onMouseenter).toHaveBeenCalledOnce();
+
+ aElem.triggerHandler('mouseleave');
+ expect(onMouseleave).toHaveBeenCalledOnce();
+ });
+
+
it('should deregister specific listener within the listener and call subsequent listeners', function() {
var aElem = jqLite(a),
clickSpy = jasmine.createSpy('click'),
diff --git a/test/ng/animateCssSpec.js b/test/ng/animateCssSpec.js
index 52b697ba2834..dcc37b7fc9c9 100644
--- a/test/ng/animateCssSpec.js
+++ b/test/ng/animateCssSpec.js
@@ -16,6 +16,43 @@ describe("$animateCss", function() {
describe("without animation", function() {
+ it("should not alter the provided options input in any way", inject(function($animateCss) {
+ var initialOptions = {
+ from: { height: '50px' },
+ to: { width: '50px' },
+ addClass: 'one',
+ removeClass: 'two'
+ };
+
+ var copiedOptions = copy(initialOptions);
+
+ expect(copiedOptions).toEqual(initialOptions);
+ $animateCss(element, copiedOptions).start();
+ expect(copiedOptions).toEqual(initialOptions);
+ }));
+
+ it("should not create a copy of the provided options if they have already been prepared earlier",
+ inject(function($animateCss, $$rAF) {
+
+ var options = {
+ from: { height: '50px' },
+ to: { width: '50px' },
+ addClass: 'one',
+ removeClass: 'two'
+ };
+
+ options.$$prepared = true;
+ var runner = $animateCss(element, options).start();
+ runner.end();
+
+ $$rAF.flush();
+
+ expect(options.addClass).toBeFalsy();
+ expect(options.removeClass).toBeFalsy();
+ expect(options.to).toBeFalsy();
+ expect(options.from).toBeFalsy();
+ }));
+
it("should apply the provided [from] CSS to the element", inject(function($animateCss) {
$animateCss(element, { from: { height: '50px' }}).start();
expect(element.css('height')).toBe('50px');
@@ -115,6 +152,38 @@ describe("$animateCss", function() {
expect(cancelSpy).toHaveBeenCalled();
expect(doneSpy).not.toHaveBeenCalled();
}));
+
+ it("should not bother applying the provided [from] and [to] styles to the element if [cleanupStyles] is present",
+ inject(function($animateCss, $rootScope) {
+
+ var animator = $animateCss(element, {
+ cleanupStyles: true,
+ from: { width: '100px' },
+ to: { width: '900px', height: '1000px' }
+ });
+
+ assertStyleIsEmpty(element, 'width');
+ assertStyleIsEmpty(element, 'height');
+
+ var runner = animator.start();
+
+ assertStyleIsEmpty(element, 'width');
+ assertStyleIsEmpty(element, 'height');
+
+ triggerRAF();
+
+ assertStyleIsEmpty(element, 'width');
+ assertStyleIsEmpty(element, 'height');
+
+ runner.end();
+
+ assertStyleIsEmpty(element, 'width');
+ assertStyleIsEmpty(element, 'height');
+
+ function assertStyleIsEmpty(element, prop) {
+ expect(element[0].style.getPropertyValue(prop)).toBeFalsy();
+ }
+ }));
});
});
diff --git a/test/ngAnimate/animateRunnerSpec.js b/test/ng/animateRunnerSpec.js
similarity index 90%
rename from test/ngAnimate/animateRunnerSpec.js
rename to test/ng/animateRunnerSpec.js
index f4526d8abb57..622da76ff22b 100644
--- a/test/ngAnimate/animateRunnerSpec.js
+++ b/test/ng/animateRunnerSpec.js
@@ -1,8 +1,8 @@
'use strict';
-describe('$$animateAsyncRun', function() {
- beforeEach(module('ngAnimate'));
+/* jshint newcap: false */
+describe('$$animateAsyncRun', function() {
it('should fire the callback only when one or more RAFs have passed',
inject(function($$animateAsyncRun, $$rAF) {
@@ -32,9 +32,6 @@ describe('$$animateAsyncRun', function() {
});
describe("$$AnimateRunner", function() {
-
- beforeEach(module('ngAnimate'));
-
they("should trigger the host $prop function",
['end', 'cancel', 'pause', 'resume'], function(method) {
@@ -165,6 +162,43 @@ describe("$$AnimateRunner", function() {
expect(animationFailed).toBe(true);
}));
+ it("should use timeouts to trigger async operations when the document is hidden", function() {
+ var doc;
+
+ module(function($provide) {
+ doc = jqLite({
+ body: document.body,
+ hidden: true
+ });
+ $provide.value('$document', doc);
+ });
+
+ inject(function($$AnimateRunner, $rootScope, $$rAF, $timeout) {
+ var spy = jasmine.createSpy();
+ var runner = new $$AnimateRunner();
+ runner.done(spy);
+ runner.complete(true);
+ expect(spy).not.toHaveBeenCalled();
+ $$rAF.flush();
+ expect(spy).not.toHaveBeenCalled();
+ $timeout.flush();
+ expect(spy).toHaveBeenCalled();
+
+ doc[0].hidden = false;
+
+ spy = jasmine.createSpy();
+ runner = new $$AnimateRunner();
+ runner.done(spy);
+ runner.complete(true);
+ expect(spy).not.toHaveBeenCalled();
+ $$rAF.flush();
+ expect(spy).toHaveBeenCalled();
+ expect(function() {
+ $timeout.flush();
+ }).toThrow();
+ });
+ });
+
they("should expose the `finally` promise function to handle the final state when $prop",
{ 'rejected': 'cancel', 'resolved': 'end' }, function(method) {
inject(function($$AnimateRunner, $rootScope) {
diff --git a/test/ng/animateSpec.js b/test/ng/animateSpec.js
index 76fae5ebcaa6..29f4d9c9adcc 100644
--- a/test/ng/animateSpec.js
+++ b/test/ng/animateSpec.js
@@ -122,7 +122,7 @@ describe("$animate", function() {
});
inject(function() {
// by using hasOwnProperty we know for sure that the lookup object is an empty object
- // instead of inhertiting properties from its original prototype.
+ // instead of inheriting properties from its original prototype.
expect(provider.$$registeredAnimations.hasOwnProperty).toBeFalsy();
provider.register('.filter', noop);
@@ -378,6 +378,27 @@ describe("$animate", function() {
});
});
+ it("should not alter the provided options input in any way throughout the animation", inject(function($animate, $rootElement, $rootScope) {
+ var element = jqLite('
');
+ var parent = $rootElement;
+
+ var initialOptions = {
+ from: { height: '50px' },
+ to: { width: '50px' },
+ addClass: 'one',
+ removeClass: 'two'
+ };
+
+ var copiedOptions = copy(initialOptions);
+ expect(copiedOptions).toEqual(initialOptions);
+
+ var runner = $animate.enter(element, parent, null, copiedOptions);
+ expect(copiedOptions).toEqual(initialOptions);
+
+ $rootScope.$digest();
+ expect(copiedOptions).toEqual(initialOptions);
+ }));
+
describe('CSS class DOM manipulation', function() {
var element;
var addClass;
diff --git a/test/ng/cacheFactorySpec.js b/test/ng/cacheFactorySpec.js
index 7159484d68d4..cb65a1740679 100644
--- a/test/ng/cacheFactorySpec.js
+++ b/test/ng/cacheFactorySpec.js
@@ -133,6 +133,19 @@ describe('$cacheFactory', function() {
expect(cache.info().size).toBe(0);
}));
+ it('should only decrement size when an element is actually removed via remove', inject(function($cacheFactory) {
+ cache.put('foo', 'bar');
+ expect(cache.info().size).toBe(1);
+
+ cache.remove('undefined');
+ expect(cache.info().size).toBe(1);
+
+ cache.remove('hasOwnProperty');
+ expect(cache.info().size).toBe(1);
+
+ cache.remove('foo');
+ expect(cache.info().size).toBe(0);
+ }));
it('should return cache id', inject(function($cacheFactory) {
expect(cache.info().id).toBe('test');
diff --git a/test/ng/compileSpec.js b/test/ng/compileSpec.js
index ef5787b49fa0..92c402335580 100755
--- a/test/ng/compileSpec.js
+++ b/test/ng/compileSpec.js
@@ -230,6 +230,9 @@ describe('$compile', function() {
describe('svg namespace transcludes', function() {
+ var ua = window.navigator.userAgent;
+ var isEdge = /Edge/.test(ua);
+
// this method assumes some sort of sized SVG element is being inspected.
function assertIsValidSvgCircle(elem) {
expect(isUnknownElement(elem)).toBe(false);
@@ -300,17 +303,19 @@ describe('$compile', function() {
}));
// NOTE: This test may be redundant.
- it('should handle custom svg containers that transclude to foreignObject' +
- ' that transclude to custom svg containers that transclude to custom elements', inject(function() {
- element = jqLite('
' +
- '
');
- $compile(element.contents())($rootScope);
- document.body.appendChild(element[0]);
-
- var circle = element.find('circle');
- assertIsValidSvgCircle(circle[0]);
- }));
+ if (!isEdge) {
+ it('should handle custom svg containers that transclude to foreignObject' +
+ ' that transclude to custom svg containers that transclude to custom elements', inject(function() {
+ element = jqLite('
' +
+ '
');
+ $compile(element.contents())($rootScope);
+ document.body.appendChild(element[0]);
+
+ var circle = element.find('circle');
+ assertIsValidSvgCircle(circle[0]);
+ }));
+ }
}
it('should handle directives with templates that manually add the transclude further down', inject(function() {
@@ -947,6 +952,14 @@ describe('$compile', function() {
expect(child).toHaveClass('log'); // merged from replace directive template
}));
+ it('should interpolate the values once per digest',
+ inject(function($compile, $rootScope, log) {
+ element = $compile('
{{log("A")}} foo {{::log("B")}}
')($rootScope);
+ $rootScope.log = log;
+ $rootScope.$digest();
+ expect(log).toEqual('A; B; A; B');
+ }));
+
it('should update references to replaced jQuery context', function() {
module(function($compileProvider) {
$compileProvider.directive('foo', function() {
@@ -2662,6 +2675,24 @@ describe('$compile', function() {
expect(element.isolateScope()['watch']).toBe('watch');
})
);
+
+ it('should handle @ bindings on BOOLEAN attributes', function() {
+ var checkedVal;
+ module(function($compileProvider) {
+ $compileProvider.directive('test', function() {
+ return {
+ scope: { checked: '@' },
+ link: function(scope, element, attrs) {
+ checkedVal = scope.checked;
+ }
+ };
+ });
+ });
+ inject(function($compile, $rootScope) {
+ $compile('
')($rootScope);
+ expect(checkedVal).toEqual(true);
+ });
+ });
});
@@ -3087,6 +3118,54 @@ describe('$compile', function() {
});
+ it('should support custom start interpolation symbol, even when `endSymbol` doesn\'t change',
+ function() {
+ module(function($compileProvider, $interpolateProvider) {
+ $interpolateProvider.startSymbol('[[');
+ $compileProvider.directive('myDirective', function() {
+ return {
+ template: '
{{ hello }}|{{ hello | uppercase }} '
+ };
+ });
+ });
+
+ inject(function($compile, $rootScope) {
+ var tmpl = '
';
+ element = $compile(tmpl)($rootScope);
+
+ $rootScope.hello = 'ahoj';
+ $rootScope.$digest();
+
+ expect(element.text()).toBe('AHOJ|ahoj|AHOJ');
+ });
+ }
+ );
+
+
+ it('should support custom end interpolation symbol, even when `startSymbol` doesn\'t change',
+ function() {
+ module(function($compileProvider, $interpolateProvider) {
+ $interpolateProvider.endSymbol(']]');
+ $compileProvider.directive('myDirective', function() {
+ return {
+ template: '
{{ hello }}|{{ hello | uppercase }} '
+ };
+ });
+ });
+
+ inject(function($compile, $rootScope) {
+ var tmpl = '
';
+ element = $compile(tmpl)($rootScope);
+
+ $rootScope.hello = 'ahoj';
+ $rootScope.$digest();
+
+ expect(element.text()).toBe('AHOJ|ahoj|AHOJ');
+ });
+ }
+ );
+
+
it('should support custom start/end interpolation symbols in async directive template',
function() {
module(function($interpolateProvider, $compileProvider) {
@@ -3577,6 +3656,22 @@ describe('$compile', function() {
});
});
+ it('should be able to interpolate attribute names which are present in Object.prototype', function() {
+ var attrs;
+ module(function() {
+ directive('attrExposer', valueFn({
+ link: function($scope, $element, $attrs) {
+ attrs = $attrs;
+ }
+ }));
+ });
+ inject(function($compile, $rootScope) {
+ $compile('
')($rootScope);
+ $rootScope.$apply();
+ expect(attrs.toString).toBe('2');
+ });
+ });
+
it('should not initialize scope value if optional expression binding is not passed', inject(function($compile) {
compile('
');
@@ -3909,7 +4004,7 @@ describe('$compile', function() {
compile('
');
- //change both sides to the same item withing the same digest cycle
+ //change both sides to the same item within the same digest cycle
componentScope.ref = 'same';
$rootScope.name = 'same';
$rootScope.$apply();
@@ -3929,8 +4024,8 @@ describe('$compile', function() {
expect(componentScope.ref).toBe('hello world');
componentScope.ref = 'ignore me';
- expect($rootScope.$apply).
- toThrowMinErr("$compile", "nonassign", "Expression ''hello ' + name' used with directive 'myComponent' is non-assignable!");
+ expect(function() { $rootScope.$apply(); }).
+ toThrowMinErr("$compile", "nonassign", "Expression ''hello ' + name' in attribute 'ref' used with directive 'myComponent' is non-assignable!");
expect(componentScope.ref).toBe('hello world');
// reset since the exception was rethrown which prevented phase clearing
$rootScope.$$phase = null;
@@ -3940,6 +4035,21 @@ describe('$compile', function() {
expect(componentScope.ref).toBe('hello misko');
}));
+ it('should complain if assigning to undefined', inject(function() {
+ compile('');
+ $rootScope.$apply();
+ expect(componentScope.ref).toBeUndefined();
+
+ componentScope.ref = 'ignore me';
+ expect(function() { $rootScope.$apply(); }).
+ toThrowMinErr("$compile", "nonassign", "Expression 'undefined' in attribute 'ref' used with directive 'myComponent' is non-assignable!");
+ expect(componentScope.ref).toBeUndefined();
+
+ $rootScope.$$phase = null; // reset since the exception was rethrown which prevented phase clearing
+ $rootScope.$apply();
+ expect(componentScope.ref).toBeUndefined();
+ }));
+
// regression
it('should stabilize model', inject(function() {
compile('');
@@ -3989,7 +4099,7 @@ describe('$compile', function() {
componentScope.reference = {name: 'b'};
expect(function() {
$rootScope.$apply();
- }).toThrowMinErr("$compile", "nonassign", "Expression '{name: name}' used with directive 'myComponent' is non-assignable!");
+ }).toThrowMinErr("$compile", "nonassign", "Expression '{name: name}' in attribute 'reference' used with directive 'myComponent' is non-assignable!");
}));
@@ -4390,6 +4500,301 @@ describe('$compile', function() {
});
+ it('should bind to multiple directives controllers via object notation (no scope)', function() {
+ var controller1Called = false;
+ var controller2Called = false;
+ module(function($compileProvider, $controllerProvider) {
+ $compileProvider.directive('foo', valueFn({
+ bindToController: {
+ 'data': '=fooData',
+ 'str': '@fooStr',
+ 'fn': '&fooFn'
+ },
+ controllerAs: 'fooCtrl',
+ controller: function() {
+ expect(this.data).toEqualData({'foo': 'bar', 'baz': 'biz'});
+ expect(this.str).toBe('Hello, world!');
+ expect(this.fn()).toBe('called!');
+ controller1Called = true;
+ }
+ }));
+ $compileProvider.directive('bar', valueFn({
+ bindToController: {
+ 'data': '=barData',
+ 'str': '@barStr',
+ 'fn': '&barFn'
+ },
+ controllerAs: 'barCtrl',
+ controller: function() {
+ expect(this.data).toEqualData({'foo2': 'bar2', 'baz2': 'biz2'});
+ expect(this.str).toBe('Hello, second world!');
+ expect(this.fn()).toBe('second called!');
+ controller2Called = true;
+ }
+ }));
+ });
+ inject(function($compile, $rootScope) {
+ $rootScope.fn = valueFn('called!');
+ $rootScope.string = 'world';
+ $rootScope.data = {'foo': 'bar','baz': 'biz'};
+ $rootScope.fn2 = valueFn('second called!');
+ $rootScope.string2 = 'second world';
+ $rootScope.data2 = {'foo2': 'bar2', 'baz2': 'biz2'};
+ element = $compile(
+ ' ' +
+ '
')($rootScope);
+ $rootScope.$digest();
+ expect(controller1Called).toBe(true);
+ expect(controller2Called).toBe(true);
+ });
+ });
+
+
+ it('should bind to multiple directives controllers via object notation (new iso scope)', function() {
+ var controller1Called = false;
+ var controller2Called = false;
+ module(function($compileProvider, $controllerProvider) {
+ $compileProvider.directive('foo', valueFn({
+ bindToController: {
+ 'data': '=fooData',
+ 'str': '@fooStr',
+ 'fn': '&fooFn'
+ },
+ scope: {},
+ controllerAs: 'fooCtrl',
+ controller: function() {
+ expect(this.data).toEqualData({'foo': 'bar', 'baz': 'biz'});
+ expect(this.str).toBe('Hello, world!');
+ expect(this.fn()).toBe('called!');
+ controller1Called = true;
+ }
+ }));
+ $compileProvider.directive('bar', valueFn({
+ bindToController: {
+ 'data': '=barData',
+ 'str': '@barStr',
+ 'fn': '&barFn'
+ },
+ controllerAs: 'barCtrl',
+ controller: function() {
+ expect(this.data).toEqualData({'foo2': 'bar2', 'baz2': 'biz2'});
+ expect(this.str).toBe('Hello, second world!');
+ expect(this.fn()).toBe('second called!');
+ controller2Called = true;
+ }
+ }));
+ });
+ inject(function($compile, $rootScope) {
+ $rootScope.fn = valueFn('called!');
+ $rootScope.string = 'world';
+ $rootScope.data = {'foo': 'bar','baz': 'biz'};
+ $rootScope.fn2 = valueFn('second called!');
+ $rootScope.string2 = 'second world';
+ $rootScope.data2 = {'foo2': 'bar2', 'baz2': 'biz2'};
+ element = $compile(
+ ' ' +
+ '
')($rootScope);
+ $rootScope.$digest();
+ expect(controller1Called).toBe(true);
+ expect(controller2Called).toBe(true);
+ });
+ });
+
+
+ it('should bind to multiple directives controllers via object notation (new scope)', function() {
+ var controller1Called = false;
+ var controller2Called = false;
+ module(function($compileProvider, $controllerProvider) {
+ $compileProvider.directive('foo', valueFn({
+ bindToController: {
+ 'data': '=fooData',
+ 'str': '@fooStr',
+ 'fn': '&fooFn'
+ },
+ scope: true,
+ controllerAs: 'fooCtrl',
+ controller: function() {
+ expect(this.data).toEqualData({'foo': 'bar', 'baz': 'biz'});
+ expect(this.str).toBe('Hello, world!');
+ expect(this.fn()).toBe('called!');
+ controller1Called = true;
+ }
+ }));
+ $compileProvider.directive('bar', valueFn({
+ bindToController: {
+ 'data': '=barData',
+ 'str': '@barStr',
+ 'fn': '&barFn'
+ },
+ scope: true,
+ controllerAs: 'barCtrl',
+ controller: function() {
+ expect(this.data).toEqualData({'foo2': 'bar2', 'baz2': 'biz2'});
+ expect(this.str).toBe('Hello, second world!');
+ expect(this.fn()).toBe('second called!');
+ controller2Called = true;
+ }
+ }));
+ });
+ inject(function($compile, $rootScope) {
+ $rootScope.fn = valueFn('called!');
+ $rootScope.string = 'world';
+ $rootScope.data = {'foo': 'bar','baz': 'biz'};
+ $rootScope.fn2 = valueFn('second called!');
+ $rootScope.string2 = 'second world';
+ $rootScope.data2 = {'foo2': 'bar2', 'baz2': 'biz2'};
+ element = $compile(
+ ' ' +
+ '
')($rootScope);
+ $rootScope.$digest();
+ expect(controller1Called).toBe(true);
+ expect(controller2Called).toBe(true);
+ });
+ });
+
+
+ it('should evaluate against the correct scope, when using `bindToController` (new scope)',
+ function() {
+ module(function($compileProvider, $controllerProvider) {
+ $controllerProvider.register({
+ 'ParentCtrl': function() {
+ this.value1 = 'parent1';
+ this.value2 = 'parent2';
+ this.value3 = function() { return 'parent3'; };
+ },
+ 'ChildCtrl': function() {
+ this.value1 = 'child1';
+ this.value2 = 'child2';
+ this.value3 = function() { return 'child3'; };
+ }
+ });
+
+ $compileProvider.directive('child', valueFn({
+ scope: true,
+ controller: 'ChildCtrl as ctrl',
+ bindToController: {
+ fromParent1: '@',
+ fromParent2: '=',
+ fromParent3: '&'
+ },
+ template: ''
+ }));
+ });
+
+ inject(function($compile, $rootScope) {
+ element = $compile(
+ '' +
+ '' +
+ ' ' +
+ '
')($rootScope);
+ $rootScope.$digest();
+
+ var parentCtrl = element.controller('ngController');
+ var childCtrl = element.find('child').controller('child');
+
+ expect(childCtrl.fromParent1).toBe(parentCtrl.value1);
+ expect(childCtrl.fromParent1).not.toBe(childCtrl.value1);
+ expect(childCtrl.fromParent2).toBe(parentCtrl.value2);
+ expect(childCtrl.fromParent2).not.toBe(childCtrl.value2);
+ expect(childCtrl.fromParent3()()).toBe(parentCtrl.value3());
+ expect(childCtrl.fromParent3()()).not.toBe(childCtrl.value3());
+
+ childCtrl.fromParent2 = 'modified';
+ $rootScope.$digest();
+
+ expect(parentCtrl.value2).toBe('modified');
+ expect(childCtrl.value2).toBe('child2');
+ });
+ }
+ );
+
+
+ it('should evaluate against the correct scope, when using `bindToController` (new iso scope)',
+ function() {
+ module(function($compileProvider, $controllerProvider) {
+ $controllerProvider.register({
+ 'ParentCtrl': function() {
+ this.value1 = 'parent1';
+ this.value2 = 'parent2';
+ this.value3 = function() { return 'parent3'; };
+ },
+ 'ChildCtrl': function() {
+ this.value1 = 'child1';
+ this.value2 = 'child2';
+ this.value3 = function() { return 'child3'; };
+ }
+ });
+
+ $compileProvider.directive('child', valueFn({
+ scope: {},
+ controller: 'ChildCtrl as ctrl',
+ bindToController: {
+ fromParent1: '@',
+ fromParent2: '=',
+ fromParent3: '&'
+ },
+ template: ''
+ }));
+ });
+
+ inject(function($compile, $rootScope) {
+ element = $compile(
+ '' +
+ '' +
+ ' ' +
+ '
')($rootScope);
+ $rootScope.$digest();
+
+ var parentCtrl = element.controller('ngController');
+ var childCtrl = element.find('child').controller('child');
+
+ expect(childCtrl.fromParent1).toBe(parentCtrl.value1);
+ expect(childCtrl.fromParent1).not.toBe(childCtrl.value1);
+ expect(childCtrl.fromParent2).toBe(parentCtrl.value2);
+ expect(childCtrl.fromParent2).not.toBe(childCtrl.value2);
+ expect(childCtrl.fromParent3()()).toBe(parentCtrl.value3());
+ expect(childCtrl.fromParent3()()).not.toBe(childCtrl.value3());
+
+ childCtrl.fromParent2 = 'modified';
+ $rootScope.$digest();
+
+ expect(parentCtrl.value2).toBe('modified');
+ expect(childCtrl.value2).toBe('child2');
+ });
+ }
+ );
+
+
it('should put controller in scope when controller identifier present but not using controllerAs', function() {
var controllerCalled = false;
var myCtrl;
@@ -5612,6 +6017,62 @@ describe('$compile', function() {
});
});
+ //see issue https://github.com/angular/angular.js/issues/12936
+ it('should use the proper scope when it is on the root element of a replaced directive template', function() {
+ module(function() {
+ directive('isolate', valueFn({
+ scope: {},
+ replace: true,
+ template: '{{x}}
',
+ link: function(scope, element, attr, ctrl) {
+ scope.x = 'iso';
+ }
+ }));
+ directive('trans', valueFn({
+ transclude: 'content',
+ link: function(scope, element, attr, ctrl, $transclude) {
+ $transclude(function(clone) {
+ element.append(clone);
+ });
+ }
+ }));
+ });
+ inject(function($rootScope, $compile) {
+ element = $compile('{{x}}
',
+ link: function(scope, element, attr, ctrl) {
+ scope.x = 'child';
+ }
+ }));
+ directive('trans', valueFn({
+ transclude: 'content',
+ link: function(scope, element, attr, ctrl, $transclude) {
+ $transclude(function(clone) {
+ element.append(clone);
+ });
+ }
+ }));
+ });
+ inject(function($rootScope, $compile) {
+ element = $compile('
'
+ };
+ });
+ $provide.decorator('fooDirective', function($delegate) {
+ var directive = $delegate[0];
+ directive.scope.something = '=';
+ directive.template = '{{something}} ';
+ return $delegate;
+ });
+ });
+ inject(function($compile, $rootScope) {
+ element = $compile('')($rootScope);
+ $rootScope.bar = 'bar';
+ $rootScope.$digest();
+ expect(element.text()).toBe('bar');
+ });
+ });
+
+
+ it('should distinguish different bindings with the same binding name', function() {
+ module(function() {
+ directive('foo', function() {
+ return {
+ scope: {
+ foo: '=',
+ bar: '='
+ },
+ template: ''
+ };
+ });
+ });
+ inject(function($compile, $rootScope) {
+ element = $compile('')($rootScope);
+ $rootScope.$digest();
+ expect(element.text()).toBe('foobar');
+ });
+ });
+
+
it('should safely create transclude comment node and not break with "-->"',
inject(function($rootScope) {
// see: https://github.com/angular/angular.js/issues/1740
@@ -7096,6 +7602,27 @@ describe('$compile', function() {
describe('img[srcset] sanitization', function() {
+ it('should not error if undefined', function() {
+ var linked = false;
+ module(function() {
+ directive('setter', valueFn(function(scope, elem, attrs) {
+ attrs.$set('srcset', 'http://example.com/');
+ expect(attrs.srcset).toBe('http://example.com/');
+
+ attrs.$set('srcset', undefined);
+ expect(attrs.srcset).toBeUndefined();
+
+ linked = true;
+ }));
+ });
+ inject(function($compile, $rootScope) {
+ element = $compile('')($rootScope);
+
+ expect(function() {
+ $rootScope.$digest();
+ }).toThrow();
+ }));
+ }
+
if (isDefined(window.SVGElement)) {
describe('SVGAElement', function() {
it('should interpolate the expression and bind to xlink:href', inject(function($compile, $rootScope) {
diff --git a/test/ng/directive/formSpec.js b/test/ng/directive/formSpec.js
index 95a0fdeb1cc7..500be66d25d3 100644
--- a/test/ng/directive/formSpec.js
+++ b/test/ng/directive/formSpec.js
@@ -885,7 +885,7 @@ describe('form', function() {
expect(doc.hasClass('ng-valid-another')).toBe(true);
expect(doc.hasClass('ng-invalid-another')).toBe(false);
- // validators are skipped, e.g. becuase of a parser error
+ // validators are skipped, e.g. because of a parser error
control.$setValidity('error', null);
control.$setValidity('another', null);
scope.$digest();
diff --git a/test/ng/directive/inputSpec.js b/test/ng/directive/inputSpec.js
index 053c64931cfe..9dc40d93e09d 100644
--- a/test/ng/directive/inputSpec.js
+++ b/test/ng/directive/inputSpec.js
@@ -72,6 +72,25 @@ describe('input', function() {
expect($rootScope.form.$$renameControl).not.toHaveBeenCalled();
});
+
+ it('should not set the `val` property when the value is equal to the current value', inject(function($rootScope, $compile) {
+ // This is a workaround for Firefox validation. Look at #12102.
+ var input = jqLite('hello
');
}));
+ it('should update html', inject(function($rootScope, $compile, $sce) {
+ element = $compile('
')($rootScope);
+ $rootScope.html = 'hello';
+ $rootScope.$digest();
+ expect(angular.lowercase(element.html())).toEqual('hello');
+ $rootScope.html = 'goodbye';
+ $rootScope.$digest();
+ expect(angular.lowercase(element.html())).toEqual('goodbye');
+ }));
+
it('should one-time bind if the expression starts with two colons', inject(function($rootScope, $compile) {
element = $compile('
')($rootScope);
$rootScope.html = 'hello
';
@@ -176,7 +186,18 @@ describe('ngBind*', function() {
expect(angular.lowercase(element.html())).toEqual('hello
');
}));
- it('should watch the string value to avoid infinite recursion', inject(function($rootScope, $compile, $sce) {
+ it('should update html', inject(function($rootScope, $compile, $sce) {
+ element = $compile('
')($rootScope);
+ $rootScope.html = $sce.trustAsHtml('hello');
+ $rootScope.$digest();
+ expect(angular.lowercase(element.html())).toEqual('hello');
+ $rootScope.html = $sce.trustAsHtml('goodbye');
+ $rootScope.$digest();
+ expect(angular.lowercase(element.html())).toEqual('goodbye');
+ }));
+
+ it('should not cause infinite recursion for trustAsHtml object watches',
+ inject(function($rootScope, $compile, $sce) {
// Ref: https://github.com/angular/angular.js/issues/3932
// If the binding is a function that creates a new value on every call via trustAs, we'll
// trigger an infinite digest if we don't take care of it.
@@ -188,6 +209,33 @@ describe('ngBind*', function() {
expect(angular.lowercase(element.html())).toEqual('hello
');
}));
+ it('should handle custom $sce objects', function() {
+ function MySafeHtml(val) { this.val = val; }
+
+ module(function($provide) {
+ $provide.decorator('$sce', function($delegate) {
+ $delegate.trustAsHtml = function(html) { return new MySafeHtml(html); };
+ $delegate.getTrustedHtml = function(mySafeHtml) { return mySafeHtml.val; };
+ $delegate.valueOf = function(v) { return v instanceof MySafeHtml ? v.val : v; };
+ return $delegate;
+ });
+ });
+
+ inject(function($rootScope, $compile, $sce) {
+ // Ref: https://github.com/angular/angular.js/issues/14526
+ // Previous code used toString for change detection, which fails for custom objects
+ // that don't override toString.
+ element = $compile('
')($rootScope);
+ var html = 'hello';
+ $rootScope.getHtml = function() { return $sce.trustAsHtml(html); };
+ $rootScope.$digest();
+ expect(angular.lowercase(element.html())).toEqual('hello');
+ html = 'goodbye';
+ $rootScope.$digest();
+ expect(angular.lowercase(element.html())).toEqual('goodbye');
+ });
+ });
+
describe('when $sanitize is available', function() {
beforeEach(function() { module('ngSanitize'); });
diff --git a/test/ng/directive/ngClassSpec.js b/test/ng/directive/ngClassSpec.js
index a188ba129356..1d7cd1b56f16 100644
--- a/test/ng/directive/ngClassSpec.js
+++ b/test/ng/directive/ngClassSpec.js
@@ -409,6 +409,22 @@ describe('ngClass', function() {
expect(e2.hasClass('even')).toBeTruthy();
expect(e2.hasClass('odd')).toBeFalsy();
}));
+
+ it('should support mixed array/object variable with a mutating object',
+ inject(function($rootScope, $compile) {
+ element = $compile('
')($rootScope);
+
+ $rootScope.classVar = [{orange: true}];
+ $rootScope.$digest();
+ expect(element).toHaveClass('orange');
+
+ $rootScope.classVar[0].orange = false;
+ $rootScope.$digest();
+
+ expect(element).not.toHaveClass('orange');
+ })
+ );
+
});
describe('ngClass animations', function() {
@@ -468,12 +484,12 @@ describe('ngClass animations', function() {
};
});
});
- inject(function($compile, $rootScope, $browser, $rootElement, $animate, $timeout, $$body) {
+ inject(function($compile, $rootScope, $browser, $rootElement, $animate, $document) {
$animate.enabled(true);
$rootScope.val = 'crazy';
element = angular.element('
');
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
$compile(element)($rootScope);
diff --git a/test/ng/directive/ngIncludeSpec.js b/test/ng/directive/ngIncludeSpec.js
index a9725f8769ee..1625e31d64de 100644
--- a/test/ng/directive/ngIncludeSpec.js
+++ b/test/ng/directive/ngIncludeSpec.js
@@ -398,6 +398,26 @@ describe('ngInclude', function() {
});
+ it('should not compile template if original scope is destroyed', function() {
+ module(function($provide) {
+ $provide.decorator('$compile', function($delegate) {
+ return jasmine.createSpy('$compile').andCallFake($delegate);
+ });
+ });
+ inject(function($rootScope, $httpBackend, $compile) {
+ $httpBackend.when('GET', 'url').respond('template text');
+ $rootScope.show = true;
+ element = $compile('')($rootScope);
+ $rootScope.$digest();
+ $rootScope.show = false;
+ $rootScope.$digest();
+ $compile.reset();
+ $httpBackend.flush();
+ expect($compile).not.toHaveBeenCalled();
+ });
+ });
+
+
describe('autoscroll', function() {
var autoScrollSpy;
diff --git a/test/ng/directive/ngListSpec.js b/test/ng/directive/ngListSpec.js
index dd06913ba029..040cda370e0d 100644
--- a/test/ng/directive/ngListSpec.js
+++ b/test/ng/directive/ngListSpec.js
@@ -133,7 +133,7 @@ describe('ngList', function() {
});
it("should support splitting on newlines", function() {
- helper.compileInput('');
helper.changeInputValueTo('a\nb');
expect($rootScope.list).toEqual(['a','b']);
});
diff --git a/test/ng/directive/ngModelSpec.js b/test/ng/directive/ngModelSpec.js
index b45ea2e0c0e0..18482978054b 100644
--- a/test/ng/directive/ngModelSpec.js
+++ b/test/ng/directive/ngModelSpec.js
@@ -906,7 +906,7 @@ describe('ngModel', function() {
expect(function() {
scope.$apply('value = "123"');
- }).toThrowMinErr("ngModel", "$asyncValidators",
+ }).toThrowMinErr("ngModel", "nopromise",
"Expected asynchronous validator to return a promise but got 'true' instead.");
}));
diff --git a/test/ng/directive/ngOptionsSpec.js b/test/ng/directive/ngOptionsSpec.js
index 40cb245253d5..7a59aeda9311 100644
--- a/test/ng/directive/ngOptionsSpec.js
+++ b/test/ng/directive/ngOptionsSpec.js
@@ -2,7 +2,7 @@
describe('ngOptions', function() {
- var scope, formElement, element, $compile;
+ var scope, formElement, element, $compile, linkLog;
function compile(html) {
formElement = jqLite('');
@@ -104,6 +104,53 @@ describe('ngOptions', function() {
});
});
+ beforeEach(module(function($compileProvider, $provide) {
+ linkLog = [];
+
+ $compileProvider
+ .directive('customSelect', function() {
+ return {
+ restrict: "E",
+ replace: true,
+ scope: {
+ ngModel: '=',
+ options: '='
+ },
+ templateUrl: 'select_template.html',
+ link: function(scope, $element, attributes) {
+ scope.selectable_options = scope.options;
+ }
+ };
+ })
+
+ .directive('oCompileContents', function() {
+ return {
+ link: function(scope, element) {
+ linkLog.push('linkCompileContents');
+ $compile(element.contents())(scope);
+ }
+ };
+ });
+
+ $provide.decorator('ngOptionsDirective', function($delegate) {
+
+ var origPreLink = $delegate[0].link.pre;
+ var origPostLink = $delegate[0].link.post;
+
+ $delegate[0].compile = function() {
+ return {
+ pre: origPreLink,
+ post: function() {
+ linkLog.push('linkNgOptions');
+ origPostLink.apply(this, arguments);
+ }
+ };
+ };
+
+ return $delegate;
+ });
+ }));
+
beforeEach(inject(function($rootScope, _$compile_) {
scope = $rootScope.$new(); //create a child scope because the root scope can't be $destroy-ed
$compile = _$compile_;
@@ -251,6 +298,40 @@ describe('ngOptions', function() {
});
+ it('should set the "selected" attribute and property on selected options', function() {
+ scope.values = [{
+ id: 'FF0000',
+ display: 'red'
+ }, {
+ id: '0000FF',
+ display: 'blue'
+ }];
+ scope.selected = 'FF0000';
+
+ createSelect({
+ 'ng-model': 'selected',
+ 'ng-options': 'option.id as option.display for option in values'
+ });
+ scope.$digest();
+
+ var options = element.find('option');
+ expect(options.length).toEqual(2);
+ expect(options.eq(0)).toEqualOption('FF0000', 'red');
+ expect(options.eq(1)).toEqualOption('0000FF', 'blue');
+
+ expect(options.eq(0)[0].getAttribute('selected')).toBe('selected');
+ expect(options.eq(0).attr('selected')).toBe('selected');
+ expect(options.eq(0)[0].selected).toBe(true);
+ expect(options.eq(0).prop('selected')).toBe(true);
+
+ scope.selected = '0000FF';
+ scope.$digest();
+
+ expect(options.eq(1)[0].getAttribute('selected')).toBe('selected');
+ expect(options.eq(1).attr('selected')).toBe('selected');
+ expect(options.eq(1)[0].selected).toBe(true);
+ expect(options.eq(1).prop('selected')).toBe(true);
+ });
it('should render zero as a valid display value', function() {
createSingleSelect();
@@ -1506,16 +1587,19 @@ describe('ngOptions', function() {
expect(element).toEqualSelectValue(scope.selected);
- var first = jqLite(element.find('optgroup')[0]);
- var b = jqLite(first.find('option')[0]);
- var d = jqLite(first.find('option')[1]);
+ var optgroups = element.find('optgroup');
+ expect(optgroups.length).toBe(2);
+
+ var first = optgroups.eq(0);
+ var b = first.find('option').eq(0);
+ var d = first.find('option').eq(1);
expect(first.attr('label')).toEqual('first');
expect(b.text()).toEqual('B');
expect(d.text()).toEqual('D');
- var second = jqLite(element.find('optgroup')[1]);
- var c = jqLite(second.find('option')[0]);
- var e = jqLite(second.find('option')[1]);
+ var second = optgroups.eq(1);
+ var c = second.find('option').eq(0);
+ var e = second.find('option').eq(1);
expect(second.attr('label')).toEqual('second');
expect(c.text()).toEqual('C');
expect(e.text()).toEqual('E');
@@ -1528,6 +1612,118 @@ describe('ngOptions', function() {
});
+ it('should group when the options are available on compile time', function() {
+ scope.values = [{name: 'C', group: 'first'},
+ {name: 'D', group: 'second'},
+ {name: 'F', group: 'first'},
+ {name: 'G', group: 'second'}];
+ scope.selected = scope.values[3];
+
+ createSelect({
+ 'ng-model': 'selected',
+ 'ng-options': 'item as item.name group by item.group for item in values'
+ });
+
+ expect(element).toEqualSelectValue(scope.selected);
+
+ var optgroups = element.find('optgroup');
+ expect(optgroups.length).toBe(2);
+
+ var first = optgroups.eq(0);
+ var c = first.find('option').eq(0);
+ var f = first.find('option').eq(1);
+ expect(first.attr('label')).toEqual('first');
+ expect(c.text()).toEqual('C');
+ expect(f.text()).toEqual('F');
+
+ var second = optgroups.eq(1);
+ var d = second.find('option').eq(0);
+ var g = second.find('option').eq(1);
+ expect(second.attr('label')).toEqual('second');
+ expect(d.text()).toEqual('D');
+ expect(g.text()).toEqual('G');
+
+ scope.$apply(function() {
+ scope.selected = scope.values[0];
+ });
+
+ expect(element).toEqualSelectValue(scope.selected);
+ });
+
+
+ it('should group when the options are updated', function() {
+ var optgroups, one, two, three, alpha, beta, gamma, delta, epsilon;
+
+ createSelect({
+ 'ng-model': 'selected',
+ 'ng-options': 'i.name group by i.cls for i in list'
+ });
+
+ scope.list = [
+ {cls: 'one', name: 'Alpha'},
+ {cls: 'one', name: 'Beta'},
+ {cls: 'two', name: 'Gamma'}
+ ];
+ scope.$digest();
+
+ optgroups = element.find('optgroup');
+ expect(optgroups.length).toBe(2);
+
+ one = optgroups.eq(0);
+ expect(one.children('option').length).toBe(2);
+
+ alpha = one.find('option').eq(0);
+ beta = one.find('option').eq(1);
+ expect(one.attr('label')).toEqual('one');
+ expect(alpha.text()).toEqual('Alpha');
+ expect(beta.text()).toEqual('Beta');
+
+ two = optgroups.eq(1);
+ expect(two.children('option').length).toBe(1);
+
+ gamma = two.find('option').eq(0);
+ expect(two.attr('label')).toEqual('two');
+ expect(gamma.text()).toEqual('Gamma');
+
+ // Remove item from first group, add item to second group, add new group
+ scope.list.shift();
+ scope.list.push(
+ {cls: 'two', name: 'Delta'},
+ {cls: 'three', name: 'Epsilon'}
+ );
+ scope.$digest();
+
+ optgroups = element.find('optgroup');
+ expect(optgroups.length).toBe(3);
+
+ // Group with removed item
+ one = optgroups.eq(0);
+ expect(one.children('option').length).toBe(1);
+
+ beta = one.find('option').eq(0);
+ expect(one.attr('label')).toEqual('one');
+ expect(beta.text()).toEqual('Beta');
+
+ // Group with new item
+ two = optgroups.eq(1);
+ expect(two.children('option').length).toBe(2);
+
+ gamma = two.find('option').eq(0);
+ expect(two.attr('label')).toEqual('two');
+ expect(gamma.text()).toEqual('Gamma');
+ delta = two.find('option').eq(1);
+ expect(two.attr('label')).toEqual('two');
+ expect(delta.text()).toEqual('Delta');
+
+ // New group
+ three = optgroups.eq(2);
+ expect(three.children('option').length).toBe(1);
+
+ epsilon = three.find('option').eq(0);
+ expect(three.attr('label')).toEqual('three');
+ expect(epsilon.text()).toEqual('Epsilon');
+ });
+
it('should place non-grouped items in the list where they appear', function() {
createSelect({
'ng-model': 'selected',
@@ -2029,7 +2225,9 @@ describe('ngOptions', function() {
expect(option.text()).toBe('is blank');
});
- it('should support option without a value attribute', function() {
+ it('should be ignored when it has no value attribute', function() {
+ // The option value is set to the textContent if there's no value attribute,
+ // so in that case it doesn't count as a blank option
createSingleSelect('--select-- ');
scope.$apply(function() {
scope.values = [{name: 'A'}, {name: 'B'}, {name: 'C'}];
@@ -2084,6 +2282,81 @@ describe('ngOptions', function() {
expect(element[0].selectedIndex).toEqual(0);
expect(scope.selected).toEqual([]);
});
+
+
+ it('should be possible to use ngIf in the blank option', function() {
+ var option;
+ createSingleSelect('blank ');
+
+ scope.$apply(function() {
+ scope.values = [{name: 'A'}];
+ scope.isBlank = true;
+ });
+
+ expect(element.find('option').length).toBe(2);
+ option = element.find('option').eq(0);
+ expect(option.val()).toBe('');
+ expect(option.text()).toBe('blank');
+
+ scope.$apply(function() {
+ scope.isBlank = false;
+ });
+
+ expect(element.find('option').length).toBe(1);
+ option = element.find('option').eq(0);
+ expect(option.text()).toBe('A');
+ });
+
+
+ it('should be possible to use ngIf in the blank option when values are available upon linking',
+ function() {
+ var options;
+
+ scope.values = [{name: 'A'}];
+ createSingleSelect('blank ');
+
+ scope.$apply('isBlank = true');
+
+ options = element.find('option');
+ expect(options.length).toBe(2);
+ expect(options.eq(0).val()).toBe('');
+ expect(options.eq(0).text()).toBe('blank');
+
+ scope.$apply('isBlank = false');
+
+ options = element.find('option');
+ expect(options.length).toBe(1);
+ expect(options.eq(0).text()).toBe('A');
+ }
+ );
+
+ it('should not throw when a directive compiles the blank option before ngOptions is linked', function() {
+ expect(function() {
+ createSelect({
+ 'o-compile-contents': '',
+ 'name': 'select',
+ 'ng-model': 'value',
+ 'ng-options': 'item for item in items'
+ }, true);
+ }).not.toThrow();
+
+ expect(linkLog).toEqual(['linkCompileContents', 'linkNgOptions']);
+ });
+
+
+ it('should not throw with a directive that replaces', inject(function($templateCache, $httpBackend) {
+ $templateCache.put('select_template.html', ' This is a test ');
+
+ scope.options = ['a', 'b', 'c', 'd'];
+
+ expect(function() {
+ element = $compile('' +
+ '{{key}}:{{val}}:{{$index}}| ' +
+ ' ')(scope);
+ scope.items = {'misko':'m', 'shyam':'s', 'frodo':'f', 'length':0};
+ scope.$digest();
+ expect(element.text()).toEqual('misko:m:0|shyam:s:1|frodo:f:2|length:0:3|');
+ });
it('should expose iterator position as $first, $middle and $last when iterating over arrays',
function() {
@@ -1482,11 +1491,11 @@ describe('ngRepeat animations', function() {
}));
it('should not change the position of the block that is being animated away via a leave animation',
- inject(function($compile, $rootScope, $animate, $document, $window, $sniffer, $timeout) {
+ inject(function($compile, $rootScope, $animate, $document, $sniffer, $timeout) {
if (!$sniffer.transitions) return;
var item;
- var ss = createMockStyleSheet($document, $window);
+ var ss = createMockStyleSheet($document);
try {
diff --git a/test/ng/directive/ngSrcsetSpec.js b/test/ng/directive/ngSrcsetSpec.js
index 8d14ca5f1b79..e6842b69292b 100644
--- a/test/ng/directive/ngSrcsetSpec.js
+++ b/test/ng/directive/ngSrcsetSpec.js
@@ -28,5 +28,10 @@ describe('ngSrcset', function() {
$rootScope.$digest();
expect(element.attr('srcset')).toBe('http://example.com/image1.png 1x,unsafe:javascript:doEvilStuff() 2x');
}));
+
+ it('should not throw an error if undefined', inject(function($rootScope, $compile) {
+ element = $compile(' ' +
+ '{{item.label}} ' +
+ ' ');
+ }
+
+ function compileGroupedOptions() {
+ compile(
+ '' +
+ '{{item.name}} ' +
+ '' +
+ '{{item.name}} ' +
+ ' ' +
+ ' ');
+ }
+
function unknownValue(value) {
return '? ' + hashKey(value) + ' ?';
}
+ beforeEach(module(function($compileProvider) {
+ $compileProvider.directive('spyOnWriteValue', function() {
+ return {
+ require: 'select',
+ link: {
+ pre: function(scope, element, attrs, ctrl) {
+ selectCtrl = ctrl;
+ renderSpy = jasmine.createSpy('renderSpy');
+ selectCtrl.ngModelCtrl.$render = renderSpy.andCallFake(selectCtrl.ngModelCtrl.$render);
+ spyOn(selectCtrl, 'writeValue').andCallThrough();
+ }
+ }
+ };
+ });
+
+ $compileProvider.directive('myOptions', function() {
+ return {
+ scope: {myOptions: '='},
+ replace: true,
+ template:
+ '' +
+ '{{ options.label }}' +
+ ' '
+ };
+ });
+ }));
+
beforeEach(inject(function($rootScope, _$compile_) {
scope = $rootScope.$new(); //create a child scope because the root scope can't be $destroy-ed
$compile = _$compile_;
@@ -47,12 +90,14 @@ describe('select', function() {
toEqualSelectWithOptions: function(expected) {
var actualValues = {};
var optionGroup;
+ var optionValue;
forEach(this.actual.find('option'), function(option) {
optionGroup = option.parentNode.label || '';
actualValues[optionGroup] = actualValues[optionGroup] || [];
// IE9 doesn't populate the label property from the text property like other browsers
- actualValues[optionGroup].push(option.label || option.text);
+ optionValue = option.label || option.text;
+ actualValues[optionGroup].push(option.selected ? [optionValue] : optionValue);
});
this.message = function() {
@@ -198,6 +243,50 @@ describe('select', function() {
});
+ it('should select options in a group when there is a linebreak before an option', function() {
+ scope.mySelect = 'B';
+ scope.$apply();
+
+ var select = jqLite(
+ '' +
+ '' +
+ 'A ' +
+ ' ' +
+ '' + '\n' +
+ 'B ' +
+ ' ' +
+ ' ');
+
+ $compile(select)(scope);
+ scope.$apply();
+
+ expect(select).toEqualSelectWithOptions({'first':['A'], 'second': [['B']]});
+ dealoc(select);
+ });
+
+
+ it('should only call selectCtrl.writeValue after a digest has occured', function() {
+ scope.mySelect = 'B';
+ scope.$apply();
+
+ var select = jqLite(
+ '' +
+ '' +
+ 'A ' +
+ ' ' +
+ '' + '\n' +
+ 'B ' +
+ ' ' +
+ ' ');
+
+ $compile(select)(scope);
+ expect(selectCtrl.writeValue).not.toHaveBeenCalled();
+
+ scope.$digest();
+ expect(selectCtrl.writeValue).toHaveBeenCalledOnce();
+ dealoc(select);
+ });
+
describe('empty option', function() {
it('should allow empty option to be added and removed dynamically', function() {
@@ -235,7 +324,7 @@ describe('select', function() {
});
- it('should cope with a dynamic empty option added to a static empty option', function() {
+ it('should cope with a dynamic empty option added to a static empty option', function() {
scope.dynamicOptions = [];
scope.robot = 'x';
compile('' +
@@ -262,7 +351,7 @@ describe('select', function() {
scope.dynamicOptions = [];
scope.$digest();
expect(element).toEqualSelect(['']);
- });
+ });
it('should select the empty option when model is undefined', function() {
compile('' +
@@ -533,26 +622,24 @@ describe('select', function() {
});
- });
+ it('should not break when adding options via a directive with `replace: true` '
+ + 'and a structural directive in its template',
+ function() {
+ scope.options = [
+ {value: '1', label: 'Option 1'},
+ {value: '2', label: 'Option 2'},
+ {value: '3', label: 'Option 3'}
+ ];
+ compile('' +
- '{{item.label}} ' +
- ' ');
- }
- function compileGroupedOptions() {
- compile(
- '' +
- '{{item.name}} ' +
- '' +
- '{{item.name}} ' +
- ' ' +
- ' ');
- }
+ describe('selectController.hasOption', function() {
describe('flat options', function() {
it('should return false for options shifted via ngRepeat', function() {
@@ -624,7 +711,7 @@ describe('select', function() {
expect(selectCtrl.hasOption('A')).toBe(true);
expect(selectCtrl.hasOption('B')).toBe(true);
expect(selectCtrl.hasOption('C')).toBe(true);
- expect(element).toEqualSelectWithOptions({'': ['A', 'B', 'C']});
+ expect(element).toEqualSelectWithOptions({'': ['A', 'B', ['C']]});
});
});
@@ -665,7 +752,7 @@ describe('select', function() {
expect(selectCtrl.hasOption('C')).toBe(true);
expect(selectCtrl.hasOption('D')).toBe(true);
expect(selectCtrl.hasOption('E')).toBe(true);
- expect(element).toEqualSelectWithOptions({'': [''], 'first':['B', 'C'], 'second': ['D', 'E']});
+ expect(element).toEqualSelectWithOptions({'': [['']], 'first':['B', 'C'], 'second': ['D', 'E']});
});
@@ -702,7 +789,7 @@ describe('select', function() {
expect(selectCtrl.hasOption('C')).toBe(true);
expect(selectCtrl.hasOption('D')).toBe(true);
expect(selectCtrl.hasOption('E')).toBe(true);
- expect(element).toEqualSelectWithOptions({'': [''], 'first':['B', 'C', 'D'], 'second': ['E']});
+ expect(element).toEqualSelectWithOptions({'': [['']], 'first':['B', 'C', 'D'], 'second': ['E']});
});
@@ -741,7 +828,7 @@ describe('select', function() {
expect(selectCtrl.hasOption('D')).toBe(true);
expect(selectCtrl.hasOption('E')).toBe(true);
expect(selectCtrl.hasOption('F')).toBe(false);
- expect(element).toEqualSelectWithOptions({'': ['', 'A'], 'first':['B', 'C'], 'second': ['D', 'E']});
+ expect(element).toEqualSelectWithOptions({'': [[''], 'A'], 'first':['B', 'C'], 'second': ['D', 'E']});
});
@@ -778,7 +865,7 @@ describe('select', function() {
expect(selectCtrl.hasOption('C')).toBe(false);
expect(selectCtrl.hasOption('D')).toBe(true);
expect(selectCtrl.hasOption('E')).toBe(true);
- expect(element).toEqualSelectWithOptions({'': ['', 'A'], 'first':['B', 'D'], 'second': ['E']});
+ expect(element).toEqualSelectWithOptions({'': [[''], 'A'], 'first':['B', 'D'], 'second': ['E']});
});
@@ -813,7 +900,7 @@ describe('select', function() {
expect(selectCtrl.hasOption('C')).toBe(true);
expect(selectCtrl.hasOption('D')).toBe(false);
expect(selectCtrl.hasOption('E')).toBe(true);
- expect(element).toEqualSelectWithOptions({'': ['', 'A'], 'first':['B', 'C'], 'second': ['E']});
+ expect(element).toEqualSelectWithOptions({'': [[''], 'A'], 'first':['B', 'C'], 'second': ['E']});
});
@@ -848,7 +935,7 @@ describe('select', function() {
expect(selectCtrl.hasOption('C')).toBe(true);
expect(selectCtrl.hasOption('D')).toBe(false);
expect(selectCtrl.hasOption('E')).toBe(false);
- expect(element).toEqualSelectWithOptions({'': ['', 'A'], 'first':['B', 'C']});
+ expect(element).toEqualSelectWithOptions({'': [[''], 'A'], 'first':['B', 'C']});
});
});
});
diff --git a/test/ng/filter/filterSpec.js b/test/ng/filter/filterSpec.js
index 25928d89b6c4..9210697b5697 100644
--- a/test/ng/filter/filterSpec.js
+++ b/test/ng/filter/filterSpec.js
@@ -315,7 +315,7 @@ describe('Filter: filter', function() {
expect(filter(items, expr, true).length).toBe(1);
expect(filter(items, expr, true)[0]).toBe(items[0]);
- // Inherited function proprties
+ // Inherited function properties
function Expr(text) {
this.text = text;
}
diff --git a/test/ng/filter/filtersSpec.js b/test/ng/filter/filtersSpec.js
index 52ad6fbd6a4d..6a2823967b7c 100644
--- a/test/ng/filter/filtersSpec.js
+++ b/test/ng/filter/filtersSpec.js
@@ -1,7 +1,6 @@
'use strict';
describe('filters', function() {
-
var filter;
beforeEach(inject(function($filter) {
@@ -36,7 +35,11 @@ describe('filters', function() {
it('should format according to different patterns', function() {
pattern.gSize = 2;
- var num = formatNumber(1234567.89, pattern, ',', '.');
+ var num = formatNumber(99, pattern, ',', '.');
+ expect(num).toBe('99');
+ num = formatNumber(888, pattern, ',', '.');
+ expect(num).toBe('888');
+ num = formatNumber(1234567.89, pattern, ',', '.');
expect(num).toBe('12,34,567.89');
num = formatNumber(1234.56, pattern, ',', '.');
expect(num).toBe('1,234.56');
@@ -62,6 +65,8 @@ describe('filters', function() {
it('should format according different separators', function() {
var num = formatNumber(1234567.1, pattern, '.', ',', 2);
expect(num).toBe('1.234.567,10');
+ num = formatNumber(1e-14, pattern, '.', ',', 14);
+ expect(num).toBe('0,00000000000001');
});
it('should format with or without fractionSize', function() {
@@ -90,6 +95,39 @@ describe('filters', function() {
expect(formatNumber(-0.0001, pattern, ',', '.', 3)).toBe('0.000');
expect(formatNumber(-0.0000001, pattern, ',', '.', 6)).toBe('0.000000');
});
+
+ it('should work with numbers that are close to the limit for exponent notation', function() {
+ // previously, numbers that n * (10 ^ fractionSize) > localLimitMax
+ // were ending up with a second exponent in them, then coercing to
+ // NaN when formatNumber rounded them with the safe rounding
+ // function.
+
+ var localLimitMax = 999999999999999900000,
+ localLimitMin = 10000000000000000000,
+ exampleNumber = 444444444400000000000;
+
+ expect(formatNumber(localLimitMax, pattern, ',', '.', 2))
+ .toBe('999,999,999,999,999,900,000.00');
+ expect(formatNumber(localLimitMin, pattern, ',', '.', 2))
+ .toBe('10,000,000,000,000,000,000.00');
+ expect(formatNumber(exampleNumber, pattern, ',', '.', 2))
+ .toBe('444,444,444,400,000,000,000.00');
+
+ });
+
+ it('should format large number',function() {
+ var num;
+ num = formatNumber(12345868059685210000, pattern, ',', '.', 2);
+ expect(num).toBe('12,345,868,059,685,210,000.00');
+ num = formatNumber(79832749837498327498274983793234322432, pattern, ',', '.', 2);
+ expect(num).toBe('7.98e+37');
+ num = formatNumber(8798327498374983274928, pattern, ',', '.', 2);
+ expect(num).toBe('8,798,327,498,374,983,000,000.00');
+ num = formatNumber(879832749374983274928, pattern, ',', '.', 2);
+ expect(num).toBe('879,832,749,374,983,200,000.00');
+ num = formatNumber(879832749374983274928, pattern, ',', '.', 32);
+ expect(num).toBe('879,832,749,374,983,200,000.00000000000000000000000000000000');
+ });
});
describe('currency', function() {
@@ -130,13 +168,12 @@ describe('filters', function() {
}));
});
-
describe('number', function() {
var number;
- beforeEach(inject(function($rootScope) {
+ beforeEach(function() {
number = filter('number');
- }));
+ });
it('should do basic filter', function() {
@@ -184,13 +221,10 @@ describe('filters', function() {
});
it('should filter exponentially large numbers', function() {
- expect(number(1e50)).toEqual('1e+50');
- expect(number(-2e100)).toEqual('-2e+100');
- });
-
- it('should ignore fraction sizes for large numbers', function() {
- expect(number(1e50, 2)).toEqual('1e+50');
- expect(number(-2e100, 5)).toEqual('-2e+100');
+ expect(number(1.23e50)).toEqual('1.23e+50');
+ expect(number(-2.3456e100)).toEqual('-2.346e+100');
+ expect(number(1e50, 2)).toEqual('1.00e+50');
+ expect(number(-2e100, 5)).toEqual('-2.00000e+100');
});
it('should filter exponentially small numbers', function() {
@@ -204,6 +238,14 @@ describe('filters', function() {
expect(number(-1e-7, 6)).toEqual('0.000000');
expect(number(-1e-8, 9)).toEqual('-0.000000010');
});
+
+ it('should filter exponentially small numbers when no fraction specified', function() {
+ expect(number(1e-10)).toEqual('0.000');
+ expect(number(0.0000000001)).toEqual('0.000');
+
+ expect(number(-1e-10)).toEqual('0.000');
+ expect(number(-0.0000000001)).toEqual('0.000');
+ });
});
describe('json', function() {
@@ -230,17 +272,16 @@ describe('filters', function() {
});
describe('date', function() {
-
- var morning = new angular.mock.TzDate(+5, '2010-09-03T12:05:08.001Z'); //7am
- var noon = new angular.mock.TzDate(+5, '2010-09-03T17:05:08.012Z'); //12pm
- var midnight = new angular.mock.TzDate(+5, '2010-09-03T05:05:08.123Z'); //12am
- var earlyDate = new angular.mock.TzDate(+5, '0001-09-03T05:05:08.000Z');
- var secondWeek = new angular.mock.TzDate(+5, '2013-01-11T12:00:00.000Z'); //Friday Jan 11, 2012
+ var morning = new angular.mock.TzDate(+5, '2010-09-03T12:05:08.001Z'); //7am
+ var noon = new angular.mock.TzDate(+5, '2010-09-03T17:05:08.012Z'); //12pm
+ var midnight = new angular.mock.TzDate(+5, '2010-09-03T05:05:08.123Z'); //12am
+ var earlyDate = new angular.mock.TzDate(+5, '0001-09-03T05:05:08.000Z');
+ var secondWeek = new angular.mock.TzDate(+5, '2013-01-11T12:00:00.000Z'); //Friday Jan 11, 2013
var date;
- beforeEach(inject(function($filter) {
- date = $filter('date');
- }));
+ beforeEach(function() {
+ date = filter('date');
+ });
it('should ignore falsy inputs', function() {
expect(date(null)).toBeNull();
@@ -381,6 +422,8 @@ describe('filters', function() {
it('should treat a sequence of two single quotes as a literal single quote', function() {
expect(date(midnight, "yyyy'de' 'a''dd' 'adZ' h=H:m:saZ")).
toEqual("2010de a'dd adZ 12=0:5:8AM-0500");
+ expect(date(midnight, "EEE, MMM d, ''yy")).
+ toEqual("Fri, Sep 3, '10");
});
it('should accept default formats', function() {
@@ -414,7 +457,6 @@ describe('filters', function() {
expect(date(morning, 'yy/xxx')).toEqual('10/xxx');
});
-
it('should support various iso8061 date strings with timezone as input', function() {
var format = 'yyyy-MM-dd ss';
@@ -437,7 +479,6 @@ describe('filters', function() {
expect(date('2003-09-10T13Z', format)).toEqual('2003-09-' + localDay + ' 00');
});
-
it('should parse iso8061 date strings without timezone as local time', function() {
var format = 'yyyy-MM-dd HH-mm-ss';
@@ -472,7 +513,13 @@ describe('filters', function() {
});
it('should support conversion to any timezone', function() {
- expect(date(new Date(Date.UTC(2003, 8, 10, 3, 2, 4)), 'yyyy-MM-dd HH-mm-ssZ', 'GMT+0500')).toEqual('2003-09-10 08-02-04+0500');
+ var dateObj = new Date(Date.UTC(2003, 8, 10, 3, 2, 4));
+ var format = 'yyyy-MM-dd HH-mm-ssZ';
+
+ expect(date(dateObj, format, '+0500')).toEqual('2003-09-10 08-02-04+0500');
+ expect(date(dateObj, format, '+05:00')).toEqual('2003-09-10 08-02-04+0500');
+ expect(date(dateObj, format, 'GMT+0500')).toEqual('2003-09-10 08-02-04+0500');
+ expect(date(dateObj, format, 'GMT+05:00')).toEqual('2003-09-10 08-02-04+0500');
});
it('should fallback to default timezone in case an unknown timezone was passed', function() {
diff --git a/test/ng/filter/limitToSpec.js b/test/ng/filter/limitToSpec.js
index 343290a55c5d..a403c43b94ba 100644
--- a/test/ng/filter/limitToSpec.js
+++ b/test/ng/filter/limitToSpec.js
@@ -140,16 +140,19 @@ describe('Filter: limitTo', function() {
it('should return an empty array if Y exceeds input length', function() {
expect(limitTo(items, '3', 12)).toEqual([]);
- expect(limitTo(items, 4, '-12')).toEqual([]);
expect(limitTo(items, -3, '12')).toEqual([]);
- expect(limitTo(items, '-4', -12)).toEqual([]);
});
it('should return an empty string if Y exceeds input length', function() {
expect(limitTo(str, '3', 12)).toEqual("");
- expect(limitTo(str, 4, '-12')).toEqual("");
expect(limitTo(str, -3, '12')).toEqual("");
- expect(limitTo(str, '-4', -12)).toEqual("");
+ });
+
+ it('should start at 0 if Y is negative and exceeds input length', function() {
+ expect(limitTo(items, 4, '-12')).toEqual(['a', 'b', 'c', 'd']);
+ expect(limitTo(items, '-4', -12)).toEqual(['e', 'f', 'g', 'h']);
+ expect(limitTo(str, 4, '-12')).toEqual("tuvw");
+ expect(limitTo(str, '-4', -12)).toEqual("wxyz");
});
it('should return the entire string beginning from Y if X is positive and X+Y exceeds input length', function() {
diff --git a/test/ng/httpBackendSpec.js b/test/ng/httpBackendSpec.js
index 03490fc4ca1f..cd356959578d 100644
--- a/test/ng/httpBackendSpec.js
+++ b/test/ng/httpBackendSpec.js
@@ -233,6 +233,13 @@ describe('$httpBackend', function() {
expect(MockXhr.$$lastInstance.withCredentials).toBe(true);
});
+ it('should call $xhrFactory with method and url', function() {
+ var mockXhrFactory = jasmine.createSpy('mockXhrFactory').andCallFake(createMockXhr);
+ $backend = createHttpBackend($browser, mockXhrFactory, $browser.defer, callbacks, fakeDocument);
+ $backend('GET', '/some-url', 'some-data', noop);
+ expect(mockXhrFactory).toHaveBeenCalledWith('GET', '/some-url');
+ });
+
describe('responseType', function() {
diff --git a/test/ng/httpSpec.js b/test/ng/httpSpec.js
index 168305eab34f..bc27ff5b5fe6 100644
--- a/test/ng/httpSpec.js
+++ b/test/ng/httpSpec.js
@@ -302,6 +302,13 @@ describe('$http', function() {
}).toThrowMinErr('$http','badreq', 'Http request configuration must be an object. Received: /url');
});
+ it('should throw error if the request configuration url is not a string', function() {
+ expect(function() {
+ $http({url: false});
+ }).toThrowMinErr('$http','badreq', 'Http request configuration url must be a string. Received: false');
+ });
+
+
it('should send GET requests if no method specified', function() {
$httpBackend.expect('GET', '/url').respond('');
$http({url: '/url'});
@@ -345,7 +352,7 @@ describe('$http', function() {
it('should not encode @ in url params', function() {
- //encodeURIComponent is too agressive and doesn't follow http://www.ietf.org/rfc/rfc3986.txt
+ //encodeURIComponent is too aggressive and doesn't follow http://www.ietf.org/rfc/rfc3986.txt
//with regards to the character set (pchar) allowed in path segments
//so we need this test to make sure that we don't over-encode the params and break stuff
//like buzz api which uses @self
@@ -1078,7 +1085,7 @@ describe('$http', function() {
};
// I'm really sorry for doing this :-D
- // Unfortunatelly I don't know how to trick toString.apply(obj) comparison
+ // Unfortunately I don't know how to trick toString.apply(obj) comparison
spyOn(window, 'isFile').andReturn(true);
$httpBackend.expect('POST', '/some', file).respond('');
@@ -1391,6 +1398,25 @@ describe('$http', function() {
expect(callback).toHaveBeenCalledOnce();
expect(callback.mostRecentCall.args[0]).toBe('RESP-FIRST:V1');
});
+
+
+ it('should apply `transformResponse` even if the response data is empty', function(data) {
+ var callback = jasmine.createSpy('transformResponse');
+ var config = {transformResponse: callback};
+
+ $httpBackend.expect('GET', '/url1').respond(200, undefined);
+ $httpBackend.expect('GET', '/url2').respond(200, null);
+ $httpBackend.expect('GET', '/url3').respond(200, '');
+ $http.get('/url1', config);
+ $http.get('/url2', config);
+ $http.get('/url3', config);
+ $httpBackend.flush();
+
+ expect(callback.callCount).toBe(3);
+ expect(callback.calls[0].args[0]).toBe(undefined);
+ expect(callback.calls[1].args[0]).toBe(null);
+ expect(callback.calls[2].args[0]).toBe('');
+ });
});
});
diff --git a/test/ng/locationSpec.js b/test/ng/locationSpec.js
index 1efe3396762f..8e1607c83146 100644
--- a/test/ng/locationSpec.js
+++ b/test/ng/locationSpec.js
@@ -2141,6 +2141,31 @@ describe('$location', function() {
})
);
+ it('should fire $locationChangeSuccess when browser location changes to URL which ends with #',
+ inject(function($location, $browser, $rootScope, $log) {
+ $location.url('/somepath');
+ $rootScope.$apply();
+
+ expect($browser.url()).toEqual('http://server/#/somepath');
+ expect($location.url()).toEqual('/somepath');
+
+ $rootScope.$on('$locationChangeStart', function(event, newUrl, oldUrl) {
+ $log.info('start', newUrl, oldUrl);
+ });
+ $rootScope.$on('$locationChangeSuccess', function(event, newUrl, oldUrl) {
+ $log.info('after', newUrl, oldUrl);
+ });
+
+ $browser.url('http://server/#');
+ $browser.poll();
+
+ expect($log.info.logs.shift()).
+ toEqual(['start', 'http://server/', 'http://server/#/somepath']);
+ expect($log.info.logs.shift()).
+ toEqual(['after', 'http://server/', 'http://server/#/somepath']);
+ })
+ );
+
it('should allow redirect during browser url change',
inject(function($location, $browser, $rootScope, $log) {
$rootScope.$on('$locationChangeStart', function(event, newUrl, oldUrl) {
diff --git a/test/ng/logSpec.js b/test/ng/logSpec.js
index cb7ad2d46937..f214b19e729c 100644
--- a/test/ng/logSpec.js
+++ b/test/ng/logSpec.js
@@ -138,16 +138,26 @@ describe('$log', function() {
describe('$log.error', function() {
var e, $log, errorArgs;
+ function TestError() {
+ Error.prototype.constructor.apply(this, arguments);
+ this.message = undefined;
+ this.sourceURL = undefined;
+ this.line = undefined;
+ this.stack = undefined;
+ }
+ TestError.prototype = Object.create(Error.prototype);
+ TestError.prototype.constructor = TestError;
+
beforeEach(function() {
- e = new Error('');
- e.message = undefined;
- e.sourceURL = undefined;
- e.line = undefined;
- e.stack = undefined;
-
- $log = new $LogProvider().$get[1]({console:{error:function() {
- errorArgs = [].slice.call(arguments, 0);
- }}});
+ e = new TestError('');
+ var mockWindow = {
+ console: {
+ error: function() {
+ errorArgs = [].slice.call(arguments, 0);
+ }
+ }
+ };
+ $log = new $LogProvider().$get[1](mockWindow);
});
diff --git a/test/ng/parseSpec.js b/test/ng/parseSpec.js
index 5b477b464947..45512a387de1 100644
--- a/test/ng/parseSpec.js
+++ b/test/ng/parseSpec.js
@@ -2,15 +2,6 @@
describe('parser', function() {
- beforeEach(function() {
- /* global getterFnCacheDefault: true */
- /* global getterFnCacheExpensive: true */
- // clear caches
- getterFnCacheDefault = createMap();
- getterFnCacheExpensive = createMap();
- });
-
-
describe('lexer', function() {
var lex;
@@ -1675,7 +1666,6 @@ describe('parser', function() {
$filterProvider = filterProvider;
}]));
-
forEach([true, false], function(cspEnabled) {
describe('csp: ' + cspEnabled, function() {
@@ -2381,6 +2371,71 @@ describe('parser', function() {
'$parse', 'isecwindow', 'Referencing the Window in Angular expressions is disallowed! ' +
'Expression: foo.w = 1');
}));
+
+ they('should propagate expensive checks when calling $prop',
+ ['foo.w && true',
+ '$eval("foo.w && true")',
+ 'this["$eval"]("foo.w && true")',
+ 'bar;$eval("foo.w && true")',
+ '$eval("foo.w && true");bar',
+ '$eval("foo.w && true", null, false)',
+ '$eval("foo");$eval("foo.w && true")',
+ '$eval("$eval(\\"foo.w && true\\")")',
+ '$eval("foo.e()")',
+ '$evalAsync("foo.w && true")',
+ 'this["$evalAsync"]("foo.w && true")',
+ 'bar;$evalAsync("foo.w && true")',
+ '$evalAsync("foo.w && true");bar',
+ '$evalAsync("foo.w && true", null, false)',
+ '$evalAsync("foo");$evalAsync("foo.w && true")',
+ '$evalAsync("$evalAsync(\\"foo.w && true\\")")',
+ '$evalAsync("foo.e()")',
+ '$evalAsync("$eval(\\"foo.w && true\\")")',
+ '$eval("$evalAsync(\\"foo.w && true\\")")',
+ '$watch("foo.w && true")',
+ '$watchCollection("foo.w && true", foo.f)',
+ '$watchGroup(["foo.w && true"])',
+ '$applyAsync("foo.w && true")'], function(expression) {
+ inject(function($parse, $window) {
+ scope.foo = {
+ w: $window,
+ bar: 'bar',
+ e: function() { scope.$eval("foo.w && true"); },
+ f: function() {}
+ };
+ expect($parse.$$runningExpensiveChecks()).toEqual(false);
+ expect(function() {
+ scope.$eval($parse(expression, null, true));
+ scope.$digest();
+ }).toThrowMinErr(
+ '$parse', 'isecwindow', 'Referencing the Window in Angular expressions is disallowed! ' +
+ 'Expression: foo.w && true');
+ expect($parse.$$runningExpensiveChecks()).toEqual(false);
+ });
+ });
+
+ they('should restore the state of $$runningExpensiveChecks when the expression $prop throws',
+ ['$eval("foo.t()")',
+ '$evalAsync("foo.t()", {foo: foo})'], function(expression) {
+ inject(function($parse, $window) {
+ scope.foo = {
+ t: function() { throw new Error(); }
+ };
+ expect($parse.$$runningExpensiveChecks()).toEqual(false);
+ expect(function() {
+ scope.$eval($parse(expression, null, true));
+ scope.$digest();
+ }).toThrow();
+ expect($parse.$$runningExpensiveChecks()).toEqual(false);
+ });
+ });
+
+ it('should handle `inputs` when running with expensive checks', inject(function($parse) {
+ expect(function() {
+ scope.$watch($parse('a + b', null, true), noop);
+ scope.$digest();
+ }).not.toThrow();
+ }));
});
});
@@ -2692,6 +2747,15 @@ describe('parser', function() {
});
});
+ it('should prevent the exploit', function() {
+ expect(function() {
+ scope.$eval('(1)[{0: "__proto__", 1: "__proto__", 2: "__proto__", 3: "safe", length: 4, toString: [].pop}].foo = 1');
+ }).toThrow();
+ if (!msie || msie > 10) {
+ expect((1)['__proto__'].foo).toBeUndefined();
+ }
+ });
+
it('should prevent the exploit', function() {
expect(function() {
scope.$eval('' +
@@ -2703,6 +2767,41 @@ describe('parser', function() {
'');
}).toThrow();
});
+
+ it('should prevent assigning in the context of a constructor', function() {
+ expect(function() {
+ scope.$eval("''.constructor.join");
+ }).not.toThrow();
+ expect(function() {
+ scope.$eval("''.constructor.join = ''.constructor.join");
+ }).toThrow();
+ expect(function() {
+ scope.$eval("''.constructor[0] = ''");
+ }).toThrow();
+ expect(function() {
+ scope.$eval("(0).constructor[0] = ''");
+ }).toThrow();
+ expect(function() {
+ scope.$eval("{}.constructor[0] = ''");
+ }).toThrow();
+ // foo.constructor is the object constructor.
+ expect(function() {
+ scope.$eval("foo.constructor[0] = ''", {foo: {}});
+ }).toThrow();
+ // foo.constructor is not a constructor.
+ expect(function() {
+ scope.$eval("foo.constructor[0] = ''", {foo: {constructor: ''}});
+ }).not.toThrow();
+ expect(function() {
+ scope.$eval("objConstructor = {}.constructor; objConstructor.join = ''");
+ }).toThrow();
+ expect(function() {
+ scope.$eval("'a'.constructor.prototype.charAt=[].join");
+ }).toThrow();
+ expect(function() {
+ scope.$eval("'a'.constructor.prototype.charCodeAt=[].concat");
+ }).toThrow();
+ });
});
it('should call the function from the received instance and not from a new one', function() {
@@ -2903,6 +3002,25 @@ describe('parser', function() {
expect(log).toEqual('');
}));
+ it('should work with expensive checks', inject(function($parse, $rootScope, log) {
+ var fn = $parse('::foo', null, true);
+ $rootScope.$watch(fn, function(value, old) { if (value !== old) log(value); });
+
+ $rootScope.$digest();
+ expect($rootScope.$$watchers.length).toBe(1);
+
+ $rootScope.foo = 'bar';
+ $rootScope.$digest();
+ expect($rootScope.$$watchers.length).toBe(0);
+ expect(log).toEqual('bar');
+ log.reset();
+
+ $rootScope.foo = 'man';
+ $rootScope.$digest();
+ expect($rootScope.$$watchers.length).toBe(0);
+ expect(log).toEqual('');
+ }));
+
it('should have a stable value if at the end of a $digest it has a defined value', inject(function($parse, $rootScope, log) {
var fn = $parse('::foo');
$rootScope.$watch(fn, function(value, old) { if (value !== old) log(value); });
@@ -3127,6 +3245,17 @@ describe('parser', function() {
expect(called).toBe(true);
}));
+ it('should invoke interceptors when the expression is `undefined`', inject(function($parse) {
+ var called = false;
+ function interceptor(v) {
+ called = true;
+ return v;
+ }
+ scope.$watch($parse(undefined, interceptor));
+ scope.$digest();
+ expect(called).toBe(true);
+ }));
+
it('should treat filters with constant input as constants', inject(function($parse) {
var filterCalls = 0;
$filterProvider.register('foo', valueFn(function(input) {
diff --git a/test/ng/rootScopeSpec.js b/test/ng/rootScopeSpec.js
index 8bdc6b4c50f0..b70fc6633d14 100644
--- a/test/ng/rootScopeSpec.js
+++ b/test/ng/rootScopeSpec.js
@@ -117,6 +117,20 @@ describe('Scope', function() {
}));
+ it('should not expose the `inner working of watch', inject(function($rootScope) {
+ function Getter() {
+ expect(this).toBeUndefined();
+ return 'foo';
+ }
+ function Listener() {
+ expect(this).toBeUndefined();
+ }
+ if (msie < 10) return;
+ $rootScope.$watch(Getter, Listener);
+ $rootScope.$digest();
+ }));
+
+
it('should watch and fire on expression change', inject(function($rootScope) {
var spy = jasmine.createSpy();
$rootScope.$watch('name.first', spy);
@@ -188,7 +202,7 @@ describe('Scope', function() {
expect(child1.$$watchersCount).toBe(1);
expect($rootScope.$$watchersCount).toBe(2);
- // Execute everything a second time to be sure that calling the remove funciton
+ // Execute everything a second time to be sure that calling the remove function
// several times, it only decrements the counter once
remove2();
expect(child2.$$watchersCount).toBe(1);
@@ -1211,6 +1225,36 @@ describe('Scope', function() {
expect(child.parentModel).toBe('parent');
expect(child.childModel).toBe('child');
}));
+
+
+ if (msie === 9) {
+ // See issue https://github.com/angular/angular.js/issues/10706
+ it('should completely disconnect all child scopes on IE9', inject(function($rootScope) {
+ var parent = $rootScope.$new(),
+ child1 = parent.$new(),
+ child2 = parent.$new(),
+ grandChild1 = child1.$new(),
+ grandChild2 = child1.$new();
+
+ child1.$destroy();
+ $rootScope.$digest();
+
+ expect(isDisconnected(parent)).toBe(false);
+ expect(isDisconnected(child1)).toBe(true);
+ expect(isDisconnected(child2)).toBe(false);
+ expect(isDisconnected(grandChild1)).toBe(true);
+ expect(isDisconnected(grandChild2)).toBe(true);
+
+ function isDisconnected($scope) {
+ return $scope.$$nextSibling === null &&
+ $scope.$$prevSibling === null &&
+ $scope.$$childHead === null &&
+ $scope.$$childTail === null &&
+ $scope.$root === null &&
+ $scope.$$watchers === null;
+ }
+ }));
+ }
});
@@ -1357,7 +1401,7 @@ describe('Scope', function() {
expect(child.log).toBe('child context');
}));
- it('should operate only with a single queue across all child and isolate scopes', inject(function($rootScope) {
+ it('should operate only with a single queue across all child and isolate scopes', inject(function($rootScope, $parse) {
var childScope = $rootScope.$new();
var isolateScope = $rootScope.$new(true);
@@ -1368,9 +1412,9 @@ describe('Scope', function() {
expect(childScope.$$asyncQueue).toBe($rootScope.$$asyncQueue);
expect(isolateScope.$$asyncQueue).toBeUndefined();
expect($rootScope.$$asyncQueue).toEqual([
- {scope: $rootScope, expression: 'rootExpression'},
- {scope: childScope, expression: 'childExpression'},
- {scope: isolateScope, expression: 'isolateExpression'}
+ {scope: $rootScope, expression: $parse('rootExpression')},
+ {scope: childScope, expression: $parse('childExpression')},
+ {scope: isolateScope, expression: $parse('isolateExpression')}
]);
}));
diff --git a/test/ng/snifferSpec.js b/test/ng/snifferSpec.js
index c16d4802d966..b1fafceff36d 100644
--- a/test/ng/snifferSpec.js
+++ b/test/ng/snifferSpec.js
@@ -88,7 +88,9 @@ describe('$sniffer', function() {
inject(function($sniffer, $window) {
var expectedPrefix;
var ua = $window.navigator.userAgent.toLowerCase();
- if (/chrome/i.test(ua) || /safari/i.test(ua) || /webkit/i.test(ua)) {
+ if (/edge/i.test(ua)) {
+ expectedPrefix = 'Ms';
+ } else if (/chrome/i.test(ua) || /safari/i.test(ua) || /webkit/i.test(ua)) {
expectedPrefix = 'Webkit';
} else if (/firefox/i.test(ua)) {
expectedPrefix = 'Moz';
diff --git a/test/ng/templateRequestSpec.js b/test/ng/templateRequestSpec.js
index a297bbfafe2d..a392115efdcc 100644
--- a/test/ng/templateRequestSpec.js
+++ b/test/ng/templateRequestSpec.js
@@ -81,6 +81,39 @@ describe('$templateRequest', function() {
}).not.toThrow();
}));
+ it('should accept empty templates and refuse null or undefined templates in cache',
+ inject(function($rootScope, $templateRequest, $templateCache, $sce) {
+
+ // Will throw on any template not in cache.
+ spyOn($sce, 'getTrustedResourceUrl').andReturn(false);
+
+ expect(function() {
+ $templateRequest('tpl.html'); // should go through $sce
+ $rootScope.$digest();
+ }).toThrow();
+
+ $templateCache.put('tpl.html'); // is a no-op, so $sce check as well.
+ expect(function() {
+ $templateRequest('tpl.html');
+ $rootScope.$digest();
+ }).toThrow();
+ $templateCache.removeAll();
+
+ $templateCache.put('tpl.html', null); // makes no sense, but it's been added, so trust it.
+ expect(function() {
+ $templateRequest('tpl.html');
+ $rootScope.$digest();
+ }).not.toThrow();
+ $templateCache.removeAll();
+
+ $templateCache.put('tpl.html', ''); // should work (empty template)
+ expect(function() {
+ $templateRequest('tpl.html');
+ $rootScope.$digest();
+ }).not.toThrow();
+ $templateCache.removeAll();
+ }));
+
it('should keep track of how many requests are going on',
inject(function($rootScope, $templateRequest, $httpBackend) {
diff --git a/test/ngAnimate/.jshintrc b/test/ngAnimate/.jshintrc
index b307fb405952..d202a2b3bf1c 100644
--- a/test/ngAnimate/.jshintrc
+++ b/test/ngAnimate/.jshintrc
@@ -3,11 +3,16 @@
"browser": true,
"newcap": false,
"globals": {
- "mergeAnimationOptions": false,
+ "mergeAnimationDetails": false,
"prepareAnimationOptions": false,
"applyAnimationStyles": false,
"applyAnimationFromStyles": false,
"applyAnimationToStyles": false,
- "applyAnimationClassesFactory": false
+ "applyAnimationClassesFactory": false,
+ "TRANSITIONEND_EVENT": false,
+ "TRANSITION_PROP": false,
+ "ANIMATION_PROP": false,
+ "ANIMATIONEND_EVENT": false,
+ "ANIMATE_TIMER_KEY": false
}
}
diff --git a/test/ngAnimate/animateCssDriverSpec.js b/test/ngAnimate/animateCssDriverSpec.js
index 589d5932e3ff..abc4eefa7a89 100644
--- a/test/ngAnimate/animateCssDriverSpec.js
+++ b/test/ngAnimate/animateCssDriverSpec.js
@@ -69,11 +69,11 @@ describe("ngAnimate $$animateCssDriver", function() {
element = jqLite('
');
- return function($$animateCssDriver, $document, $window) {
+ return function($$animateCssDriver, $document) {
driver = function(details, cb) {
return $$animateCssDriver(details, cb || noop);
};
- ss = createMockStyleSheet($document, $window);
+ ss = createMockStyleSheet($document);
};
}));
@@ -121,7 +121,7 @@ describe("ngAnimate $$animateCssDriver", function() {
var from, to, fromAnimation, toAnimation;
beforeEach(module(function() {
- return function($rootElement, $$body) {
+ return function($rootElement, $document) {
from = element;
to = jqLite('
');
fromAnimation = { element: from, event: 'enter' };
@@ -129,8 +129,14 @@ describe("ngAnimate $$animateCssDriver", function() {
$rootElement.append(from);
$rootElement.append(to);
- // we need to do this so that style detection works
- $$body.append($rootElement);
+ var doc = $document[0];
+
+ // there is one test in here that expects the rootElement
+ // to supersede the body node
+ if (!$rootElement[0].contains(doc.body)) {
+ // we need to do this so that style detection works
+ jqLite(doc.body).append($rootElement);
+ }
};
}));
@@ -975,6 +981,39 @@ describe("ngAnimate $$animateCssDriver", function() {
expect(completed).toBe(true);
}));
+
+ it("should use as the element container if the rootElement exists outside of the tag", function() {
+ module(function($provide) {
+ $provide.factory('$rootElement', function($document) {
+ return jqLite($document[0].querySelector('html'));
+ });
+ });
+ inject(function($rootElement, $rootScope, $animate, $document) {
+ ss.addRule('.ending-element', 'width:9999px; height:6666px; display:inline-block;');
+
+ var fromAnchor = jqLite('
');
+ from.append(fromAnchor);
+
+ var toAnchor = jqLite('
');
+ to.append(toAnchor);
+
+ $rootElement.append(fromAnchor);
+ $rootElement.append(toAnchor);
+
+ var completed = false;
+ driver({
+ from: fromAnimation,
+ to: toAnimation,
+ anchors: [{
+ 'out': fromAnchor,
+ 'in': toAnchor
+ }]
+ }).start();
+
+ var clone = captureLog[2].element[0];
+ expect(clone.parentNode).toBe($document[0].body);
+ });
+ });
});
});
});
diff --git a/test/ngAnimate/animateCssSpec.js b/test/ngAnimate/animateCssSpec.js
index a4071782ab43..6e0b66073e76 100644
--- a/test/ngAnimate/animateCssSpec.js
+++ b/test/ngAnimate/animateCssSpec.js
@@ -12,15 +12,33 @@ describe("ngAnimate $animateCss", function() {
: expect(className).not.toMatch(regex);
}
+ function getPossiblyPrefixedStyleValue(element, styleProp) {
+ var value = element.css(prefix + styleProp);
+ if (isUndefined(value)) value = element.css(styleProp);
+
+ return value;
+ }
+
+ function keyframeProgress(element, duration, delay) {
+ browserTrigger(element, 'animationend',
+ { timeStamp: Date.now() + ((delay || 1) * 1000), elapsedTime: duration });
+ }
+
+ function transitionProgress(element, duration, delay) {
+ browserTrigger(element, 'transitionend',
+ { timeStamp: Date.now() + ((delay || 1) * 1000), elapsedTime: duration });
+ }
+
var fakeStyle = {
color: 'blue'
};
var ss, prefix, triggerAnimationStartFrame;
beforeEach(module(function() {
- return function($document, $window, $sniffer, $$rAF, $animate) {
+ return function($document, $sniffer, $$rAF, $animate) {
prefix = '-' + $sniffer.vendorPrefix.toLowerCase() + '-';
- ss = createMockStyleSheet($document, $window);
+ ss = createMockStyleSheet($document, prefix);
+
$animate.enabled(true);
triggerAnimationStartFrame = function() {
$$rAF.flush();
@@ -35,12 +53,12 @@ describe("ngAnimate $animateCss", function() {
});
it("should return false if neither transitions or keyframes are supported by the browser",
- inject(function($animateCss, $sniffer, $rootElement, $$body) {
+ inject(function($animateCss, $sniffer, $rootElement, $document) {
var animator;
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
$sniffer.transitions = $sniffer.animations = false;
animator = $animateCss(element, {
@@ -54,13 +72,13 @@ describe("ngAnimate $animateCss", function() {
if (!browserSupportsCssAnimations()) return;
it("should not attempt an animation if animations are globally disabled",
- inject(function($animateCss, $animate, $rootElement, $$body) {
+ inject(function($animateCss, $animate, $rootElement, $document) {
$animate.enabled(false);
var animator, element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
animator = $animateCss(element, {
duration: 10,
@@ -109,9 +127,9 @@ describe("ngAnimate $animateCss", function() {
describe("rAF usage", function() {
it("should buffer all requests into a single requestAnimationFrame call",
- inject(function($animateCss, $$rAF, $rootScope, $$body, $rootElement) {
+ inject(function($animateCss, $$rAF, $rootScope, $document, $rootElement) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var count = 0;
var runners = [];
@@ -149,8 +167,8 @@ describe("ngAnimate $animateCss", function() {
};
});
});
- inject(function($animateCss, $$rAF, $$body, $rootElement) {
- $$body.append($rootElement);
+ inject(function($animateCss, $$rAF, $document, $rootElement) {
+ jqLite($document[0].body).append($rootElement);
function makeRequest() {
var element = jqLite('
');
@@ -169,10 +187,10 @@ describe("ngAnimate $animateCss", function() {
describe("animator and runner", function() {
var animationDuration = 5;
var element, animator;
- beforeEach(inject(function($animateCss, $rootElement, $$body) {
+ beforeEach(inject(function($animateCss, $rootElement, $document) {
element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
animator = $animateCss(element, {
event: 'enter',
@@ -315,7 +333,7 @@ describe("ngAnimate $animateCss", function() {
triggerAnimationStartFrame();
runner.pause();
- expect(element.css(prefix + 'animation-play-state')).toEqual('paused');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-play-state')).toEqual('paused');
runner.resume();
expect(element.attr('style')).toBeFalsy();
}));
@@ -336,7 +354,7 @@ describe("ngAnimate $animateCss", function() {
triggerAnimationStartFrame();
runner.pause();
- expect(element.css(prefix + 'animation-play-state')).toEqual('paused');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-play-state')).toEqual('paused');
runner.end();
expect(element.attr('style')).toBeFalsy();
}));
@@ -355,20 +373,10 @@ describe("ngAnimate $animateCss", function() {
assert.toHaveClass('ng-enter-active');
}
- function keyframeProgress(element, duration, delay) {
- browserTrigger(element, 'animationend',
- { timeStamp: Date.now() + ((delay || 1) * 1000), elapsedTime: duration });
- }
-
- function transitionProgress(element, duration, delay) {
- browserTrigger(element, 'transitionend',
- { timeStamp: Date.now() + ((delay || 1) * 1000), elapsedTime: duration });
- }
-
- beforeEach(inject(function($rootElement, $$body) {
+ beforeEach(inject(function($rootElement, $document) {
element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
options = { event: 'enter', structural: true };
}));
@@ -638,9 +646,9 @@ describe("ngAnimate $animateCss", function() {
describe("staggering", function() {
it("should apply a stagger based when an active ng-EVENT-stagger class with a transition-delay is detected",
- inject(function($animateCss, $$body, $rootElement, $timeout) {
+ inject(function($animateCss, $document, $rootElement, $timeout) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.ng-enter-stagger', 'transition-delay:0.2s');
ss.addRule('.ng-enter', 'transition:2s linear all');
@@ -679,9 +687,9 @@ describe("ngAnimate $animateCss", function() {
}));
it("should apply a stagger based when for all provided addClass/removeClass CSS classes",
- inject(function($animateCss, $$body, $rootElement, $timeout) {
+ inject(function($animateCss, $document, $rootElement, $timeout) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.red-add-stagger,' +
'.blue-remove-stagger,' +
@@ -749,9 +757,9 @@ describe("ngAnimate $animateCss", function() {
}));
it("should block the transition animation between start and animate when staggered",
- inject(function($animateCss, $$body, $rootElement) {
+ inject(function($animateCss, $document, $rootElement) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.ng-enter-stagger', 'transition-delay:0.2s');
ss.addRule('.ng-enter', 'transition:2s linear all;');
@@ -780,12 +788,12 @@ describe("ngAnimate $animateCss", function() {
}));
it("should block (pause) the keyframe animation between start and animate when staggered",
- inject(function($animateCss, $$body, $rootElement) {
+ inject(function($animateCss, $document, $rootElement) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
- ss.addRule('.ng-enter-stagger', prefix + 'animation-delay:0.2s');
- ss.addRule('.ng-enter', prefix + 'animation:my_animation 2s;');
+ ss.addPossiblyPrefixedRule('.ng-enter-stagger', 'animation-delay:0.2s');
+ ss.addPossiblyPrefixedRule('.ng-enter', 'animation:my_animation 2s;');
var i, element, elements = [];
for (i = 0; i < 5; i++) {
@@ -803,15 +811,15 @@ describe("ngAnimate $animateCss", function() {
if (i === 0) { // the first element is always run right away
expect(element.attr('style')).toBeFalsy();
} else {
- expect(element.css(prefix + 'animation-play-state')).toBe('paused');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-play-state')).toBe('paused');
}
}
}));
it("should not apply a stagger if the transition delay value is inherited from a earlier CSS class",
- inject(function($animateCss, $$body, $rootElement) {
+ inject(function($animateCss, $document, $rootElement) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.transition-animation', 'transition:2s 5s linear all;');
@@ -828,9 +836,9 @@ describe("ngAnimate $animateCss", function() {
}));
it("should apply a stagger only if the transition duration value is zero when inherited from a earlier CSS class",
- inject(function($animateCss, $$body, $rootElement) {
+ inject(function($animateCss, $document, $rootElement) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.transition-animation', 'transition:2s 5s linear all;');
ss.addRule('.transition-animation.ng-enter-stagger',
@@ -854,9 +862,9 @@ describe("ngAnimate $animateCss", function() {
it("should ignore animation staggers if only transition animations were detected",
- inject(function($animateCss, $$body, $rootElement) {
+ inject(function($animateCss, $document, $rootElement) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.ng-enter-stagger', prefix + 'animation-delay:0.2s');
ss.addRule('.transition-animation', 'transition:2s 5s linear all;');
@@ -874,12 +882,12 @@ describe("ngAnimate $animateCss", function() {
}));
it("should ignore transition staggers if only keyframe animations were detected",
- inject(function($animateCss, $$body, $rootElement) {
+ inject(function($animateCss, $document, $rootElement) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.ng-enter-stagger', 'transition-delay:0.2s');
- ss.addRule('.transition-animation', prefix + 'animation:2s 5s my_animation;');
+ ss.addPossiblyPrefixedRule('.transition-animation', 'animation: 2s 5s my_animation;');
for (var i = 0; i < 5; i++) {
var elm = jqLite('
');
@@ -894,15 +902,15 @@ describe("ngAnimate $animateCss", function() {
}));
it("should start on the highest stagger value if both transition and keyframe staggers are used together",
- inject(function($animateCss, $$body, $rootElement, $timeout, $browser) {
+ inject(function($animateCss, $document, $rootElement, $timeout, $browser) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
- ss.addRule('.ng-enter-stagger', 'transition-delay:0.5s;' +
- prefix + 'animation-delay:1s');
+ ss.addPossiblyPrefixedRule('.ng-enter-stagger', 'transition-delay: 0.5s; ' +
+ 'animation-delay: 1s');
- ss.addRule('.ng-enter', 'transition:10s linear all;' +
- prefix + 'animation:my_animation 20s');
+ ss.addPossiblyPrefixedRule('.ng-enter', 'transition: 10s linear all; ' +
+ 'animation: 20s my_animation');
var i, elm, elements = [];
for (i = 0; i < 5; i++) {
@@ -932,9 +940,9 @@ describe("ngAnimate $animateCss", function() {
}));
it("should apply the closing timeout ontop of the stagger timeout",
- inject(function($animateCss, $$body, $rootElement, $timeout, $browser) {
+ inject(function($animateCss, $document, $rootElement, $timeout, $browser) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.ng-enter-stagger', 'transition-delay:1s;');
ss.addRule('.ng-enter', 'transition:10s linear all;');
@@ -959,9 +967,9 @@ describe("ngAnimate $animateCss", function() {
}));
it("should apply the closing timeout ontop of the stagger timeout with an added delay",
- inject(function($animateCss, $$body, $rootElement, $timeout, $browser) {
+ inject(function($animateCss, $document, $rootElement, $timeout, $browser) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.ng-enter-stagger', 'transition-delay:1s;');
ss.addRule('.ng-enter', 'transition:10s linear all; transition-delay:50s;');
@@ -986,9 +994,9 @@ describe("ngAnimate $animateCss", function() {
}));
it("should issue a stagger if a stagger value is provided in the options",
- inject(function($animateCss, $$body, $rootElement, $timeout) {
+ inject(function($animateCss, $document, $rootElement, $timeout) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.ng-enter', 'transition:2s linear all');
var elm, i, elements = [];
@@ -1025,9 +1033,9 @@ describe("ngAnimate $animateCss", function() {
}));
it("should only add/remove classes once the stagger timeout has passed",
- inject(function($animateCss, $$body, $rootElement, $timeout) {
+ inject(function($animateCss, $document, $rootElement, $timeout) {
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var element = jqLite('
');
$rootElement.append(element);
@@ -1052,13 +1060,13 @@ describe("ngAnimate $animateCss", function() {
describe("closing timeout", function() {
it("should close off the animation after 150% of the animation time has passed",
- inject(function($animateCss, $$body, $rootElement, $timeout) {
+ inject(function($animateCss, $document, $rootElement, $timeout) {
ss.addRule('.ng-enter', 'transition:10s linear all;');
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var animator = $animateCss(element, { event: 'enter', structural: true });
animator.start();
@@ -1075,13 +1083,13 @@ describe("ngAnimate $animateCss", function() {
}));
it("should close off the animation after 150% of the animation time has passed and consider the detected delay value",
- inject(function($animateCss, $$body, $rootElement, $timeout) {
+ inject(function($animateCss, $document, $rootElement, $timeout) {
ss.addRule('.ng-enter', 'transition:10s linear all; transition-delay:30s;');
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var animator = $animateCss(element, { event: 'enter', structural: true });
animator.start();
@@ -1098,13 +1106,13 @@ describe("ngAnimate $animateCss", function() {
}));
it("should still resolve the animation once expired",
- inject(function($animateCss, $$body, $rootElement, $timeout, $animate, $rootScope) {
+ inject(function($animateCss, $document, $rootElement, $timeout, $animate, $rootScope) {
ss.addRule('.ng-enter', 'transition:10s linear all;');
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var animator = $animateCss(element, { event: 'enter', structural: true });
@@ -1123,13 +1131,13 @@ describe("ngAnimate $animateCss", function() {
}));
it("should not resolve/reject after passing if the animation completed successfully",
- inject(function($animateCss, $$body, $rootElement, $timeout, $rootScope, $animate) {
+ inject(function($animateCss, $document, $rootElement, $timeout, $rootScope, $animate) {
ss.addRule('.ng-enter', 'transition:10s linear all;');
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var animator = $animateCss(element, { event: 'enter', structural: true });
@@ -1160,7 +1168,7 @@ describe("ngAnimate $animateCss", function() {
}));
it("should close all stacked animations after the last timeout runs on the same element",
- inject(function($animateCss, $$body, $rootElement, $timeout, $animate) {
+ inject(function($animateCss, $document, $rootElement, $timeout, $animate) {
var now = 0;
spyOn(Date, 'now').andCallFake(function() {
@@ -1177,7 +1185,7 @@ describe("ngAnimate $animateCss", function() {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
// timeout will be at 1500s
animate(element, 'red', doneSpy);
@@ -1218,11 +1226,11 @@ describe("ngAnimate $animateCss", function() {
}));
it("should not throw an error any pending timeout requests resolve after the element has already been removed",
- inject(function($animateCss, $$body, $rootElement, $timeout, $animate) {
+ inject(function($animateCss, $document, $rootElement, $timeout, $animate) {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.red', 'transition:1s linear all;');
@@ -1234,6 +1242,96 @@ describe("ngAnimate $animateCss", function() {
$timeout.flush();
}).not.toThrow();
}));
+
+ it("should consider a positive options.delay value for the closing timeout",
+ inject(function($animateCss, $rootElement, $timeout, $document) {
+
+ var element = jqLite('
');
+ $rootElement.append(element);
+ jqLite($document[0].body).append($rootElement);
+
+ var options = {
+ delay: 3,
+ duration: 3,
+ to: {
+ height: '100px'
+ }
+ };
+
+ var animator = $animateCss(element, options);
+
+ animator.start();
+ triggerAnimationStartFrame();
+
+ // At this point, the animation should still be running (closing timeout is 7500ms ... duration * 1.5 + delay => 7.5)
+ $timeout.flush(7000);
+
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-delay')).toBe('3s');
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-duration')).toBe('3s');
+
+ // Let's flush the remaining amount of time for the timeout timer to kick in
+ $timeout.flush(500);
+
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-duration')).toBeOneOf('', '0s');
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-delay')).toBeOneOf('', '0s');
+ }));
+
+ it("should ignore a boolean options.delay value for the closing timeout",
+ inject(function($animateCss, $rootElement, $timeout, $document) {
+
+ var element = jqLite('
');
+ $rootElement.append(element);
+ jqLite($document[0].body).append($rootElement);
+
+ var options = {
+ delay: true,
+ duration: 3,
+ to: {
+ height: '100px'
+ }
+ };
+
+ var animator = $animateCss(element, options);
+
+ animator.start();
+ triggerAnimationStartFrame();
+
+ // At this point, the animation should still be running (closing timeout is 4500ms ... duration * 1.5 => 4.5)
+ $timeout.flush(4000);
+
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-delay')).toBeOneOf('initial', '0s');
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-duration')).toBe('3s');
+
+ // Let's flush the remaining amount of time for the timeout timer to kick in
+ $timeout.flush(500);
+
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-duration')).toBeOneOf('', '0s');
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-delay')).toBeOneOf('', '0s');
+ }));
+
+
+ it("should cancel the timeout when the animation is ended normally",
+ inject(function($animateCss, $document, $rootElement, $timeout) {
+
+ ss.addRule('.ng-enter', 'transition:10s linear all;');
+
+ var element = jqLite('
');
+ $rootElement.append(element);
+ jqLite($document[0].body).append($rootElement);
+
+ var animator = $animateCss(element, { event: 'enter', structural: true });
+ animator.start();
+ triggerAnimationStartFrame();
+
+ expect(element).toHaveClass('ng-enter');
+ expect(element).toHaveClass('ng-enter-active');
+
+ animator.end();
+
+ expect(element.data(ANIMATE_TIMER_KEY)).toBeUndefined();
+ expect(function() {$timeout.verifyNoPendingTasks();}).not.toThrow();
+ }));
+
});
describe("getComputedStyle", function() {
@@ -1255,8 +1353,8 @@ describe("ngAnimate $animateCss", function() {
}
}));
- return function($$body, $rootElement) {
- $$body.append($rootElement);
+ return function($document, $rootElement) {
+ jqLite($document[0].body).append($rootElement);
};
}));
@@ -1337,10 +1435,142 @@ describe("ngAnimate $animateCss", function() {
expect(count.stagger).toBe(2);
}));
});
+
+ describe('transitionend/animationend event listeners', function() {
+ var element, elementOnSpy, elementOffSpy, progress;
+
+ function setStyles(event) {
+ switch (event) {
+ case TRANSITIONEND_EVENT:
+ ss.addRule('.ng-enter', 'transition: 10s linear all;');
+ progress = transitionProgress;
+ break;
+ case ANIMATIONEND_EVENT:
+ ss.addRule('.ng-enter', '-webkit-animation: animation 10s;' +
+ 'animation: animation 10s;');
+ progress = keyframeProgress;
+ break;
+ }
+ }
+
+ beforeEach(inject(function($rootElement, $document) {
+ element = jqLite('
');
+ $rootElement.append(element);
+ jqLite($document[0].body).append($rootElement);
+
+ elementOnSpy = spyOn(element, 'on').andCallThrough();
+ elementOffSpy = spyOn(element, 'off').andCallThrough();
+ }));
+
+ they('should remove the $prop event listeners on cancel',
+ [TRANSITIONEND_EVENT, ANIMATIONEND_EVENT], function(event) {
+ inject(function($animateCss) {
+
+ setStyles(event);
+
+ var animator = $animateCss(element, {
+ event: 'enter',
+ structural: true
+ });
+
+ var runner = animator.start();
+ triggerAnimationStartFrame();
+
+ expect(elementOnSpy).toHaveBeenCalledOnce();
+ expect(elementOnSpy.mostRecentCall.args[0]).toBe(event);
+
+ runner.cancel();
+
+ expect(elementOffSpy).toHaveBeenCalledOnce();
+ expect(elementOffSpy.mostRecentCall.args[0]).toBe(event);
+ });
+ });
+
+ they("should remove the $prop event listener when the animation is closed",
+ [TRANSITIONEND_EVENT, ANIMATIONEND_EVENT], function(event) {
+ inject(function($animateCss) {
+
+ setStyles(event);
+
+ var animator = $animateCss(element, {
+ event: 'enter',
+ structural: true
+ });
+
+ var runner = animator.start();
+ triggerAnimationStartFrame();
+
+ expect(elementOnSpy).toHaveBeenCalledOnce();
+ expect(elementOnSpy.mostRecentCall.args[0]).toBe(event);
+
+ progress(element, 10);
+
+ expect(elementOffSpy).toHaveBeenCalledOnce();
+ expect(elementOffSpy.mostRecentCall.args[0]).toBe(event);
+ });
+ });
+
+ they("should remove the $prop event listener when the closing timeout occurs",
+ [TRANSITIONEND_EVENT, ANIMATIONEND_EVENT], function(event) {
+ inject(function($animateCss, $timeout) {
+
+ setStyles(event);
+
+ var animator = $animateCss(element, {
+ event: 'enter',
+ structural: true
+ });
+
+ animator.start();
+ triggerAnimationStartFrame();
+
+ expect(elementOnSpy).toHaveBeenCalledOnce();
+ expect(elementOnSpy.mostRecentCall.args[0]).toBe(event);
+
+ $timeout.flush(15000);
+
+ expect(elementOffSpy).toHaveBeenCalledOnce();
+ expect(elementOffSpy.mostRecentCall.args[0]).toBe(event);
+ });
+ });
+
+ they("should not add or remove $prop event listeners when no animation styles are detected",
+ [TRANSITIONEND_EVENT, ANIMATIONEND_EVENT], function(event) {
+ inject(function($animateCss, $timeout) {
+
+ progress = event === TRANSITIONEND_EVENT ? transitionProgress : keyframeProgress;
+
+ // Make sure other event listeners are not affected
+ var otherEndSpy = jasmine.createSpy('otherEndSpy');
+ element.on(event, otherEndSpy);
+
+ expect(elementOnSpy).toHaveBeenCalledOnce();
+ elementOnSpy.reset();
+
+ var animator = $animateCss(element, {
+ event: 'enter',
+ structural: true
+ });
+
+ expect(animator.$$willAnimate).toBeFalsy();
+
+ // This will close the animation because no styles have been detected
+ var runner = animator.start();
+ triggerAnimationStartFrame();
+
+ expect(elementOnSpy).not.toHaveBeenCalled();
+ expect(elementOffSpy).not.toHaveBeenCalled();
+
+ progress(element, 10);
+ expect(otherEndSpy).toHaveBeenCalledOnce();
+ });
+ });
+
+ });
});
it('should avoid applying the same cache to an element a follow-up animation is run on the same element',
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
function endTransition(element, elapsedTime) {
browserTrigger(element, 'transitionend',
@@ -1357,7 +1587,7 @@ describe("ngAnimate $animateCss", function() {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
startAnimation(element, 0.5, 'red');
expect(element.attr('style')).toContain('transition');
@@ -1377,14 +1607,14 @@ describe("ngAnimate $animateCss", function() {
}));
it("should clear cache if no animation so follow-up animation on the same element will not be from cache",
- inject(function($animateCss, $rootElement, $$body, $$rAF) {
+ inject(function($animateCss, $rootElement, $document, $$rAF) {
var element = jqLite('
');
var options = {
event: 'enter',
structural: true
};
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var animator = $animateCss(element, options);
expect(animator.$$willAnimate).toBeFalsy();
@@ -1396,11 +1626,11 @@ describe("ngAnimate $animateCss", function() {
}));
it('should apply a custom temporary class when a non-structural animation is used',
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
$animateCss(element, {
event: 'super',
@@ -1416,10 +1646,10 @@ describe("ngAnimate $animateCss", function() {
describe("structural animations", function() {
they('should decorate the element with the ng-$prop CSS class',
['enter', 'leave', 'move'], function(event) {
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
$animateCss(element, {
event: event,
@@ -1433,10 +1663,10 @@ describe("ngAnimate $animateCss", function() {
they('should decorate the element with the ng-$prop-active CSS class',
['enter', 'leave', 'move'], function(event) {
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var animator = $animateCss(element, {
event: event,
@@ -1454,10 +1684,10 @@ describe("ngAnimate $animateCss", function() {
they('should remove the ng-$prop and ng-$prop-active CSS classes from the element once the animation is done',
['enter', 'leave', 'move'], function(event) {
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var animator = $animateCss(element, {
event: event,
@@ -1511,10 +1741,10 @@ describe("ngAnimate $animateCss", function() {
they('should place a CSS transition block after the preparation function to block accidental style changes',
['enter', 'leave', 'move', 'addClass', 'removeClass'], function(event) {
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.cool-animation', 'transition:1.5s linear all;');
element.addClass('cool-animation');
@@ -1541,10 +1771,10 @@ describe("ngAnimate $animateCss", function() {
they('should not place a CSS transition block if options.skipBlocking is provided',
['enter', 'leave', 'move', 'addClass', 'removeClass'], function(event) {
- inject(function($animateCss, $rootElement, $$body, $window) {
+ inject(function($animateCss, $rootElement, $document, $window) {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.cool-animation', 'transition:1.5s linear all;');
element.addClass('cool-animation');
@@ -1582,10 +1812,10 @@ describe("ngAnimate $animateCss", function() {
they('should place a CSS transition block after the preparation function even if a duration is provided',
['enter', 'leave', 'move', 'addClass', 'removeClass'], function(event) {
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
ss.addRule('.cool-animation', 'transition:1.5s linear all;');
element.addClass('cool-animation');
@@ -1616,11 +1846,11 @@ describe("ngAnimate $animateCss", function() {
});
it('should allow multiple events to be animated at the same time',
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
$animateCss(element, {
event: ['enter', 'leave', 'move'],
@@ -1688,10 +1918,10 @@ describe("ngAnimate $animateCss", function() {
they('should remove the class-$prop-add and class-$prop-active CSS classes from the element once the animation is done',
['enter', 'leave', 'move'], function(event) {
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var options = {};
options.event = event;
@@ -1713,7 +1943,7 @@ describe("ngAnimate $animateCss", function() {
they('should allow the class duration styles to be recalculated once started if the CSS classes being applied result new transition styles',
['add', 'remove'], function(event) {
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
var element = jqLite('
');
@@ -1728,7 +1958,7 @@ describe("ngAnimate $animateCss", function() {
}
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var options = {};
options[event + 'Class'] = 'natural-class';
@@ -1749,13 +1979,13 @@ describe("ngAnimate $animateCss", function() {
they('should force the class-based values to be applied early if no options.applyClassEarly is used as an option',
['enter', 'leave', 'move'], function(event) {
- inject(function($animateCss, $rootElement, $$body) {
+ inject(function($animateCss, $rootElement, $document) {
ss.addRule('.blue.ng-' + event, 'transition:2s linear all;');
var element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
var runner = $animateCss(element, {
addClass: 'blue',
@@ -1790,14 +2020,67 @@ describe("ngAnimate $animateCss", function() {
describe("options", function() {
var element;
beforeEach(module(function() {
- return function($rootElement, $$body) {
- $$body.append($rootElement);
+ return function($rootElement, $document) {
+ jqLite($document[0].body).append($rootElement);
element = jqLite('
');
$rootElement.append(element);
};
}));
+ it("should not alter the provided options input in any way throughout the animation", inject(function($animateCss) {
+ var initialOptions = {
+ from: { height: '50px' },
+ to: { width: '50px' },
+ addClass: 'one',
+ removeClass: 'two',
+ duration: 10,
+ delay: 10,
+ structural: true,
+ keyframeStyle: '1s rotate',
+ transitionStyle: '1s linear',
+ stagger: 0.5,
+ staggerIndex: 3
+ };
+
+ var copiedOptions = copy(initialOptions);
+ expect(copiedOptions).toEqual(initialOptions);
+
+ var animator = $animateCss(element, copiedOptions);
+ expect(copiedOptions).toEqual(initialOptions);
+
+ var runner = animator.start();
+ expect(copiedOptions).toEqual(initialOptions);
+
+ triggerAnimationStartFrame();
+ expect(copiedOptions).toEqual(initialOptions);
+
+ runner.end();
+ expect(copiedOptions).toEqual(initialOptions);
+ }));
+
+ it("should not create a copy of the provided options if they have already been prepared earlier",
+ inject(function($animate, $animateCss) {
+
+ var options = {
+ from: { height: '50px' },
+ to: { width: '50px' },
+ addClass: 'one',
+ removeClass: 'two'
+ };
+
+ options.$$prepared = true;
+ var runner = $animateCss(element, options).start();
+ runner.end();
+
+ $animate.flush();
+
+ expect(options.addClass).toBeFalsy();
+ expect(options.removeClass).toBeFalsy();
+ expect(options.to).toBeFalsy();
+ expect(options.from).toBeFalsy();
+ }));
+
describe("[$$skipPreparationClasses]", function() {
it('should not apply and remove the preparation classes to the element when true',
inject(function($animateCss) {
@@ -1874,7 +2157,7 @@ describe("ngAnimate $animateCss", function() {
triggerAnimationStartFrame();
- expect(element.css(prefix + 'animation-duration')).toEqual('5s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-duration')).toEqual('5s');
}));
it("should remove all inline keyframe styling when an animation completes if a custom duration was applied",
@@ -1915,7 +2198,7 @@ describe("ngAnimate $animateCss", function() {
triggerAnimationStartFrame();
- expect(element.css(prefix + 'animation-delay')).toEqual('5s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-delay')).toEqual('5s');
browserTrigger(element, 'animationend',
{ timeStamp: Date.now() + 5000, elapsedTime: 1.5 });
@@ -2069,7 +2352,7 @@ describe("ngAnimate $animateCss", function() {
triggerAnimationStartFrame();
- expect(element.css(prefix + 'animation-delay')).toEqual('400s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-delay')).toEqual('400s');
expect(element.attr('style')).not.toContain('transition-delay');
}));
@@ -2093,7 +2376,7 @@ describe("ngAnimate $animateCss", function() {
triggerAnimationStartFrame();
- expect(element.css(prefix + 'animation-delay')).toEqual('10s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-delay')).toEqual('10s');
expect(element.css('transition-delay')).toEqual('10s');
}));
@@ -2133,7 +2416,7 @@ describe("ngAnimate $animateCss", function() {
var assertionsRun = false;
classSpy = function() {
assertionsRun = true;
- expect(element.css(prefix + 'animation-delay')).toEqual('2s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-delay')).toEqual('2s');
expect(element.css('transition-delay')).toEqual('2s');
expect(element).not.toHaveClass('superman');
};
@@ -2167,8 +2450,8 @@ describe("ngAnimate $animateCss", function() {
it("should consider a negative value when delay:true is used with a keyframe animation",
inject(function($animateCss, $rootElement) {
- ss.addRule('.ng-enter', prefix + 'animation:2s keyframe_animation; ' +
- prefix + 'animation-delay: -1s;');
+ ss.addPossiblyPrefixedRule('.ng-enter', 'animation: 2s keyframe_animation; ' +
+ 'animation-delay: -1s;');
var options = {
delay: true,
@@ -2181,7 +2464,7 @@ describe("ngAnimate $animateCss", function() {
animator.start();
triggerAnimationStartFrame();
- expect(element.css(prefix + 'animation-delay')).toContain('-1s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-delay')).toContain('-1s');
}));
they("should consider a negative value when a negative option delay is provided for a $prop animation", {
@@ -2191,17 +2474,17 @@ describe("ngAnimate $animateCss", function() {
css: 'transition:2s linear all'
};
},
- 'keyframe': function(prefix) {
+ 'keyframe': function() {
return {
- prop: prefix + 'animation-delay',
- css: prefix + 'animation:2s keyframe_animation'
+ prop: 'animation-delay',
+ css: 'animation: 2s keyframe_animation'
};
}
}, function(testDetailsFactory) {
inject(function($animateCss, $rootElement) {
var testDetails = testDetailsFactory(prefix);
- ss.addRule('.ng-enter', testDetails.css);
+ ss.addPossiblyPrefixedRule('.ng-enter', testDetails.css);
var options = {
delay: -2,
event: 'enter',
@@ -2213,7 +2496,7 @@ describe("ngAnimate $animateCss", function() {
animator.start();
triggerAnimationStartFrame();
- expect(element.css(testDetails.prop)).toContain('-2s');
+ expect(getPossiblyPrefixedStyleValue(element, testDetails.prop)).toContain('-2s');
});
});
@@ -2224,18 +2507,18 @@ describe("ngAnimate $animateCss", function() {
css: 'transition:5s linear all; transition-delay: -2s'
};
},
- 'animation': function(prefix) {
+ 'animation': function() {
return {
event: 'animationend',
- css: prefix + 'animation:5s keyframe_animation; ' + prefix + 'animation-delay: -2s;'
+ css: 'animation: 5s keyframe_animation; animation-delay: -2s;'
};
}
}, function(testDetailsFactory) {
inject(function($animateCss, $rootElement) {
- var testDetails = testDetailsFactory(prefix);
+ var testDetails = testDetailsFactory();
var event = testDetails.event;
- ss.addRule('.ng-enter', testDetails.css);
+ ss.addPossiblyPrefixedRule('.ng-enter', testDetails.css);
var options = { event: 'enter', structural: true };
var animator = $animateCss(element, options);
@@ -2341,15 +2624,15 @@ describe("ngAnimate $animateCss", function() {
$animateCss(element, options).start();
triggerAnimationStartFrame();
- expect(element.css(prefix + 'transition-delay')).not.toEqual('4s');
- expect(element.css(prefix + 'transition-duration')).not.toEqual('6s');
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-delay')).not.toEqual('4s');
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-duration')).not.toEqual('6s');
options.to = { color: 'brown' };
$animateCss(element, options).start();
triggerAnimationStartFrame();
- expect(element.css(prefix + 'transition-delay')).toEqual('4s');
- expect(element.css(prefix + 'transition-duration')).toEqual('6s');
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-delay')).toEqual('4s');
+ expect(getPossiblyPrefixedStyleValue(element, 'transition-duration')).toEqual('6s');
}));
});
@@ -2422,9 +2705,9 @@ describe("ngAnimate $animateCss", function() {
triggerAnimationStartFrame();
- expect(element.css(prefix + 'animation-delay')).toEqual('50s');
- expect(element.css(prefix + 'animation-duration')).toEqual('5.5s');
- expect(element.css(prefix + 'animation-name')).toEqual('my_animation');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-delay')).toEqual('50s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-duration')).toEqual('5.5s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-name')).toEqual('my_animation');
}));
it("should be able to execute the animation if it is the only provided value",
@@ -2439,9 +2722,9 @@ describe("ngAnimate $animateCss", function() {
animator.start();
triggerAnimationStartFrame();
- expect(element.css(prefix + 'animation-delay')).toEqual('10s');
- expect(element.css(prefix + 'animation-duration')).toEqual('5.5s');
- expect(element.css(prefix + 'animation-name')).toEqual('my_animation');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-delay')).toEqual('10s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-duration')).toEqual('5.5s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-name')).toEqual('my_animation');
}));
});
@@ -2734,17 +3017,17 @@ describe("ngAnimate $animateCss", function() {
expect(element.css('transition-duration')).toMatch('10s');
- expect(element.css(prefix + 'animation-duration')).toEqual('10s');
+ expect(getPossiblyPrefixedStyleValue(element, 'animation-duration')).toEqual('10s');
}));
});
describe("[easing]", function() {
var element;
- beforeEach(inject(function($$body, $rootElement) {
+ beforeEach(inject(function($document, $rootElement) {
element = jqLite('
');
$rootElement.append(element);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
}));
it("should apply easing to a transition animation if it exists", inject(function($animateCss) {
@@ -2774,7 +3057,7 @@ describe("ngAnimate $animateCss", function() {
inject(function($animateCss) {
ss.addRule('.red', 'transition: 1s linear all;');
- ss.addRule('.blue', prefix + 'animation:my_keyframe 1s;');
+ ss.addPossiblyPrefixedRule('.blue', 'animation: 1s my_keyframe;');
var easing = 'ease-out';
var animator = $animateCss(element, { addClass: 'red blue', easing: easing });
animator.start();
@@ -2786,6 +3069,71 @@ describe("ngAnimate $animateCss", function() {
}));
});
+ describe("[cleanupStyles]", function() {
+ it("should cleanup [from] and [to] styles that have been applied for the animation when true",
+ inject(function($animateCss) {
+
+ var runner = $animateCss(element, {
+ duration: 1,
+ from: { background: 'gold' },
+ to: { color: 'brown' },
+ cleanupStyles: true
+ }).start();
+
+ assertStyleIsPresent(element, 'background', true);
+ assertStyleIsPresent(element, 'color', false);
+
+ triggerAnimationStartFrame();
+
+ assertStyleIsPresent(element, 'background', true);
+ assertStyleIsPresent(element, 'color', true);
+
+ runner.end();
+
+ assertStyleIsPresent(element, 'background', false);
+ assertStyleIsPresent(element, 'color', false);
+
+ function assertStyleIsPresent(element, style, bool) {
+ expect(element[0].style[style])[bool ? 'toBeTruthy' : 'toBeFalsy']();
+ }
+ }));
+
+ it('should restore existing overidden styles already present on the element when true',
+ inject(function($animateCss) {
+
+ element.css('height', '100px');
+ element.css('width', '111px');
+
+ var runner = $animateCss(element, {
+ duration: 1,
+ from: { height: '200px', 'font-size':'66px' },
+ to: { height: '300px', 'font-size': '99px', width: '222px' },
+ cleanupStyles: true
+ }).start();
+
+ assertStyle(element, 'height', '200px');
+ assertStyle(element, 'font-size', '66px');
+ assertStyle(element, 'width', '111px');
+
+ triggerAnimationStartFrame();
+
+ assertStyle(element, 'height', '300px');
+ assertStyle(element, 'width', '222px');
+ assertStyle(element, 'font-size', '99px');
+
+ runner.end();
+
+ assertStyle(element, 'width', '111px');
+ assertStyle(element, 'height', '100px');
+
+ expect(element[0].style.getPropertyValue('font-size')).not.toBe('66px');
+
+ function assertStyle(element, prop, value) {
+ expect(element[0].style.getPropertyValue(prop)).toBe(value);
+ }
+ }));
+ });
+
it('should round up long elapsedTime values to close off a CSS3 animation',
inject(function($animateCss) {
@@ -2812,13 +3160,13 @@ describe("ngAnimate $animateCss", function() {
describe('SVG', function() {
it('should properly apply transitions on an SVG element',
- inject(function($animateCss, $rootScope, $compile, $$body, $rootElement) {
+ inject(function($animateCss, $rootScope, $compile, $document, $rootElement) {
var element = $compile('' +
' ')($rootScope);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
$rootElement.append(element);
$animateCss(element, {
diff --git a/test/ngAnimate/animateSpec.js b/test/ngAnimate/animateSpec.js
index 06e06a867cfa..cdca20db8f6f 100644
--- a/test/ngAnimate/animateSpec.js
+++ b/test/ngAnimate/animateSpec.js
@@ -6,11 +6,18 @@ describe("animations", function() {
beforeEach(module('ngAnimateMock'));
var element, applyAnimationClasses;
+
+ beforeEach(module(function() {
+ return function($$jqLite) {
+ applyAnimationClasses = applyAnimationClassesFactory($$jqLite);
+ };
+ }));
+
afterEach(inject(function($$jqLite) {
- applyAnimationClasses = applyAnimationClassesFactory($$jqLite);
dealoc(element);
}));
+
it('should allow animations if the application is bootstrapped on the document node', function() {
var capturedAnimation;
@@ -26,12 +33,12 @@ describe("animations", function() {
});
});
- inject(function($animate, $rootScope, $$body) {
+ inject(function($animate, $rootScope, $document) {
$animate.enabled(true);
element = jqLite('
');
- $animate.enter(element, $$body);
+ $animate.enter(element, jqLite($document[0].body));
$rootScope.$digest();
expect(capturedAnimation).toBeTruthy();
@@ -116,7 +123,7 @@ describe("animations", function() {
return overriddenAnimationRunner || defaultFakeAnimationRunner;
});
- return function($rootElement, $q, $animate, $$AnimateRunner, $$body) {
+ return function($rootElement, $q, $animate, $$AnimateRunner, $document) {
defaultFakeAnimationRunner = new $$AnimateRunner();
$animate.enabled(true);
@@ -126,10 +133,53 @@ describe("animations", function() {
$rootElement.append(parent);
$rootElement.append(parent2);
- $$body.append($rootElement);
+ jqLite($document[0].body).append($rootElement);
+ };
+ }));
+
+ it("should not alter the provided options input in any way throughout the animation", inject(function($animate, $rootScope) {
+ var initialOptions = {
+ from: { height: '50px' },
+ to: { width: '50px' },
+ addClass: 'one',
+ removeClass: 'two'
};
+
+ var copiedOptions = copy(initialOptions);
+ expect(copiedOptions).toEqual(initialOptions);
+
+ var runner = $animate.enter(element, parent, null, copiedOptions);
+ expect(copiedOptions).toEqual(initialOptions);
+
+ $rootScope.$digest();
+ expect(copiedOptions).toEqual(initialOptions);
}));
+ it("should skip animations entirely if the document is hidden", function() {
+ var doc;
+
+ module(function($provide) {
+ doc = jqLite({
+ body: document.body,
+ hidden: true
+ });
+ $provide.value('$document', doc);
+ });
+
+ inject(function($animate, $rootScope) {
+ $animate.enter(element, parent);
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeFalsy();
+ expect(element[0].parentNode).toEqual(parent[0]);
+
+ doc[0].hidden = false;
+
+ $animate.leave(element);
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeTruthy();
+ });
+ });
+
it('should animate only the specified CSS className matched within $animateProvider.classNameFilter', function() {
module(function($animateProvider) {
$animateProvider.classNameFilter(/only-allow-this-animation/);
@@ -149,20 +199,24 @@ describe("animations", function() {
});
});
- they('should nullify both options.$prop when passed into an animation if it is not a string or an array', ['addClass', 'removeClass'], function(prop) {
+ they('should not apply the provided options.$prop value unless it\'s a string or string-based array', ['addClass', 'removeClass'], function(prop) {
inject(function($animate, $rootScope) {
+ var startingCssClasses = element.attr('class') || '';
+
var options1 = {};
options1[prop] = function() {};
$animate.enter(element, parent, null, options1);
- expect(options1[prop]).toBeFalsy();
+ expect(element.attr('class')).toEqual(startingCssClasses);
+
$rootScope.$digest();
var options2 = {};
options2[prop] = true;
$animate.leave(element, options2);
- expect(options2[prop]).toBeFalsy();
+ expect(element.attr('class')).toEqual(startingCssClasses);
+
$rootScope.$digest();
capturedAnimation = null;
@@ -170,11 +224,15 @@ describe("animations", function() {
var options3 = {};
if (prop === 'removeClass') {
element.addClass('fatias');
+ startingCssClasses = element.attr('class');
}
options3[prop] = ['fatias'];
$animate.enter(element, parent, null, options3);
- expect(options3[prop]).toBe('fatias');
+
+ $rootScope.$digest();
+
+ expect(element.attr('class')).not.toEqual(startingCssClasses);
});
});
@@ -278,6 +336,35 @@ describe("animations", function() {
$rootScope.$digest();
expect(capturedAnimation).toBeTruthy();
}));
+
+ it('should run animations on an element and its children if explicitly enabled, even if animations are disabled on the parent',
+ inject(function($animate, $rootScope) {
+
+ var child = jqLite('
');
+ element.append(child);
+ parent.append(element);
+
+ $animate.enabled(parent, false);
+
+ $animate.addClass(element, 'red');
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeFalsy();
+
+ $animate.addClass(child, 'red');
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeFalsy();
+
+ $animate.enabled(element, true);
+
+ $animate.addClass(element, 'blue');
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeTruthy();
+ capturedAnimation = null;
+
+ $animate.addClass(child, 'blue');
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeTruthy();
+ }));
});
it('should strip all comment nodes from the animation and not issue an animation if not real elements are found',
@@ -308,6 +395,19 @@ describe("animations", function() {
expect(capturedAnimation).toBeFalsy();
}));
+ it('should not attempt to perform an animation on an empty jqLite collection',
+ inject(function($rootScope, $animate) {
+
+ element.html('');
+ var emptyNode = jqLite(element[0].firstChild);
+
+ $animate.addClass(emptyNode, 'some-class');
+ $rootScope.$digest();
+
+ expect(capturedAnimation).toBeFalsy();
+ })
+ );
+
it('should perform the leave domOperation if a text node is used',
inject(function($rootScope, $animate) {
@@ -749,7 +849,7 @@ describe("animations", function() {
}));
it("should disable all child animations for atleast one turn when a structural animation is issued",
- inject(function($animate, $rootScope, $compile, $$body, $rootElement, $$AnimateRunner) {
+ inject(function($animate, $rootScope, $compile, $document, $rootElement, $$AnimateRunner) {
element = $compile(
'' +
@@ -759,7 +859,7 @@ describe("animations", function() {
'
');
+ var runner = $animate.enter(element, $rootElement);
+ $rootScope.$digest();
+
+ $animate.flush();
+
+ expect(capturedAnimation).toBeUndefined();
+ });
+ });
+
describe('[ng-animate-children]', function() {
var parent, element, child, capturedAnimation, captureLog;
beforeEach(module(function($provide) {
@@ -1284,8 +1446,8 @@ describe("animations", function() {
return new $$AnimateRunner();
};
});
- return function($rootElement, $$body, $animate) {
- $$body.append($rootElement);
+ return function($rootElement, $document, $animate) {
+ jqLite($document[0].body).append($rootElement);
parent = jqLite('
');
element = jqLite('
');
child = jqLite('
');
@@ -1373,6 +1535,22 @@ describe("animations", function() {
dealoc(element);
dealoc(child);
}));
+
+ it('should respect the value if the directive is on an element with ngIf',
+ inject(function($rootScope, $rootElement, $compile) {
+
+ parent.attr('ng-animate-children', 'true');
+ parent.attr('ng-if', 'true');
+ element.attr('ng-if', 'true');
+
+ $rootElement.append(parent);
+ parent.append(element);
+
+ $compile(parent)($rootScope);
+ $rootScope.$digest();
+
+ expect(captureLog.length).toBe(2);
+ }));
});
describe('.pin()', function() {
@@ -1386,59 +1564,156 @@ describe("animations", function() {
return new $$AnimateRunner();
};
});
- }));
- it('should allow an element to pinned elsewhere and still be available in animations',
- inject(function($animate, $compile, $$body, $rootElement, $rootScope) {
+ return function($animate) {
+ $animate.enabled(true);
+ };
+ }));
- var innerParent = jqLite('
');
- $$body.append(innerParent);
- innerParent.append($rootElement);
+ it('should throw if the arguments are not elements',
+ inject(function($animate, $rootElement) {
var element = jqLite('
');
- $$body.append(element);
- $animate.addClass(element, 'red');
- $rootScope.$digest();
- expect(capturedAnimation).toBeFalsy();
-
- $animate.pin(element, $rootElement);
+ expect(function() {
+ $animate.pin(element);
+ }).toThrowMinErr('ng', 'areq', 'Argument \'parentElement\' is not an element');
- $animate.addClass(element, 'blue');
- $rootScope.$digest();
- expect(capturedAnimation).toBeTruthy();
+ expect(function() {
+ $animate.pin(null, $rootElement);
+ }).toThrowMinErr('ng', 'areq', 'Argument \'element\' is not an element');
dealoc(element);
}));
- it('should adhere to the disabled state of the hosted parent when an element is pinned',
- inject(function($animate, $compile, $$body, $rootElement, $rootScope) {
- var innerParent = jqLite('
');
- $$body.append(innerParent);
- innerParent.append($rootElement);
- var innerChild = jqLite('
');
- $rootElement.append(innerChild);
+ they('should animate an element inside a pinned element that is the $prop element',
+ ['same', 'parent', 'grandparent'],
+ function(elementRelation) {
+ inject(function($animate, $document, $rootElement, $rootScope) {
- var element = jqLite('
');
- $$body.append(element);
+ var pinElement, animateElement;
- $animate.pin(element, innerChild);
+ var innerParent = jqLite('
');
+ jqLite($document[0].body).append(innerParent);
+ innerParent.append($rootElement);
- $animate.enabled(innerChild, false);
+ switch (elementRelation) {
+ case 'same':
+ pinElement = jqLite('
');
+ break;
+ case 'parent':
+ pinElement = jqLite('');
+ break;
+ case 'grandparent':
+ pinElement = jqLite('');
+ break;
+ }
- $animate.addClass(element, 'blue');
- $rootScope.$digest();
- expect(capturedAnimation).toBeFalsy();
+ jqLite($document[0].body).append(pinElement);
+ animateElement = jqLite($document[0].getElementById('animate'));
- $animate.enabled(innerChild, true);
+ $animate.addClass(animateElement, 'red');
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeFalsy();
- $animate.addClass(element, 'red');
- $rootScope.$digest();
- expect(capturedAnimation).toBeTruthy();
+ // Pin the element to the app root to enable animations
+ $animate.pin(pinElement, $rootElement);
- dealoc(element);
- }));
+ $animate.addClass(animateElement, 'blue');
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeTruthy();
+
+ dealoc(pinElement);
+ });
+ });
+
+ they('should not animate an element when the pinned ($prop) element, is pinned to an element that is not a child of the $rootElement',
+ ['same', 'parent', 'grandparent'],
+ function(elementRelation) {
+ inject(function($animate, $document, $rootElement, $rootScope) {
+
+ var pinElement, animateElement, pinTargetElement = jqLite('
');
+
+ var innerParent = jqLite('
');
+ jqLite($document[0].body).append(innerParent);
+ innerParent.append($rootElement);
+
+ switch (elementRelation) {
+ case 'same':
+ pinElement = jqLite('
');
+ break;
+ case 'parent':
+ pinElement = jqLite('');
+ break;
+ case 'grandparent':
+ pinElement = jqLite('');
+ break;
+ }
+
+ // Append both the pin element and the pinTargetElement outside the app root
+ jqLite($document[0].body).append(pinElement);
+ jqLite($document[0].body).append(pinTargetElement);
+
+ animateElement = jqLite($document[0].getElementById('animate'));
+
+ $animate.addClass(animateElement, 'red');
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeFalsy();
+
+ $animate.pin(pinElement, pinTargetElement);
+
+ $animate.addClass(animateElement, 'blue');
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeFalsy();
+
+ dealoc(pinElement);
+ });
+ });
+
+ they('should adhere to the disabled state of the hosted parent when the $prop element is pinned',
+ ['same', 'parent', 'grandparent'],
+ function(elementRelation) {
+ inject(function($animate, $document, $rootElement, $rootScope) {
+
+ var pinElement, animateElement, pinHostElement = jqLite('
');
+
+ var innerParent = jqLite('
');
+ jqLite($document[0].body).append(innerParent);
+ innerParent.append($rootElement);
+
+ switch (elementRelation) {
+ case 'same':
+ pinElement = jqLite('
');
+ break;
+ case 'parent':
+ pinElement = jqLite('');
+ break;
+ case 'grandparent':
+ pinElement = jqLite('');
+ break;
+ }
+
+ $rootElement.append(pinHostElement);
+ jqLite($document[0].body).append(pinElement);
+ animateElement = jqLite($document[0].getElementById('animate'));
+
+ $animate.pin(pinElement, pinHostElement);
+ $animate.enabled(pinHostElement, false);
+
+ $animate.addClass(animateElement, 'blue');
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeFalsy();
+
+ $animate.enabled(pinHostElement, true);
+
+ $animate.addClass(animateElement, 'red');
+ $rootScope.$digest();
+ expect(capturedAnimation).toBeTruthy();
+
+ dealoc(pinElement);
+ });
+ });
});
describe('callbacks', function() {
@@ -1456,17 +1731,19 @@ describe("animations", function() {
};
});
- return function($$body, $rootElement, $animate) {
- $$body.append($rootElement);
+ return function($document, $rootElement, $animate) {
+ if ($document !== $rootElement) {
+ jqLite($document[0].body).append($rootElement);
+ }
$animate.enabled(true);
};
}));
it('should trigger a callback for an enter animation',
- inject(function($animate, $rootScope, $rootElement, $$body) {
+ inject(function($animate, $rootScope, $rootElement, $document) {
var callbackTriggered = false;
- $animate.on('enter', $$body, function() {
+ $animate.on('enter', jqLite($document[0].body), function() {
callbackTriggered = true;
});
@@ -1480,12 +1757,12 @@ describe("animations", function() {
}));
it('should fire the callback with the signature of (element, phase, data)',
- inject(function($animate, $rootScope, $rootElement, $$body) {
+ inject(function($animate, $rootScope, $rootElement, $document) {
var capturedElement;
var capturedPhase;
var capturedData;
- $animate.on('enter', $$body,
+ $animate.on('enter', jqLite($document[0].body),
function(element, phase, data) {
capturedElement = element;
@@ -1519,7 +1796,6 @@ describe("animations", function() {
element = jqLite('
');
$animate.enter(element, $rootElement);
$rootScope.$digest();
- $animate.flush();
expect(callbackTriggered).toBe(false);
}));
@@ -1544,13 +1820,13 @@ describe("animations", function() {
}));
it('should remove all the event-based event listeners when $animate.off(event) is called',
- inject(function($animate, $rootScope, $rootElement, $$body) {
+ inject(function($animate, $rootScope, $rootElement, $document) {
element = jqLite('
');
var count = 0;
$animate.on('enter', element, counter);
- $animate.on('enter', $$body, counter);
+ $animate.on('enter', jqLite($document[0].body), counter);
function counter(element, phase) {
count++;
@@ -1572,13 +1848,13 @@ describe("animations", function() {
}));
it('should remove the container-based event listeners when $animate.off(event, container) is called',
- inject(function($animate, $rootScope, $rootElement, $$body) {
+ inject(function($animate, $rootScope, $rootElement, $document) {
element = jqLite('
');
var count = 0;
$animate.on('enter', element, counter);
- $animate.on('enter', $$body, counter);
+ $animate.on('enter', jqLite($document[0].body), counter);
function counter(element, phase) {
if (phase === 'start') {
@@ -1592,7 +1868,7 @@ describe("animations", function() {
expect(count).toBe(2);
- $animate.off('enter', $$body);
+ $animate.off('enter', jqLite($document[0].body));
$animate.enter(element, $rootElement);
$rootScope.$digest();
@@ -1638,13 +1914,13 @@ describe("animations", function() {
}));
it('should fire a `start` callback when the animation starts with the matching element',
- inject(function($animate, $rootScope, $rootElement, $$body) {
+ inject(function($animate, $rootScope, $rootElement, $document) {
element = jqLite('
');
var capturedState;
var capturedElement;
- $animate.on('enter', $$body, function(element, phase) {
+ $animate.on('enter', jqLite($document[0].body), function(element, phase) {
capturedState = phase;
capturedElement = element;
});
@@ -1658,13 +1934,13 @@ describe("animations", function() {
}));
it('should fire a `close` callback when the animation ends with the matching element',
- inject(function($animate, $rootScope, $rootElement, $$body) {
+ inject(function($animate, $rootScope, $rootElement, $document) {
element = jqLite('
');
var capturedState;
var capturedElement;
- $animate.on('enter', $$body, function(element, phase) {
+ $animate.on('enter', jqLite($document[0].body), function(element, phase) {
capturedState = phase;
capturedElement = element;
});
@@ -1707,6 +1983,69 @@ describe("animations", function() {
expect(count).toBe(1);
}));
+ it('should always detect registered callbacks after one postDigest has fired',
+ inject(function($animate, $rootScope, $rootElement) {
+
+ element = jqLite('
');
+
+ var spy = jasmine.createSpy();
+ registerCallback();
+
+ var runner = $animate.enter(element, $rootElement);
+ registerCallback();
+
+ $rootScope.$digest();
+ registerCallback();
+
+ expect(spy.callCount).toBe(0);
+ $animate.flush();
+
+ // this is not 3 since the 3rd callback
+ // was added after the first callback
+ // was fired
+ expect(spy.callCount).toBe(2);
+
+ spy.reset();
+ runner.end();
+
+ $animate.flush();
+
+ // now we expect all three callbacks
+ // to fire when the animation ends since
+ // the callback detection happens again
+ expect(spy.callCount).toBe(3);
+
+ function registerCallback() {
+ $animate.on('enter', element, spy);
+ }
+ }));
+
+ it('should use RAF if there are detected callbacks within the hierachy of the element being animated',
+ inject(function($animate, $rootScope, $rootElement, $$rAF) {
+
+ var runner;
+
+ element = jqLite('
');
+ runner = $animate.enter(element, $rootElement);
+ $rootScope.$digest();
+ runner.end();
+
+ assertRAFsUsed(false);
+
+ var spy = jasmine.createSpy();
+ $animate.on('leave', element, spy);
+
+ runner = $animate.leave(element, $rootElement);
+ $rootScope.$digest();
+ runner.end();
+
+ assertRAFsUsed(true);
+
+ function assertRAFsUsed(bool) {
+ expect($$rAF.queue.length)[bool ? 'toBeGreaterThan' : 'toBe'](0);
+ }
+ }));
+
it('leave: should remove the element even if another animation is called after',
inject(function($animate, $rootScope, $rootElement) {
@@ -1725,5 +2064,285 @@ describe("animations", function() {
expect(isElementRemoved).toBe(true);
}));
+ it('leave : should trigger a callback for an leave animation',
+ inject(function($animate, $rootScope, $$rAF, $rootElement, $document) {
+
+ var callbackTriggered = false;
+ $animate.on('leave', jqLite($document[0].body), function() {
+ callbackTriggered = true;
+ });
+
+ element = jqLite('
');
+ $rootElement.append(element);
+ $animate.leave(element, $rootElement);
+ $rootScope.$digest();
+
+ $$rAF.flush();
+
+ expect(callbackTriggered).toBe(true);
+ }));
+
+ it('leave : should not fire a callback if the element is outside of the given container',
+ inject(function($animate, $rootScope, $$rAF, $rootElement) {
+
+ var callbackTriggered = false;
+ var innerContainer = jqLite('
');
+ $rootElement.append(innerContainer);
+
+ $animate.on('leave', innerContainer,
+ function(element, phase, data) {
+ callbackTriggered = true;
+ });
+
+ element = jqLite('
');
+ $rootElement.append(element);
+ $animate.leave(element, $rootElement);
+ $rootScope.$digest();
+
+ expect(callbackTriggered).toBe(false);
+ }));
+
+ it('leave : should fire a `start` callback when the animation starts with the matching element',
+ inject(function($animate, $rootScope, $$rAF, $rootElement, $document) {
+
+ element = jqLite('
');
+
+ var capturedState;
+ var capturedElement;
+ $animate.on('leave', jqLite($document[0].body), function(element, phase) {
+ capturedState = phase;
+ capturedElement = element;
+ });
+
+ $rootElement.append(element);
+ $animate.leave(element, $rootElement);
+ $rootScope.$digest();
+ $$rAF.flush();
+
+ expect(capturedState).toBe('start');
+ expect(capturedElement).toBe(element);
+ }));
+
+ it('leave : should fire a `close` callback when the animation ends with the matching element',
+ inject(function($animate, $rootScope, $$rAF, $rootElement, $document) {
+
+ element = jqLite('
');
+
+ var capturedState;
+ var capturedElement;
+ $animate.on('leave', jqLite($document[0].body), function(element, phase) {
+ capturedState = phase;
+ capturedElement = element;
+ });
+
+ $rootElement.append(element);
+ var runner = $animate.leave(element, $rootElement);
+ $rootScope.$digest();
+ runner.end();
+ $$rAF.flush();
+
+ expect(capturedState).toBe('close');
+ expect(capturedElement).toBe(element);
+ }));
+
+ they('should trigger a callback for a $prop animation if the listener is on the document',
+ ['enter', 'leave'], function($event) {
+ module(function($provide) {
+ $provide.factory('$rootElement', function($document) {
+ // Since we listen on document, $document must be the $rootElement for animations to work
+ return $document;
+ });
+ });
+
+ inject(function($animate, $rootScope, $document) {
+
+ var callbackTriggered = false;
+
+
+ $animate.on($event, $document[0], function() {
+ callbackTriggered = true;
+ });
+
+ var container = jqLite('
');
+ jqLite($document[0].body).append(container);
+ element = jqLite('
');
+
+ if ($event === 'leave') {
+ container.append(element);
+ }
+
+ $animate[$event](element, container);
+ $rootScope.$digest();
+
+ $animate.flush();
+
+ expect(callbackTriggered).toBe(true);
+ });
+ });
+
+ describe('when animations are skipped, disabled, or invalid', function() {
+
+ var overriddenAnimationRunner;
+ var capturedAnimation;
+ var capturedAnimationHistory;
+ var defaultFakeAnimationRunner;
+ var parent;
+ var parent2;
+
+ beforeEach(module(function($provide) {
+ overriddenAnimationRunner = null;
+ capturedAnimation = null;
+ capturedAnimationHistory = [];
+
+ $provide.value('$$animation', function() {
+ capturedAnimationHistory.push(capturedAnimation = arguments);
+ return overriddenAnimationRunner || defaultFakeAnimationRunner;
+ });
+
+ return function($rootElement, $q, $animate, $$AnimateRunner, $document) {
+ defaultFakeAnimationRunner = new $$AnimateRunner();
+ $animate.enabled(true);
+
+ element = jqLite('element
');
+ parent = jqLite('parent
');
+ parent2 = jqLite('parent
');
+
+ $rootElement.append(parent);
+ $rootElement.append(parent2);
+ jqLite($document[0].body).append($rootElement);
+ };
+ }));
+
+
+ it('should trigger all callbacks if a follow-up structural animation takes over a running animation',
+ inject(function($animate, $rootScope) {
+
+ parent.append(element);
+ var moveSpy = jasmine.createSpy();
+ var leaveSpy = jasmine.createSpy();
+
+ $animate.on('move', parent2, moveSpy);
+ $animate.on('leave', parent2, leaveSpy);
+
+ $animate.move(element, parent2);
+
+ $rootScope.$digest();
+ $animate.flush();
+
+ expect(moveSpy.calls.length).toBe(1);
+ expect(moveSpy.mostRecentCall.args[1]).toBe('start');
+
+ $animate.leave(element);
+ $rootScope.$digest();
+ $animate.flush();
+
+ expect(moveSpy.calls.length).toBe(2);
+ expect(moveSpy.mostRecentCall.args[1]).toBe('close');
+
+ expect(leaveSpy.calls.length).toBe(2);
+ expect(leaveSpy.calls[0].args[1]).toBe('start');
+ expect(leaveSpy.calls[1].args[1]).toBe('close');
+ }));
+
+
+ it('should not trigger callbacks for the previous structural animation if a follow-up structural animation takes over before the postDigest',
+ inject(function($animate, $rootScope) {
+
+ var enterDone = jasmine.createSpy('enter animation done');
+
+ var enterSpy = jasmine.createSpy();
+ var leaveSpy = jasmine.createSpy();
+
+ $animate.on('enter', parent, enterSpy);
+ $animate.on('leave', parent, leaveSpy);
+
+ $animate.enter(element, parent).done(enterDone);
+ expect(enterDone).not.toHaveBeenCalled();
+
+ var runner = $animate.leave(element);
+ $animate.flush();
+ expect(enterDone).toHaveBeenCalled();
+
+ expect(enterSpy).not.toHaveBeenCalled();
+ expect(leaveSpy.calls.length).toBe(1);
+ expect(leaveSpy.mostRecentCall.args[1]).toBe('start');
+
+ leaveSpy.reset();
+ runner.end();
+ $animate.flush();
+
+ expect(enterSpy).not.toHaveBeenCalled();
+ expect(leaveSpy.calls.length).toBe(1);
+ expect(leaveSpy.mostRecentCall.args[1]).toBe('close');
+ }));
+
+
+ it('should not trigger the callback if animations are disabled on the element',
+ inject(function($animate, $rootScope, $rootElement, $document) {
+
+ var callbackTriggered = false;
+ var spy = jasmine.createSpy('enter');
+ $animate.on('enter', jqLite($document[0].body), spy);
+
+ element = jqLite('
');
+ $animate.enabled(element, false);
+ var runner = $animate.enter(element, $rootElement);
+ $rootScope.$digest();
+
+ $animate.flush(); // Flushes the animation frames for the callbacks
+
+ expect(spy).not.toHaveBeenCalled();
+ }));
+
+
+ it('should not trigger the callbacks if the animation is skipped because there are no class-based animations and no structural animation',
+ inject(function($animate, $rootScope) {
+
+ parent.append(element);
+ var classSpy = jasmine.createSpy('classChange');
+ $animate.on('addClass', element, classSpy);
+ $animate.on('removeClass', element, classSpy);
+ element.addClass('one three');
+
+ $animate.addClass(element, 'one');
+ $animate.removeClass(element, 'four');
+
+ $rootScope.$digest();
+ $animate.flush();
+ expect(classSpy).not.toHaveBeenCalled();
+ }));
+
+
+ describe('because the document is hidden', function() {
+ beforeEach(module(function($provide) {
+ var doc = jqLite({
+ body: document.body,
+ hidden: true
+ });
+ $provide.value('$document', doc);
+ }));
+
+ it('should trigger callbacks for an enter animation',
+ inject(function($animate, $rootScope, $rootElement, $document) {
+
+ var callbackTriggered = false;
+ var spy = jasmine.createSpy();
+ $animate.on('enter', jqLite($document[0].body), spy);
+
+ element = jqLite('
');
+ var runner = $animate.enter(element, $rootElement);
+ $rootScope.$digest();
+
+ $animate.flush(); // Flushes the animation frames for the callbacks
+
+ expect(spy.calls.length).toBe(2);
+ expect(spy.calls[0].args[1]).toBe('start');
+ expect(spy.calls[1].args[1]).toBe('close');
+ }));
+ });
+
+
+ });
+
});
});
diff --git a/test/ngAnimate/animationHelperFunctionsSpec.js b/test/ngAnimate/animationHelperFunctionsSpec.js
index eb66e6205555..ba77869f11e7 100644
--- a/test/ngAnimate/animationHelperFunctionsSpec.js
+++ b/test/ngAnimate/animationHelperFunctionsSpec.js
@@ -110,7 +110,7 @@ describe("animation option helper functions", function() {
}));
});
- describe('mergeAnimationOptions', function() {
+ describe('mergeAnimationDetails', function() {
it('should merge in new options', inject(function() {
element.attr('class', 'blue');
var options = prepareAnimationOptions({
@@ -120,11 +120,16 @@ describe("animation option helper functions", function() {
removeClass: 'blue gold'
});
- mergeAnimationOptions(element, options, {
- age: 29,
- addClass: 'gold brown',
- removeClass: 'orange'
- });
+ var animation1 = { options: options };
+ var animation2 = {
+ options: {
+ age: 29,
+ addClass: 'gold brown',
+ removeClass: 'orange'
+ }
+ };
+
+ mergeAnimationDetails(element, animation1, animation2);
expect(options.name).toBe('matias');
expect(options.age).toBe(29);
diff --git a/test/ngAnimate/animationSpec.js b/test/ngAnimate/animationSpec.js
index ff5d998076cf..dcce9c1219f7 100644
--- a/test/ngAnimate/animationSpec.js
+++ b/test/ngAnimate/animationSpec.js
@@ -513,6 +513,25 @@ describe('$$animation', function() {
expect(captureLog[1].element).toBe(child);
expect(captureLog[2].element).toBe(grandchild);
}));
+
+
+ they('should add the preparation class before the $prop-animation is pushed to the queue',
+ ['enter', 'leave', 'move'], function(animationType) {
+ inject(function($$animation, $rootScope, $animate) {
+ var runner = $$animation(element, animationType);
+ expect(element).toHaveClass('ng-' + animationType + '-prepare');
+ });
+ });
+
+
+ they('should remove the preparation class before the $prop-animation starts',
+ ['enter', 'leave', 'move'], function(animationType) {
+ inject(function($$animation, $rootScope, $$rAF) {
+ var runner = $$animation(element, animationType);
+ $rootScope.$digest();
+ expect(element).not.toHaveClass('ng-' + animationType + '-prepare');
+ });
+ });
});
describe("grouped", function() {
@@ -836,8 +855,8 @@ describe('$$animation', function() {
element = jqLite('
');
parent = jqLite('
');
- return function($$AnimateRunner, $q, $rootElement, $$body) {
- $$body.append($rootElement);
+ return function($$AnimateRunner, $rootElement, $document) {
+ jqLite($document[0].body).append($rootElement);
$rootElement.append(parent);
mockedDriverFn = function(element, method, options, domOperation) {
diff --git a/test/ngAnimate/bodySpec.js b/test/ngAnimate/bodySpec.js
deleted file mode 100644
index f87dabf1e355..000000000000
--- a/test/ngAnimate/bodySpec.js
+++ /dev/null
@@ -1,9 +0,0 @@
-'use strict';
-
-describe('$$body', function() {
- beforeEach(module('ngAnimate'));
-
- it("should inject $document", inject(function($$body, $document) {
- expect($$body).toEqual(jqLite($document[0].body));
- }));
-});
diff --git a/test/ngAnimate/integrationSpec.js b/test/ngAnimate/integrationSpec.js
index 5e1e335b72f4..3fee45965b50 100644
--- a/test/ngAnimate/integrationSpec.js
+++ b/test/ngAnimate/integrationSpec.js
@@ -7,12 +7,12 @@ describe('ngAnimate integration tests', function() {
var element, html, ss;
beforeEach(module(function() {
- return function($rootElement, $document, $$body, $window, $animate) {
+ return function($rootElement, $document, $animate) {
$animate.enabled(true);
- ss = createMockStyleSheet($document, $window);
+ ss = createMockStyleSheet($document);
- var body = $$body;
+ var body = jqLite($document[0].body);
html = function(element) {
body.append($rootElement);
$rootElement.append(element);
@@ -25,9 +25,56 @@ describe('ngAnimate integration tests', function() {
ss.destroy();
});
+ it('should cancel a running and started removeClass animation when a follow-up addClass animation adds the same class',
+ inject(function($animate, $rootScope, $$rAF, $document, $rootElement) {
+
+ jqLite($document[0].body).append($rootElement);
+ element = jqLite('
');
+ $rootElement.append(element);
+
+ element.addClass('active-class');
+
+ var runner = $animate.removeClass(element, 'active-class');
+ $rootScope.$digest();
+
+ var doneHandler = jasmine.createSpy('addClass done');
+ runner.done(doneHandler);
+
+ $$rAF.flush(); // Trigger the actual animation
+
+ expect(doneHandler).not.toHaveBeenCalled();
+
+ $animate.addClass(element, 'active-class');
+ $rootScope.$digest();
+
+ // Cancelling the removeClass animation triggers the done callback
+ expect(doneHandler).toHaveBeenCalled();
+ }));
+
describe('CSS animations', function() {
if (!browserSupportsCssAnimations()) return;
+ it("should only create a single copy of the provided animation options",
+ inject(function($rootScope, $rootElement, $animate) {
+
+ ss.addRule('.animate-me', 'transition:2s linear all;');
+
+ var element = jqLite('
');
+ html(element);
+
+ var myOptions = {to: { 'color': 'red' }};
+
+ var spy = spyOn(window, 'copy');
+ expect(spy).not.toHaveBeenCalled();
+
+ var animation = $animate.leave(element, myOptions);
+ $rootScope.$digest();
+ $animate.flush();
+
+ expect(spy).toHaveBeenCalledOnce();
+ dealoc(element);
+ }));
+
they('should render an $prop animation',
['enter', 'leave', 'move', 'addClass', 'removeClass', 'setClass'], function(event) {
@@ -268,6 +315,42 @@ describe('ngAnimate integration tests', function() {
});
});
+ it('should add the preparation class for an enter animation before a parent class-based animation is applied', function() {
+ module('ngAnimateMock');
+ inject(function($animate, $compile, $rootScope, $rootElement, $document) {
+ element = jqLite(
+ ''
+ );
+
+ ss.addRule('.ng-enter', 'transition:2s linear all;');
+ ss.addRule('.parent-add', 'transition:5s linear all;');
+
+ $rootElement.append(element);
+ jqLite($document[0].body).append($rootElement);
+
+ $compile(element)($rootScope);
+ $rootScope.exp = true;
+ $rootScope.$digest();
+
+ var parent = element;
+ var child = element.find('div');
+
+ expect(parent).not.toHaveClass('parent');
+ expect(parent).toHaveClass('parent-add');
+ expect(child).not.toHaveClass('ng-enter');
+ expect(child).toHaveClass('ng-enter-prepare');
+
+ $animate.flush();
+ expect(parent).toHaveClass('parent parent-add parent-add-active');
+ expect(child).toHaveClass('ng-enter ng-enter-active');
+ expect(child).not.toHaveClass('ng-enter-prepare');
+ });
+ });
+
+
it('should pack level elements into their own RAF flush', function() {
module('ngAnimateMock');
inject(function($animate, $compile, $rootScope, $rootElement, $document) {
@@ -319,6 +402,103 @@ describe('ngAnimate integration tests', function() {
}
});
});
+
+ it('should trigger callbacks at the start and end of an animation',
+ inject(function($rootScope, $rootElement, $animate, $compile) {
+
+ ss.addRule('.animate-me', 'transition:2s linear all;');
+
+ var parent = jqLite('');
+ element = parent.find('div');
+ html(parent);
+
+ $compile(parent)($rootScope);
+ $rootScope.$digest();
+
+ var spy = jasmine.createSpy();
+ $animate.on('enter', parent, spy);
+
+ $rootScope.exp = true;
+ $rootScope.$digest();
+
+ element = parent.find('div');
+
+ $animate.flush();
+
+ expect(spy.callCount).toBe(1);
+
+ browserTrigger(element, 'transitionend', { timeStamp: Date.now(), elapsedTime: 2 });
+ $animate.flush();
+
+ expect(spy.callCount).toBe(2);
+
+ dealoc(element);
+ }));
+
+
+ it("should remove a class when the same class is currently being added by a joined class-based animation",
+ inject(function($animate, $animateCss, $rootScope, $document, $rootElement, $$rAF) {
+
+ ss.addRule('.hide', 'opacity: 0');
+ ss.addRule('.hide-add, .hide-remove', 'transition: 1s linear all');
+
+ jqLite($document[0].body).append($rootElement);
+ element = jqLite('
');
+ $rootElement.append(element);
+
+ // These animations will be joined together
+ $animate.addClass(element, 'red');
+ $animate.addClass(element, 'hide');
+ $rootScope.$digest();
+
+ expect(element).toHaveClass('red-add');
+ expect(element).toHaveClass('hide-add');
+
+ // When a digest has passed, but no $rAF has been issued yet, .hide hasn't been added to
+ // the element yet
+ $animate.removeClass(element, 'hide');
+ $rootScope.$digest();
+ $$rAF.flush();
+
+ expect(element).not.toHaveClass('hide-add hide-add-active');
+ expect(element).toHaveClass('hide-remove hide-remove-active');
+
+ //End the animation process
+ browserTrigger(element, 'transitionend',
+ { timeStamp: Date.now() + 1000, elapsedTime: 2 });
+ $animate.flush();
+
+ expect(element).not.toHaveClass('hide-add-active red-add-active');
+ expect(element).toHaveClass('red');
+ expect(element).not.toHaveClass('hide');
+ }));
+
+ it('should handle ng-if & ng-class with a class that is removed before its add animation has concluded', function() {
+ inject(function($animate, $rootScope, $compile, $timeout, $$rAF) {
+
+ ss.addRule('.animate-me', 'transition: all 0.5s;');
+
+ element = jqLite('');
+
+ html(element);
+ $rootScope.blue = true;
+ $rootScope.red = true;
+ $compile(element)($rootScope);
+ $rootScope.$digest();
+
+ var child = element.find('div');
+
+ // Trigger class removal before the add animation has been concluded
+ $rootScope.blue = false;
+ $animate.closeAndFlush();
+
+ expect(child).toHaveClass('red');
+ expect(child).not.toHaveClass('blue');
+ });
+ });
});
describe('JS animations', function() {
@@ -530,5 +710,50 @@ describe('ngAnimate integration tests', function() {
}
});
});
+
+ it("should not alter the provided options values in anyway throughout the animation", function() {
+ var animationSpy = jasmine.createSpy();
+ module(function($animateProvider) {
+ $animateProvider.register('.this-animation', function() {
+ return {
+ enter: function(element, done) {
+ animationSpy();
+ done();
+ }
+ };
+ });
+ });
+
+ inject(function($animate, $rootScope, $compile) {
+ element = jqLite('
');
+ var child = jqLite('
');
+
+ var initialOptions = {
+ from: { height: '50px' },
+ to: { width: '100px' },
+ addClass: 'one',
+ removeClass: 'two'
+ };
+
+ var copiedOptions = copy(initialOptions);
+ expect(copiedOptions).toEqual(initialOptions);
+
+ html(element);
+ $compile(element)($rootScope);
+
+ $animate.enter(child, element, null, copiedOptions);
+ $rootScope.$digest();
+ expect(copiedOptions).toEqual(initialOptions);
+
+ $animate.flush();
+ expect(copiedOptions).toEqual(initialOptions);
+
+ expect(child).toHaveClass('one');
+ expect(child).not.toHaveClass('two');
+
+ expect(child.attr('style')).toContain('100px');
+ expect(child.attr('style')).toContain('50px');
+ });
+ });
});
});
diff --git a/test/ngAria/ariaSpec.js b/test/ngAria/ariaSpec.js
index 911e6aab73d5..b85448ad3343 100644
--- a/test/ngAria/ariaSpec.js
+++ b/test/ngAria/ariaSpec.js
@@ -248,7 +248,7 @@ describe('$aria', function() {
});
it('should not add a role to a native checkbox', function() {
- compileElement(' ');
+ compileElement('
');
expect(element.attr('role')).toBe(undefined);
});
@@ -268,7 +268,7 @@ describe('$aria', function() {
});
it('should not add a role to a native range input', function() {
- compileElement('
');
+ compileElement('
');
expect(element.attr('role')).toBe(undefined);
});
});
@@ -616,16 +616,18 @@ describe('$aria', function() {
describe('tabindex', function() {
beforeEach(injectScopeAndCompiler);
- it('should not attach to native controls', function() {
- var element = [
- $compile("
")(scope),
- $compile("
")(scope),
- $compile(" ",
+ 'input[text]': "' +
+ '
Enter something
' +
+ '
'
+ };
+ });
+ });
+
+ inject(function($rootScope, $compile) {
+
+ element = $compile('' +
+ '
A
' +
+ '
B
' +
+ '
' +
+ '
' +
+ '
A
' +
+ '
' +
+ '
D
' +
+ '
' +
+ '
': '
' +
@@ -427,7 +591,7 @@ describe('ngMessages', function() {
var elements = element[0].querySelectorAll('[ng-repeat]');
- // all three collections should have atleast one error showing up
+ // all three collections should have at least one error showing up
expect(messageChildren(element).length).toBe(3);
expect(messageChildren(elements[0]).length).toBe(1);
expect(messageChildren(elements[1]).length).toBe(1);
@@ -607,6 +771,37 @@ describe('ngMessages', function() {
expect(trim(element.text())).toEqual("C");
}));
+
+ it('should properly detect a previous message, even if it was registered later',
+ inject(function($compile, $rootScope, $templateCache) {
+ $templateCache.put('include.html', '
A
');
+ var html =
+ '
' +
+ '
' +
+ '
B
' +
+ '
C
' +
+ '
';
+
+ element = $compile(html)($rootScope);
+ $rootScope.$apply('items = {b: true, c: true}');
+
+ expect(element.text()).toBe('B');
+
+ var ctrl = element.controller('ngMessages');
+ var deregisterSpy = spyOn(ctrl, 'deregister').andCallThrough();
+
+ var nodeB = element[0].querySelector('[ng-message="b"]');
+ jqLite(nodeB).remove();
+
+ // Make sure removing the element triggers the deregistration in ngMessages
+ expect(trim(deregisterSpy.mostRecentCall.args[0].nodeValue)).toBe('ngMessage: b');
+
+ $rootScope.$apply('items.a = true');
+
+ expect(element.text()).toBe('A');
+ })
+ );
+
});
describe('when multiple', function() {
diff --git a/test/ngMock/angular-mocksSpec.js b/test/ngMock/angular-mocksSpec.js
index 11836c13723c..3dff9ef0cb34 100644
--- a/test/ngMock/angular-mocksSpec.js
+++ b/test/ngMock/angular-mocksSpec.js
@@ -919,6 +919,52 @@ describe('ngMock', function() {
});
}).toThrow('test message');
}));
+
+ describe('error stack trace when called outside of spec context', function() {
+ // - Chrome, Firefox, Edge, Opera give us the stack trace as soon as an Error is created
+ // - IE10+, PhantomJS give us the stack trace only once the error is thrown
+ // - IE9 does not provide stack traces
+ var stackTraceSupported = (function() {
+ var error = new Error();
+ if (!error.stack) {
+ try {
+ throw error;
+ } catch (e) {}
+ }
+
+ return !!error.stack;
+ })();
+
+ function testCaller() {
+ // Assigning to a local variable first, prevents Safari 10+ from inlining
+ // the function call and having it appear as anonymous in the stack trace.
+ var fn = inject(function() { throw new Error(); });
+ return fn;
+ }
+ var throwErrorFromInjectCallback = testCaller();
+
+ if (stackTraceSupported) {
+ describe('on browsers supporting stack traces', function() {
+ it('should update thrown Error stack trace with inject call location', function() {
+ try {
+ throwErrorFromInjectCallback();
+ } catch (e) {
+ expect(e.stack).toMatch('testCaller');
+ }
+ });
+ });
+ } else {
+ describe('on browsers not supporting stack traces', function() {
+ it('should not add stack trace information to thrown Error', function() {
+ try {
+ throwErrorFromInjectCallback();
+ } catch (e) {
+ expect(e.stack).toBeUndefined();
+ }
+ });
+ });
+ }
+ });
});
});
@@ -993,6 +1039,26 @@ describe('ngMock', function() {
});
+ it('should be able to handle Blobs as mock data', function() {
+ if (typeof Blob !== 'undefined') {
+ var mockBlob = new Blob(['{"foo":"bar"}'], {type: 'application/json'});
+
+ hb.when('GET', '/url1').respond(200, mockBlob, {});
+
+ callback.andCallFake(function(status, response) {
+ expect(response).not.toBe(mockBlob);
+ expect(response.size).toBe(13);
+ expect(response.type).toBe('application/json');
+ expect(response.toString()).toBe('[object Blob]');
+ });
+
+ hb('GET', '/url1', null, callback);
+ hb.flush();
+ expect(callback).toHaveBeenCalledOnce();
+ }
+ });
+
+
it('should throw error when unexpected request', function() {
hb.when('GET', '/url1').respond(200, 'content');
expect(function() {
@@ -1790,10 +1856,10 @@ describe('ngMockE2E', function() {
describe('passThrough()', function() {
it('should delegate requests to the real backend when passThrough is invoked', function() {
hb.when('GET', /\/passThrough\/.*/).passThrough();
- hb('GET', '/passThrough/23', null, callback, {}, null, true);
+ hb('GET', '/passThrough/23', null, callback, {}, null, true, 'blob');
expect(realHttpBackend).toHaveBeenCalledOnceWith(
- 'GET', '/passThrough/23', null, callback, {}, null, true);
+ 'GET', '/passThrough/23', null, callback, {}, null, true, 'blob');
});
it('should be able to override a respond definition with passThrough', function() {
@@ -1802,7 +1868,7 @@ describe('ngMockE2E', function() {
hb('GET', '/passThrough/23', null, callback, {}, null, true);
expect(realHttpBackend).toHaveBeenCalledOnceWith(
- 'GET', '/passThrough/23', null, callback, {}, null, true);
+ 'GET', '/passThrough/23', null, callback, {}, null, true, undefined);
});
it('should be able to override a respond definition with passThrough', inject(function($browser) {
@@ -1834,7 +1900,7 @@ describe('ngMockE2E', function() {
beforeEach(module('ngAnimate'));
beforeEach(module('ngAnimateMock'));
- var ss, element, trackedAnimations;
+ var ss, element, trackedAnimations, animationLog;
afterEach(function() {
if (element) {
@@ -1847,6 +1913,8 @@ describe('ngMockE2E', function() {
beforeEach(module(function($animateProvider) {
trackedAnimations = [];
+ animationLog = [];
+
$animateProvider.register('.animate', function() {
return {
leave: logFn('leave'),
@@ -1855,7 +1923,13 @@ describe('ngMockE2E', function() {
function logFn(method) {
return function(element) {
+ animationLog.push('start ' + method);
trackedAnimations.push(getDoneCallback(arguments));
+
+ return function closingFn(cancel) {
+ var lab = cancel ? 'cancel' : 'end';
+ animationLog.push(lab + ' ' + method);
+ };
};
}
@@ -1866,8 +1940,8 @@ describe('ngMockE2E', function() {
}
});
- return function($animate, $rootElement, $document, $rootScope, $window) {
- ss = createMockStyleSheet($document, $window);
+ return function($animate, $rootElement, $document, $rootScope) {
+ ss = createMockStyleSheet($document);
element = angular.element('
');
$rootElement.append(element);
@@ -2008,6 +2082,80 @@ describe('ngMockE2E', function() {
expect(spy.callCount).toBe(2);
}));
});
+
+ describe('$animate.closeAndFlush()', function() {
+ it('should close the currently running $animateCss animations',
+ inject(function($animateCss, $animate) {
+
+ if (!browserSupportsCssAnimations()) return;
+
+ var spy = jasmine.createSpy();
+ var runner = $animateCss(element, {
+ duration: 1,
+ to: { color: 'red' }
+ }).start();
+
+ runner.then(spy);
+
+ expect(spy).not.toHaveBeenCalled();
+ $animate.closeAndFlush();
+ expect(spy).toHaveBeenCalled();
+ }));
+
+ it('should close the currently running $$animateJs animations',
+ inject(function($$animateJs, $animate) {
+
+ var spy = jasmine.createSpy();
+ var runner = $$animateJs(element, 'leave', 'animate', {}).start();
+ runner.then(spy);
+
+ expect(spy).not.toHaveBeenCalled();
+ $animate.closeAndFlush();
+ expect(spy).toHaveBeenCalled();
+ }));
+
+ it('should run the closing javascript animation function upon flush',
+ inject(function($$animateJs, $animate) {
+
+ $$animateJs(element, 'leave', 'animate', {}).start();
+
+ expect(animationLog).toEqual(['start leave']);
+ $animate.closeAndFlush();
+ expect(animationLog).toEqual(['start leave', 'end leave']);
+ }));
+
+ it('should not throw when a regular animation has no javascript animation',
+ inject(function($animate, $$animation, $rootElement) {
+
+ if (!browserSupportsCssAnimations()) return;
+
+ var element = jqLite('
');
+ $rootElement.append(element);
+
+ // Make sure the animation has valid $animateCss options
+ $$animation(element, null, {
+ from: { background: 'red' },
+ to: { background: 'blue' },
+ duration: 1,
+ transitionStyle: '1s linear all'
+ });
+
+ expect(function() {
+ $animate.closeAndFlush();
+ }).not.toThrow();
+
+ dealoc(element);
+ }));
+
+ it('should throw an error if there are no animations to close and flush',
+ inject(function($animate) {
+
+ expect(function() {
+ $animate.closeAndFlush();
+ }).toThrow('No pending animations ready to be closed or flushed');
+
+ }));
+ });
});
});
diff --git a/test/ngResource/resourceSpec.js b/test/ngResource/resourceSpec.js
index 0fa7fc52959b..560f71ac1f3d 100644
--- a/test/ngResource/resourceSpec.js
+++ b/test/ngResource/resourceSpec.js
@@ -156,7 +156,7 @@ describe("resource", function() {
});
- it('should ignore slashes of undefinend parameters', function() {
+ it('should ignore slashes of undefined parameters', function() {
var R = $resource('/Path/:a/:b/:c');
$httpBackend.when('GET', '/Path').respond('{}');
@@ -181,7 +181,7 @@ describe("resource", function() {
R.get({a:6, b:7, c:8});
});
- it('should not ignore leading slashes of undefinend parameters that have non-slash trailing sequence', function() {
+ it('should not ignore leading slashes of undefined parameters that have non-slash trailing sequence', function() {
var R = $resource('/Path/:a.foo/:b.bar/:c.baz');
$httpBackend.when('GET', '/Path/.foo/.bar.baz').respond('{}');
@@ -242,7 +242,7 @@ describe("resource", function() {
});
it('should not encode @ in url params', function() {
- //encodeURIComponent is too agressive and doesn't follow http://www.ietf.org/rfc/rfc3986.txt
+ //encodeURIComponent is too aggressive and doesn't follow http://www.ietf.org/rfc/rfc3986.txt
//with regards to the character set (pchar) allowed in path segments
//so we need this test to make sure that we don't over-encode the params and break stuff like
//buzz api which uses @self
@@ -1355,6 +1355,48 @@ describe('resource', function() {
/^\[\$resource:badcfg\] Error in resource configuration for action `get`\. Expected response to contain an object but got an array \(Request: GET \/Customer\/123\)/
);
});
+});
+
+describe('resource with promises as `timeout`', function() {
+ var httpSpy;
+ var $httpBackend;
+ var $resource;
+
+ beforeEach(module('ngResource', function($provide) {
+ $provide.decorator('$http', function($delegate) {
+ httpSpy = jasmine.createSpy('$http').andCallFake($delegate);
+ return httpSpy;
+ });
+ }));
+
+ beforeEach(inject(function(_$httpBackend_, _$resource_) {
+ $httpBackend = _$httpBackend_;
+ $resource = _$resource_;
+ }));
+ it('should ignore non-numeric timeouts in actions and log a $debug message',
+ inject(function($log, $q) {
+ spyOn($log, 'debug');
+ $httpBackend.whenGET('/CreditCard').respond({});
+
+ var CreditCard = $resource('/CreditCard', {}, {
+ get: {
+ method: 'GET',
+ timeout: $q.defer().promise
+ }
+ });
+
+ CreditCard.get();
+ $httpBackend.flush();
+ expect(httpSpy).toHaveBeenCalledOnce();
+ expect(httpSpy.calls[0].args[0].timeout).toBeUndefined();
+ expect($log.debug).toHaveBeenCalledOnceWith('ngResource:\n' +
+ ' Only numeric values are allowed as `timeout`.\n' +
+ ' Promises are not supported in $resource, because the same value would ' +
+ 'be used for multiple requests.\n' +
+ ' If you need support for cancellable $resource actions, you should ' +
+ 'upgrade to version 1.5 or higher.');
+ })
+ );
});
diff --git a/test/ngRoute/routeSpec.js b/test/ngRoute/routeSpec.js
index 368dadf3c9ae..889489a0d63d 100644
--- a/test/ngRoute/routeSpec.js
+++ b/test/ngRoute/routeSpec.js
@@ -303,7 +303,7 @@ describe('$route', function() {
event.preventDefault();
});
- $rootScope.$on('$beforeRouteChange', function(event) {
+ $rootScope.$on('$routeChangeSuccess', function(event) {
throw new Error('Should not get here');
});
@@ -974,6 +974,32 @@ describe('$route', function() {
});
+ it('should properly process route params which are both eager and optional', function() {
+ module(function($routeProvider) {
+ $routeProvider.when('/foo/:param1*?/:param2', {templateUrl: 'foo.html'});
+ });
+
+ inject(function($location, $rootScope, $route) {
+ $location.path('/foo/bar1/bar2/bar3/baz');
+ $rootScope.$digest();
+
+ expect($location.path()).toEqual('/foo/bar1/bar2/bar3/baz');
+ expect($route.current.params.param1).toEqual('bar1/bar2/bar3');
+ expect($route.current.params.param2).toEqual('baz');
+ expect($route.current.templateUrl).toEqual('foo.html');
+
+ $location.path('/foo/baz');
+ $rootScope.$digest();
+
+ expect($location.path()).toEqual('/foo/baz');
+ expect($route.current.params.param1).toEqual(undefined);
+ expect($route.current.params.param2).toEqual('baz');
+ expect($route.current.templateUrl).toEqual('foo.html');
+
+ });
+ });
+
+
it('should properly interpolate optional and eager route vars ' +
'when redirecting from path with trailing slash', function() {
module(function($routeProvider) {
@@ -1214,34 +1240,107 @@ describe('$route', function() {
});
describe('reload', function() {
+ var $location;
+ var $log;
+ var $rootScope;
+ var $route;
+ var routeChangeStartSpy;
+ var routeChangeSuccessSpy;
+
+ beforeEach(module(function($routeProvider) {
+ $routeProvider.when('/bar/:barId', {
+ template: '',
+ controller: controller,
+ reloadOnSearch: false
+ });
- it('should reload even if reloadOnSearch is false', function() {
- var routeChangeSpy = jasmine.createSpy('route change');
+ function controller($log) {
+ $log.debug('initialized');
+ }
+ }));
+ beforeEach(inject(function($compile, _$location_, _$log_, _$rootScope_, _$route_) {
+ $location = _$location_;
+ $log = _$log_;
+ $rootScope = _$rootScope_;
+ $route = _$route_;
- module(function($routeProvider) {
- $routeProvider.when('/bar/:barId', {controller: angular.noop, reloadOnSearch: false});
- });
+ routeChangeStartSpy = jasmine.createSpy('routeChangeStart');
+ routeChangeSuccessSpy = jasmine.createSpy('routeChangeSuccess');
- inject(function($route, $location, $rootScope, $routeParams) {
- $rootScope.$on('$routeChangeSuccess', routeChangeSpy);
+ $rootScope.$on('$routeChangeStart', routeChangeStartSpy);
+ $rootScope.$on('$routeChangeSuccess', routeChangeSuccessSpy);
- $location.path('/bar/123');
- $rootScope.$digest();
- expect($routeParams).toEqual({barId:'123'});
- expect(routeChangeSpy).toHaveBeenCalledOnce();
- routeChangeSpy.reset();
+ element = $compile('
')($rootScope);
+ }));
- $location.path('/bar/123').search('a=b');
- $rootScope.$digest();
- expect($routeParams).toEqual({barId:'123', a:'b'});
- expect(routeChangeSpy).not.toHaveBeenCalled();
+ it('should reload the current route', function() {
+ $location.path('/bar/123');
+ $rootScope.$digest();
+ expect($location.path()).toBe('/bar/123');
+ expect(routeChangeStartSpy).toHaveBeenCalledOnce();
+ expect(routeChangeSuccessSpy).toHaveBeenCalledOnce();
+ expect($log.debug.logs).toEqual([['initialized']]);
- $route.reload();
- $rootScope.$digest();
- expect($routeParams).toEqual({barId:'123', a:'b'});
- expect(routeChangeSpy).toHaveBeenCalledOnce();
- });
+ routeChangeStartSpy.reset();
+ routeChangeSuccessSpy.reset();
+ $log.reset();
+
+ $route.reload();
+ $rootScope.$digest();
+ expect($location.path()).toBe('/bar/123');
+ expect(routeChangeStartSpy).toHaveBeenCalledOnce();
+ expect(routeChangeSuccessSpy).toHaveBeenCalledOnce();
+ expect($log.debug.logs).toEqual([['initialized']]);
+
+ $log.reset();
});
+
+ it('should support preventing a route reload', function() {
+ $location.path('/bar/123');
+ $rootScope.$digest();
+ expect($location.path()).toBe('/bar/123');
+ expect(routeChangeStartSpy).toHaveBeenCalledOnce();
+ expect(routeChangeSuccessSpy).toHaveBeenCalledOnce();
+ expect($log.debug.logs).toEqual([['initialized']]);
+
+ routeChangeStartSpy.reset();
+ routeChangeSuccessSpy.reset();
+ $log.reset();
+
+ routeChangeStartSpy.andCallFake(function(evt) { evt.preventDefault(); });
+
+ $route.reload();
+ $rootScope.$digest();
+ expect($location.path()).toBe('/bar/123');
+ expect(routeChangeStartSpy).toHaveBeenCalledOnce();
+ expect(routeChangeSuccessSpy).not.toHaveBeenCalled();
+ expect($log.debug.logs).toEqual([]);
+ });
+
+ it('should reload even if reloadOnSearch is false', inject(function($routeParams) {
+ $location.path('/bar/123');
+ $rootScope.$digest();
+ expect($routeParams).toEqual({barId: '123'});
+ expect(routeChangeSuccessSpy).toHaveBeenCalledOnce();
+ expect($log.debug.logs).toEqual([['initialized']]);
+
+ routeChangeSuccessSpy.reset();
+ $log.reset();
+
+ $location.search('a=b');
+ $rootScope.$digest();
+ expect($routeParams).toEqual({barId: '123', a: 'b'});
+ expect(routeChangeSuccessSpy).not.toHaveBeenCalled();
+ expect($log.debug.logs).toEqual([]);
+
+ $route.reload();
+ $rootScope.$digest();
+ expect($routeParams).toEqual({barId: '123', a: 'b'});
+ expect(routeChangeSuccessSpy).toHaveBeenCalledOnce();
+ expect($log.debug.logs).toEqual([['initialized']]);
+
+ $log.reset();
+ }));
});
});
diff --git a/test/ngScenario/e2e/widgets.html b/test/ngScenario/e2e/widgets.html
index 6fa9276ed669..5fdae881cf68 100644
--- a/test/ngScenario/e2e/widgets.html
+++ b/test/ngScenario/e2e/widgets.html
@@ -42,7 +42,7 @@
checkbox
checkbox={{checkbox}}
diff --git a/test/ngTouch/directive/ngClickSpec.js b/test/ngTouch/directive/ngClickSpec.js
index 179b0248ff21..c9765b4c8df9 100644
--- a/test/ngTouch/directive/ngClickSpec.js
+++ b/test/ngTouch/directive/ngClickSpec.js
@@ -315,7 +315,7 @@ describe('ngClick (touch)', function() {
expect($rootScope.count1).toBe(1);
time = 90;
- // Verify that it is blured so we don't get soft-keyboard
+ // Verify that it is blurred so we don't get soft-keyboard
element1[0].blur = jasmine.createSpy('blur');
browserTrigger(element1, 'click',{
keys: [],