feat(ngBindHtml, sce): combine ng-bind-html and ng-bind-html-unsafe

Changes:
- remove ng-bind-html-unsafe
- ng-bind-html is now in core
- ng-bind-html is secure
  - supports SCE - so you can bind to an arbitrary trusted string
  - automatic sanitization if $sanitize is available

BREAKING CHANGE:
  ng-html-bind-unsafe has been removed and replaced by ng-html-bind
  (which has been removed from ngSanitize.)  ng-bind-html provides
  ng-html-bind-unsafe like behavior (innerHTML's the result without
  sanitization) when bound to the result of $sce.trustAsHtml(string).
  When bound to a plain string, the string is sanitized via $sanitize
  before being innerHTML'd.  If $sanitize isn't available, it's logs an
  exception.
This commit is contained in:
Chirayu Krishnappa
2013-07-19 16:04:51 -07:00
parent bea9422ebf
commit dae694739b
9 changed files with 135 additions and 150 deletions

View File

@@ -67,19 +67,14 @@ describe('ngBind*', function() {
});
describe('ngBindHtmlUnsafe', function() {
function configureSce(enabled) {
module(function($provide, $sceProvider) {
$sceProvider.enabled(enabled);
});
};
describe('ngBindHtml', function() {
describe('SCE disabled', function() {
beforeEach(function() {configureSce(false)});
beforeEach(function() {
module(function($sceProvider) { $sceProvider.enabled(false); });
});
it('should set unsafe html', inject(function($rootScope, $compile) {
element = $compile('<div ng-bind-html-unsafe="html"></div>')($rootScope);
it('should set html', inject(function($rootScope, $compile) {
element = $compile('<div ng-bind-html="html"></div>')($rootScope);
$rootScope.html = '<div onclick="">hello</div>';
$rootScope.$digest();
expect(angular.lowercase(element.html())).toEqual('<div onclick="">hello</div>');
@@ -88,27 +83,35 @@ describe('ngBind*', function() {
describe('SCE enabled', function() {
beforeEach(function() {configureSce(true)});
it('should NOT set unsafe html for untrusted values', inject(function($rootScope, $compile) {
element = $compile('<div ng-bind-html-unsafe="html"></div>')($rootScope);
it('should NOT set html for untrusted values', inject(function($rootScope, $compile) {
element = $compile('<div ng-bind-html="html"></div>')($rootScope);
$rootScope.html = '<div onclick="">hello</div>';
expect($rootScope.$digest).toThrow();
}));
it('should NOT set unsafe html for wrongly typed values', inject(function($rootScope, $compile, $sce) {
element = $compile('<div ng-bind-html-unsafe="html"></div>')($rootScope);
it('should NOT set html for wrongly typed values', inject(function($rootScope, $compile, $sce) {
element = $compile('<div ng-bind-html="html"></div>')($rootScope);
$rootScope.html = $sce.trustAsCss('<div onclick="">hello</div>');
expect($rootScope.$digest).toThrow();
}));
it('should set unsafe html for trusted values', inject(function($rootScope, $compile, $sce) {
element = $compile('<div ng-bind-html-unsafe="html"></div>')($rootScope);
it('should set html for trusted values', inject(function($rootScope, $compile, $sce) {
element = $compile('<div ng-bind-html="html"></div>')($rootScope);
$rootScope.html = $sce.trustAsHtml('<div onclick="">hello</div>');
$rootScope.$digest();
expect(angular.lowercase(element.html())).toEqual('<div onclick="">hello</div>');
}));
describe('when $sanitize is available', function() {
beforeEach(function() { module('ngSanitize'); });
it('should sanitize untrusted html', inject(function($rootScope, $compile) {
element = $compile('<div ng-bind-html="html"></div>')($rootScope);
$rootScope.html = '<div onclick="">hello</div>';
$rootScope.$digest();
expect(angular.lowercase(element.html())).toEqual('<div>hello</div>');
}));
});
});
});

View File

@@ -341,7 +341,22 @@ describe('SCE', function() {
expect(function() { $sce.getTrustedResourceUrl('open_redirect'); }).toThrow(
'[$sce:isecrurl] Blocked loading resource from url not allowed by $sceDelegate policy. URL: open_redirect');
}));
});
describe('sanitizing html', function() {
describe('when $sanitize is NOT available', function() {
it('should throw an exception for getTrusted(string) values', inject(function($sce) {
expect(function() { $sce.getTrustedHtml('<b></b>'); }).toThrow(
'[$sce:unsafe] Attempting to use an unsafe value in a safe context.');
}));
});
describe('when $sanitize is available', function() {
beforeEach(function() { module('ngSanitize'); });
it('should sanitize html using $sanitize', inject(function($sce) {
expect($sce.getTrustedHtml('a<xxx><B>b</B></xxx>c')).toBe('a<b>b</b>c');
}));
});
});
});