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

fix(animations): ensure inner :leave animations do not remove node when skipped (#19532)

Browse Source 
PR Close #19532
This commit is contained in:
Matias Niemelä
2017-10-04 15:57:25 -07:00
committed by Chuck Jazdzewski
parent 9130505b57
commit ac50bd678e
2 changed files with 143 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
packages/core/test/animation/animation_query_integration_spec.ts
View File

@ -2380,6 +2380,62 @@ export function main() {
]);
});
it('should not cause a removal of inner @trigger DOM nodes when a parent animation occurs',
fakeAsync(() => {
@Component({
selector: 'ani-cmp',
template: `
<div @parent *ngIf="exp" class="parent">
this <div @child>child</div>
</div>
`,
animations: [
trigger(
'parent',
[
transition(
':leave',
[
style({opacity: 0}),
animate('1s', style({opacity: 1})),
]),
]),
trigger(
'child',
[
transition(
'* => something',
[
style({opacity: 0}),
animate('1s', style({opacity: 1})),
]),
]),
]
})
class Cmp {
public exp: boolean = true;
}
TestBed.configureTestingModule({declarations: [Cmp]});
const fixture = TestBed.createComponent(Cmp);
const cmp = fixture.componentInstance;
cmp.exp = true;
fixture.detectChanges();
flushMicrotasks();
cmp.exp = false;
fixture.detectChanges();
flushMicrotasks();
const players = getLog();
expect(players.length).toEqual(1);
const element = players[0] !.element;
expect(element.innerText.trim()).toMatch(/this\s+child/mg);
}));
it('should only mark outermost *directive nodes :enter and :leave when inserts and removals occur',
() => {
@Component({
@ -2619,8 +2675,8 @@ export function main() {
fixture.detectChanges();
flushMicrotasks();
expect(cmp.log).toEqual([
'c1-start', 'c1-done', 'c2-start', 'c2-done', 'p-start', 'p-done', 'c3-start',
'c3-done'
'c1-start', 'c1-done', 'c2-start', 'c2-done', 'p-start', 'c3-start', 'c3-done',
'p-done'
]);
}));