fix(NgClass): ignore empty and blank class names

Fixes #4033

Closes #4173
This commit is contained in:
Pawel Kozlowski 2015-09-14 14:11:28 +02:00
parent 5bab607f44
commit 73351ac00f
2 changed files with 48 additions and 1 deletions

View File

@ -126,6 +126,9 @@ export class NgClass implements DoCheck, OnDestroy {
}
private _toggleClass(className: string, enabled): void {
this._renderer.setElementClass(this._ngEl, className, enabled);
className = className.trim();
if (className.length > 0) {
this._renderer.setElementClass(this._ngEl, className, enabled);
}
}
}

View File

@ -218,6 +218,36 @@ export function main() {
rootTC.debugElement.componentInstance.arrExpr = ['bar'];
detectChangesAndCheck(rootTC, 'ng-binding foo bar');
async.done();
});
}));
it('should ignore empty or blank class names',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<div class="foo" [ng-class]="arrExpr"></div>';
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((rootTC) => {
rootTC.debugElement.componentInstance.arrExpr = ['', ' '];
detectChangesAndCheck(rootTC, 'foo ng-binding');
async.done();
});
}));
it('should trim blanks from class names',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<div class="foo" [ng-class]="arrExpr"></div>';
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((rootTC) => {
rootTC.debugElement.componentInstance.arrExpr = [' bar '];
detectChangesAndCheck(rootTC, 'foo ng-binding bar');
async.done();
});
}));
@ -289,6 +319,20 @@ export function main() {
});
}));
it('should ignore empty and blank strings',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = `<div class="foo" [ng-class]="strExpr"></div>`;
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((rootTC) => {
rootTC.debugElement.componentInstance.strExpr = '';
detectChangesAndCheck(rootTC, 'foo ng-binding');
async.done();
});
}));
});
describe('cooperation with other class-changing constructs', () => {