iSharkFly-Docs/angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(class): allow class names with mixed case

Browse Source 
Fixes #3001

BREAKING CHANGE:

View renderer used to take normalized CSS class names (ex. fooBar for foo-bar).
With this change a rendered implementation gets a calss name as specified in a
template, without any transformations / normalization. This change only affects
custom view renderers that should be updated accordingly.

Closes #3264
This commit is contained in:
Pawel Kozlowski
2015-07-24 10:49:47 +02:00
parent 329a6e00dc
commit a8b57256c8
4 changed files with 35 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
modules/angular2/test/directives/class_spec.ts
+20 -4
View File
@@ -61,6 +61,22 @@ export function main() {
});
}));
it('should add classes specified in an object literal without change in class names',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = `<div [class]="{'foo-bar': true, 'fooBar': true}"></div>`;
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((rootTC) => {
rootTC.detectChanges();
expect(rootTC.componentViewChildren[0].nativeElement.className)
.toEqual('ng-binding foo-bar fooBar');
async.done();
});
}));
it('should add and remove classes based on changes in object literal values',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<div [class]="{foo: condition, bar: !condition}"></div>';
@@ -141,14 +157,14 @@ export function main() {
it('should add classes specified in a list literal',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = `<div [class]="['foo', 'bar']"></div>`;
var template = `<div [class]="['foo', 'bar', 'foo-bar', 'fooBar']"></div>`;
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((rootTC) => {
rootTC.detectChanges();
expect(rootTC.componentViewChildren[0].nativeElement.className)
.toEqual('ng-binding foo bar');
.toEqual('ng-binding foo bar foo-bar fooBar');
async.done();
});
@@ -212,14 +228,14 @@ export function main() {
it('should add classes specified in a string literal',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = `<div [class]="'foo bar'"></div>`;
var template = `<div [class]="'foo bar foo-bar fooBar'"></div>`;
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((rootTC) => {
rootTC.detectChanges();
expect(rootTC.componentViewChildren[0].nativeElement.className)
.toEqual('ng-binding foo bar');
.toEqual('ng-binding foo bar foo-bar fooBar');
async.done();
});
modules/angular2/test/render/dom/view/view_spec.ts
+5 -1
View File
@@ -100,11 +100,15 @@ export function main() {
expect(DOM.hasClass(el, 'active')).toEqual(false);
});
it('should de-normalize class names', () => {
it('should not de-normalize class names', () => {
view.setElementClass(0, 'veryActive', true);
view.setElementClass(0, 'very-active', true);
expect(DOM.hasClass(el, 'veryActive')).toEqual(true);
expect(DOM.hasClass(el, 'very-active')).toEqual(true);
view.setElementClass(0, 'veryActive', false);
view.setElementClass(0, 'very-active', false);
expect(DOM.hasClass(el, 'veryActive')).toEqual(false);
expect(DOM.hasClass(el, 'very-active')).toEqual(false);
});
});