From 929e785cfe3a19b65632fdee61ff507be686434c Mon Sep 17 00:00:00 2001 From: Lucas Mirelmann Date: Thu, 25 Feb 2016 19:08:42 +0100 Subject: [PATCH] refactor($compile): Create non-descriptive comments when debugInfoEnabled is false When debugInfoEnabled is `false` when comments generated by transclusions, ngIf, ngRepeat and ngSwitch will not contain any information about the directive nor the expression associated with it. Closes: #8722 --- src/ng/compile.js | 11 +++++++++-- src/ng/directive/ngIf.js | 4 ++-- src/ng/directive/ngRepeat.js | 4 ++-- src/ng/directive/ngSwitch.js | 4 ++-- src/ngMessages/messages.js | 5 ++++- test/ng/compileSpec.js | 24 ++++++++++++++++++++++++ test/ng/directive/ngIncludeSpec.js | 4 +++- 7 files changed, 46 insertions(+), 10 deletions(-) diff --git a/src/ng/compile.js b/src/ng/compile.js index fbbb32025595..7f35353d2cc9 100644 --- a/src/ng/compile.js +++ b/src/ng/compile.js @@ -1508,6 +1508,14 @@ function $CompileProvider($provide, $$sanitizeUriProvider) { safeAddClass($element, isolated ? 'ng-isolate-scope' : 'ng-scope'); } : noop; + compile.$$createComment = function(directiveName, comment) { + var content = ''; + if (debugInfoEnabled) { + content = ' ' + (directiveName || '') + ': ' + (comment || '') + ' '; + } + return document.createComment(content); + }; + return compile; //================================ @@ -2054,8 +2062,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) { terminalPriority = directive.priority; $template = $compileNode; $compileNode = templateAttrs.$$element = - jqLite(document.createComment(' ' + directiveName + ': ' + - templateAttrs[directiveName] + ' ')); + jqLite(compile.$$createComment(directiveName, templateAttrs[directiveName])); compileNode = $compileNode[0]; replaceWith(jqCollection, sliceArgs($template), compileNode); diff --git a/src/ng/directive/ngIf.js b/src/ng/directive/ngIf.js index b09337d91d75..9e0d96b5ad81 100644 --- a/src/ng/directive/ngIf.js +++ b/src/ng/directive/ngIf.js @@ -78,7 +78,7 @@ */ -var ngIfDirective = ['$animate', function($animate) { +var ngIfDirective = ['$animate', '$compile', function($animate, $compile) { return { multiElement: true, transclude: 'element', @@ -94,7 +94,7 @@ var ngIfDirective = ['$animate', function($animate) { if (!childScope) { $transclude(function(clone, newScope) { childScope = newScope; - clone[clone.length++] = document.createComment(' end ngIf: ' + $attr.ngIf + ' '); + clone[clone.length++] = $compile.$$createComment('end ngIf', $attr.ngIf); // Note: We only need the first/last node of the cloned nodes. // However, we need to keep the reference to the jqlite wrapper as it might be changed later // by a directive with templateUrl when its template arrives. diff --git a/src/ng/directive/ngRepeat.js b/src/ng/directive/ngRepeat.js index 471e6656ee35..808c77f14958 100644 --- a/src/ng/directive/ngRepeat.js +++ b/src/ng/directive/ngRepeat.js @@ -322,7 +322,7 @@ */ -var ngRepeatDirective = ['$parse', '$animate', function($parse, $animate) { +var ngRepeatDirective = ['$parse', '$animate', '$compile', function($parse, $animate, $compile) { var NG_REMOVED = '$$NG_REMOVED'; var ngRepeatMinErr = minErr('ngRepeat'); @@ -357,7 +357,7 @@ var ngRepeatDirective = ['$parse', '$animate', function($parse, $animate) { $$tlb: true, compile: function ngRepeatCompile($element, $attr) { var expression = $attr.ngRepeat; - var ngRepeatEndComment = document.createComment(' end ngRepeat: ' + expression + ' '); + var ngRepeatEndComment = $compile.$$createComment('end ngRepeat', expression); var match = expression.match(/^\s*([\s\S]+?)\s+in\s+([\s\S]+?)(?:\s+as\s+([\s\S]+?))?(?:\s+track\s+by\s+([\s\S]+?))?\s*$/); diff --git a/src/ng/directive/ngSwitch.js b/src/ng/directive/ngSwitch.js index 1ca146ea0d8e..c76bf6b04102 100644 --- a/src/ng/directive/ngSwitch.js +++ b/src/ng/directive/ngSwitch.js @@ -129,7 +129,7 @@ */ -var ngSwitchDirective = ['$animate', function($animate) { +var ngSwitchDirective = ['$animate', '$compile', function($animate, $compile) { return { require: 'ngSwitch', @@ -170,7 +170,7 @@ var ngSwitchDirective = ['$animate', function($animate) { selectedTransclude.transclude(function(caseElement, selectedScope) { selectedScopes.push(selectedScope); var anchor = selectedTransclude.element; - caseElement[caseElement.length++] = document.createComment(' end ngSwitchWhen: '); + caseElement[caseElement.length++] = $compile.$$createComment('end ngSwitchWhen'); var block = { clone: caseElement }; selectedElements.push(block); diff --git a/src/ngMessages/messages.js b/src/ngMessages/messages.js index 52d1699d3b55..a9970329ddc8 100644 --- a/src/ngMessages/messages.js +++ b/src/ngMessages/messages.js @@ -522,7 +522,10 @@ angular.module('ngMessages', []) element.after(contents); // the anchor is placed for debugging purposes - var anchor = jqLite($document[0].createComment(' ngMessagesInclude: ' + src + ' ')); + var comment = $compile.$$createComment ? + $compile.$$createComment('ngMessagesInclude', src) : + $document[0].createComment(' ngMessagesInclude: ' + src + ' '); + var anchor = jqLite(comment); element.after(anchor); // we don't want to pollute the DOM anymore by keeping an empty directive element diff --git a/test/ng/compileSpec.js b/test/ng/compileSpec.js index cb2279aa305e..ac759dcfc37c 100755 --- a/test/ng/compileSpec.js +++ b/test/ng/compileSpec.js @@ -10146,4 +10146,28 @@ describe('$compile', function() { }); }); }); + + describe('$$createComment', function() { + it('should create empty comments if `debugInfoEnabled` is false', function() { + module(function($compileProvider) { + $compileProvider.debugInfoEnabled(false); + }); + + inject(function($compile) { + var comment = $compile.$$createComment('foo', 'bar'); + expect(comment.data).toBe(''); + }); + }); + + it('should create descriptive comments if `debugInfoEnabled` is true', function() { + module(function($compileProvider) { + $compileProvider.debugInfoEnabled(true); + }); + + inject(function($compile) { + var comment = $compile.$$createComment('foo', 'bar'); + expect(comment.data).toBe(' foo: bar '); + }); + }); + }); }); diff --git a/test/ng/directive/ngIncludeSpec.js b/test/ng/directive/ngIncludeSpec.js index 1625e31d64de..672d2ebfe685 100644 --- a/test/ng/directive/ngIncludeSpec.js +++ b/test/ng/directive/ngIncludeSpec.js @@ -401,7 +401,9 @@ 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); + var result = jasmine.createSpy('$compile').andCallFake($delegate); + result.$$createComment = $delegate.$$createComment; + return result; }); }); inject(function($rootScope, $httpBackend, $compile) {