diff --git a/modules/@angular/compiler/src/animation/animation_ast.ts b/modules/@angular/compiler/src/animation/animation_ast.ts index 4b4a323372..aa4d10a869 100644 --- a/modules/@angular/compiler/src/animation/animation_ast.ts +++ b/modules/@angular/compiler/src/animation/animation_ast.ts @@ -52,7 +52,7 @@ export class AnimationStateTransitionExpression { export class AnimationStateTransitionAst extends AnimationStateAst { constructor( public stateChanges: AnimationStateTransitionExpression[], - public animation: AnimationSequenceAst) { + public animation: AnimationWithStepsAst) { super(); } visit(visitor: AnimationAstVisitor, context: any): any { diff --git a/modules/@angular/compiler/src/animation/animation_parser.ts b/modules/@angular/compiler/src/animation/animation_parser.ts index 72769c7b68..40ab414ea5 100644 --- a/modules/@angular/compiler/src/animation/animation_parser.ts +++ b/modules/@angular/compiler/src/animation/animation_parser.ts @@ -117,11 +117,11 @@ function _parseAnimationStateTransition( _fillAnimationAstStartingKeyframes(animationAst, styles, errors); } - var sequenceAst = (animationAst instanceof AnimationSequenceAst) ? - animationAst : + var stepsAst: AnimationWithStepsAst = (animationAst instanceof AnimationWithStepsAst) ? + animationAst : new AnimationSequenceAst([animationAst]); - return new AnimationStateTransitionAst(transitionExprs, sequenceAst); + return new AnimationStateTransitionAst(transitionExprs, stepsAst); } function _parseAnimationTransitionExpr( @@ -180,7 +180,9 @@ function _normalizeStyleSteps( entry: CompileAnimationMetadata, stateStyles: {[key: string]: AnimationStylesAst}, errors: AnimationParseError[]): CompileAnimationMetadata { var steps = _normalizeStyleStepEntry(entry, stateStyles, errors); - return new CompileAnimationSequenceMetadata(steps); + return (entry instanceof CompileAnimationGroupMetadata) ? + new CompileAnimationGroupMetadata(steps) : + new CompileAnimationSequenceMetadata(steps); } function _mergeAnimationStyles( diff --git a/modules/@angular/core/test/animation/animation_integration_spec.ts b/modules/@angular/core/test/animation/animation_integration_spec.ts index ac076100f5..1d8ab43f5e 100644 --- a/modules/@angular/core/test/animation/animation_integration_spec.ts +++ b/modules/@angular/core/test/animation/animation_integration_spec.ts @@ -13,6 +13,7 @@ import {MockAnimationDriver} from '@angular/platform-browser/testing/mock_animat import {Component} from '../../index'; import {DEFAULT_STATE} from '../../src/animation/animation_constants'; +import {AnimationGroupPlayer} from '../../src/animation/animation_group_player'; import {AnimationKeyframe} from '../../src/animation/animation_keyframe'; import {AnimationPlayer} from '../../src/animation/animation_player'; import {AnimationStyles} from '../../src/animation/animation_styles'; @@ -378,6 +379,30 @@ function declareTests({useJit}: {useJit: boolean}) { assertPlaying(player4, true); assertPlaying(player5, true); })); + + it('should allow a group animation to be set as the entry point for an animation trigger', + fakeAsync(() => { + TestBed.overrideComponent(DummyIfCmp, { + set: { + template: `
`, + animations: [trigger( + 'myAnimation', [transition('void => *', group([ + animate(1000, style({color: 'red'})), + animate('1s 0.5s', style({fontSize: 10})), + ]))])] + } + }); + + const driver = TestBed.get(AnimationDriver) as MockAnimationDriver; + const fixture = TestBed.createComponent(DummyIfCmp); + const cmp = fixture.debugElement.componentInstance; + + cmp.exp = true; + fixture.detectChanges(); + + const player = driver.log[0]['player']; + expect(player.parentPlayer instanceof AnimationGroupPlayer).toBe(true); + })); });