cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(animations): remove deprecated trigger APIs (#10825)

Browse Source 
BREAKING CHANGE: Animations defined using an at-symbol prefix that are
not property bound are now invalid.

```html
<!-- this is now invalid -->
<div @flip="flipState"></div>

<!-- change that to -->
<div [@flip]="flipState"></div>
```

BREAKING CHANGE: Animations that are not bound using the at-symbol
prefix using `animate-` must now be preixed using `bind-animate-`.

```html
<!-- this is now invalid -->
<div animate-flip="flipState"></div>

<!-- is valid now -->
<div bind-animate-flip="flipState"></div>
```

Closes #10825
This commit is contained in:
Matias Niemelä
2016-08-16 14:09:21 -07:00
committed by vikerman
parent a86c554a8e
commit 9adf80385b
2 changed files with 37 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
modules/@angular/compiler/test/template_parser/template_parser_spec.ts
View File

@ -284,44 +284,36 @@ Can't bind to 'invalidProp' since it isn't a known property of 'my-component'.
]);
});
it('should parse bound properties via animate- and not report them as attributes', () => {
expect(humanizeTplAst(parse('<div animate-something="value2">', []))).toEqual([
[ElementAst, 'div'],
[BoundElementPropertyAst, PropertyBindingType.Animation, 'something', 'value2', null]
]);
});
// DEPRECATED: remove this spec post RC5
it('should parse bound properties via @ and not report them as attributes and also report a deprecation warning',
it('should parse bound properties via bind-animate- and not report them as animation properties',
() => {
expect(humanizeTplAst(parse('<div @something="value2">', []))).toEqual([
expect(humanizeTplAst(parse('<div bind-animate-something="value2">', []))).toEqual([
[ElementAst, 'div'],
[
BoundElementPropertyAst, PropertyBindingType.Animation, 'something', 'value2', null
]
]);
expect(console.warnings).toEqual([[
'Template parse warnings:',
`Assigning animation triggers via @prop="exp" attributes with an expression is deprecated. Use property bindings (e.g. [@prop]="exp") instead! ("<div [ERROR ->]@something="value2">"): TestComp@0:5`
].join('\n')]);
});
// DEPRECATED: remove this spec post RC5
it('should issue a warning when host attributes contain a non property-bound animation trigger',
it('should throw an error when parsing detects non-bound properties via @ that contain a value',
() => {
var dirA = CompileDirectiveMetadata.create({
selector: 'div',
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'DirA'}),
host: {'@prop': 'expr'}
});
expect(() => { parse('<div @something="value2">', []); })
.toThrowError(
/Assigning animation triggers via @prop="exp" attributes with an expression is invalid. Use property bindings \(e.g. \[@prop\]="exp"\) or use an attribute without a value \(e.g. @prop\) instead. \("<div \[ERROR ->\]@something="value2">"\): TestComp@0:5/);
});
humanizeTplAst(parse('<div></div>', [dirA]));
it('should throw an error when host attributes contain a non property-bound animation trigger',
() => {
expect(() => {
var dirA = CompileDirectiveMetadata.create({
selector: 'div',
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'DirA'}),
host: {'@prop': 'expr'}
});
expect(console.warnings).toEqual([[
'Template parse warnings:',
`Assigning animation triggers within host data as attributes such as "@prop": "exp" is deprecated. Use host bindings (e.g. "[@prop]": "exp") instead! ("[ERROR ->]<div></div>"): TestComp@0:0, Directive DirA`
].join('\n')]);
humanizeTplAst(parse('<div></div>', [dirA]));
})
.toThrowError(
/Assigning animation triggers within host data as attributes such as "@prop": "exp" is invalid. Use host bindings \(e.g. "\[@prop\]": "exp"\) instead. \("\[ERROR ->\]<div><\/div>"\): TestComp@0:0, Directive DirA/);
});
it('should not issue a warning when host attributes contain a valid property-bound animation trigger',