Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

fix($compile): correctly denormalize templates that do not use standard interpolation symbols #14610

Closed
petebacondarwin wants to merge 2 commits into from
Closed

fix($compile): correctly denormalize templates that do not use standard interpolation symbols #14610

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ebf7e82
fix($compile): correctly denormalize templates that do not use standa…
petebacondarwin May 13, 2016
16682ef
fix($compile): correctly denormalize templates that do not use standa…
petebacondarwin May 14, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
47 changes: 41 additions & 6 deletions src/ng/compile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1285,6 +1285,32 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
return TTL;
};


function escapeRegExp(str) {
return str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
}
function createGlobalRegexMatcher(str) {
return new RegExp(escapeRegExp(str), 'g');
}
function escapeSymbol(str) {
return str.replace(/./g, '\\$&');
}
var moduleSymbolMap = createMap();
var defaultSymbols = {
startSymbol: '{{',
startRegex: /\{\{/g,
endSymbol: '}}',
endRegex: /\}\}/g
};
this.moduleSymbols = function(moduleName, startSymbol, endSymbol) {
moduleSymbolMap[moduleName] = {
startSymbol: startSymbol,
startRegex: createGlobalRegexMatcher(startSymbol),
endSymbol: endSymbol,
endRegex: createGlobalRegexMatcher(endSymbol)
};
};

this.$get = [
'$injector', '$interpolate', '$exceptionHandler', '$templateRequest', '$parse',
'$controller', '$rootScope', '$sce', '$animate', '$$sanitizeUri',
Expand Down Expand Up @@ -1584,11 +1610,20 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {


var startSymbol = $interpolate.startSymbol(),
startSymbolRegex = createGlobalRegexMatcher(startSymbol),
endSymbol = $interpolate.endSymbol(),
denormalizeTemplate = (startSymbol === '{{' && endSymbol === '}}')
? identity
: function denormalizeTemplate(template) {
return template.replace(/\{\{/g, startSymbol).replace(/}}/g, endSymbol);
endSymbolRegex = createGlobalRegexMatcher(endSymbol),
denormalizeTemplate = function(moduleName, template) {
var moduleSymbols = moduleSymbolMap[moduleName] || defaultSymbols;
if (moduleSymbols.startSymbol !== startSymbol) {
template = template.replace(startSymbolRegex, escapeSymbol);
template = template.replace(moduleSymbols.startRegex, startSymbol);
}
if (moduleSymbols.endSymbol !== endSymbol) {
template = template.replace(endSymbolRegex, escapeSymbol);
template = template.replace(moduleSymbols.endRegex, endSymbol);
}
return template;
},
NG_ATTR_BINDING = /^ngAttr[A-Z]/;
var MULTI_ELEMENT_DIR_RE = /^(.+)Start$/;
Expand Down Expand Up @@ -2274,7 +2309,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
? directive.template($compileNode, templateAttrs)
: directive.template;

directiveValue = denormalizeTemplate(directiveValue);
directiveValue = denormalizeTemplate(directive.$$moduleName, directiveValue);

if (directive.replace) {
replaceDirective = directive;
Expand Down Expand Up @@ -2782,7 +2817,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
.then(function(content) {
var compileNode, tempTemplateAttrs, $template, childBoundTranscludeFn;

content = denormalizeTemplate(content);
content = denormalizeTemplate(origAsyncDirective.$$moduleName, content);

if (origAsyncDirective.replace) {
if (jqLiteIsTextNode(content)) {
Expand Down
49 changes: 49 additions & 0 deletions test/ng/compileSpec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3155,6 +3155,55 @@ describe('$compile', function() {
});
});

it('should denormalise interpolation symbols in templates correctly, if different to the current symbols', function() {
angular.module('symbol-test', [])
.directive('myDirective', function() {
return {
template: '<span foo=\'{"ctx":{"id":3}}\'>[[1 + 2]]</span>'
};
})
.config(function($compileProvider) {
$compileProvider.moduleSymbols('symbol-test', '[[', ']]');
});

module('symbol-test');

inject(function($compile) {
element = $compile('<div><div my-directive></div></div>')($rootScope);
expect(element.children('div').children('span').attr('foo')).toBe('{"ctx":{"id":3\\}\\}');
expect(element.text()).toEqual('{{1 + 2}}');
$rootScope.$apply();
expect(element.text()).toEqual('3');
Copy link
Member

@gkalpak gkalpak May 16, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What about .attr('foo') ? I believe it is still escaped and I think this is not what we want...

Copy link
Contributor Author

@petebacondarwin petebacondarwin May 16, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That is what @lgalfaso was referring to in his test: #14610 (comment)

:-(

});
});


it('should escape the current interpolation symbols in templates, before denormalising, if the template module symbols are different', function() {
angular.module('symbol-test', [])
.directive('myDirective', function() {
return {
template: '<span>{[1 + 2]}[[3 + 4]]</span>'
};
})
.config(function($compileProvider) {
// Specify that the templates in this module use `[[` and `]]` interpolation symbols
$compileProvider.moduleSymbols('symbol-test', '[[', ']]');
});

module('symbol-test', function($interpolateProvider) {
// Specify that this app uses `{[` and `]}` as interpolation symbols
$interpolateProvider.startSymbol('{[');
$interpolateProvider.endSymbol(']}');
});

inject(function($compile) {
element = $compile('<div><div my-directive></div></div>')($rootScope);
expect(element.text()).toEqual('\\{\\[1 + 2\\]\\}{[3 + 4]}');
$rootScope.$apply();
expect(element.text()).toEqual('{[1 + 2]}7');
});
});


it('should support custom start interpolation symbol, even when `endSymbol` doesn\'t change',
function() {
Expand Down