WIP: feat(scope): enable $watch on $sce trusted values

Author: chirayuk

src/ng/directive/ngBind.js

@@ -134,15 +134,11 @@ var ngBindTemplateDirective = ['$interpolate', function($interpolate) {
  * @element ANY
  * @param {expression} ngBindHtml {@link guide/expression Expression} to evaluate.
  */
-var ngBindHtmlDirective = ['$sce', '$parse', function($sce, $parse) {
+var ngBindHtmlDirective = ['$sce', function($sce) {
   return function(scope, element, attr) {
     element.addClass('ng-binding').data('$binding', attr.ngBindHtml);
-
-    var parsed = $parse(attr.ngBindHtml);
-    function getStringValue() { return (parsed(scope) || '').toString(); }
-
-    scope.$watch(getStringValue, function ngBindHtmlWatchAction(value) {
-      element.html($sce.getTrustedHtml(parsed(scope)) || '');
+    scope.$watch(attr.ngBindHtml, function ngBindHtmlWatchAction(value) {
+      element.html($sce.getTrustedHtml(value) || '');
     });
   };
 }];

src/ng/directive/ngInclude.js

@@ -177,7 +177,8 @@ var ngIncludeDirective = ['$http', '$templateCache', '$anchorScroll', '$compile'
           }
         };
 
-        scope.$watch($sce.parseAsResourceUrl(srcExp), function ngIncludeWatchAction(src) {
+        scope.$watch(srcExp, function ngIncludeWatchAction(srcUntrusted) {
+          var src = $sce.getTrustedResourceUrl(srcUntrusted);
           var thisChangeId = ++changeCounter;
 
           if (src) {

src/ng/rootScope.js

@@ -71,8 +71,21 @@ function $RootScopeProvider(){
     return TTL;
   };
 
-  this.$get = ['$injector', '$exceptionHandler', '$parse', '$browser',
-      function( $injector,   $exceptionHandler,   $parse,   $browser) {
+  this.$get = ['$injector', '$exceptionHandler', '$parse', '$browser', '$sce',
+      function( $injector,   $exceptionHandler,   $parse,   $browser,   $sce) {
+
+    function sceAwareCompare(a, b, compareValue) {
+      if (a === b) {
+        return true;
+      }
+      var rawA = $sce.valueOf(a),
+          rawB = $sce.valueOf(b);
+      return !((a === rawA) ^ (b === rawB)) && (
+             (rawA === rawB) || (compareValue
+                            ? equals(rawA, rawB)
+                            : (typeof rawA == 'number' && typeof rawB == 'number' &&
+                               isNaN(rawA) && isNaN(rawB))));
+    }
 
     /**
      * @ngdoc function
@@ -375,6 +388,9 @@ function $RootScopeProvider(){
           newValue = objGetter(self);
           var newLength, key;
 
+          // ckck: with my change, a NaN in a collection compares equal to another NaN
+          // ckck: add test for that.
+          // ckck: isObject(rawValue)
           if (!isObject(newValue)) {
             if (oldValue !== newValue) {
               oldValue = newValue;
@@ -397,7 +413,7 @@ function $RootScopeProvider(){
             }
             // copy the items to oldValue and look for changes.
             for (var i = 0; i < newLength; i++) {
-              if (oldValue[i] !== newValue[i]) {
+              if (!sceAwareCompare(oldValue[i], newValue[i])) {
                 changeDetected++;
                 oldValue[i] = newValue[i];
               }
@@ -415,7 +431,7 @@ function $RootScopeProvider(){
               if (newValue.hasOwnProperty(key)) {
                 newLength++;
                 if (oldValue.hasOwnProperty(key)) {
-                  if (oldValue[key] !== newValue[key]) {
+                  if (!sceAwareCompare(oldValue[key], newValue[key])) {
                     changeDetected++;
                     oldValue[key] = newValue[key];
                   }
@@ -529,14 +545,12 @@ function $RootScopeProvider(){
                   watch = watchers[length];
                   // 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 && (value = watch.get(current)) !== (last = watch.last) &&
-                      !(watch.eq
-                          ? equals(value, last)
-                          : (typeof value == 'number' && typeof last == 'number'
-                             && isNaN(value) && isNaN(last)))) {
+                  if (watch && !sceAwareCompare(value = watch.get(current), last = watch.last, watch.eq)) {
                     dirty = true;
+                    // ckck
                     watch.last = watch.eq ? copy(value) : value;
-                    watch.fn(value, ((last === initWatchVal) ? value : last), current);
+                    // ckck - should use raw values in === ?
+                    watch.fn(value, sceAwareCompare(last, initWatchVal) ? value : last, current);
                     if (ttl < 5) {
                       logIdx = 4 - ttl;
                       if (!watchLog[logIdx]) watchLog[logIdx] = [];

test/ng/directive/ngBindSpec.js

@@ -107,11 +107,13 @@ describe('ngBind*', function() {
         // 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.
         element = $compile('<div ng-bind-html="getHtml()"></div>')($rootScope);
-        $rootScope.getHtml = function() {
-          return $sce.trustAsHtml('<div onclick="">hello</div>');
-        };
+        var html = '<div onclick="">hello</div>';
+        $rootScope.getHtml = function() { return $sce.trustAsHtml(html); };
         $rootScope.$digest();
         expect(angular.lowercase(element.html())).toEqual('<div onclick="">hello</div>');
+        var html = '<div onclick="">hello2</div>';
+        $rootScope.$digest();
+        expect(angular.lowercase(element.html())).toEqual('<div onclick="">hello2</div>');
       }));
 
       describe('when $sanitize is available', function() {

test/ng/rootScopeSpec.js

@@ -463,6 +463,21 @@ describe('Scope', function() {
         });
 
 
+        it('CKCK: SCE: should not trigger change when object in collection changes', inject(function($sce) {
+          $rootScope.obj = [$sce.trustAsHtml('ckck')];
+          $rootScope.$digest();
+          expect(log).toEqual(['[{}]']);
+
+          $rootScope.obj[0] = $sce.trustAsHtml('ckck');
+          $rootScope.$digest();
+          expect(log).toEqual(['[{}]']);
+
+          $rootScope.obj[0] = $sce.trustAsHtml('ckck2');
+          $rootScope.$digest();
+          expect(log).toEqual(['[{}]', '[{}]']);
+        }));
+
+
         it('should watch array properties', function() {
           $rootScope.obj = [];
           $rootScope.$digest();