Skip to content

animateChild invoke disabled child animation in group #35558

@n0mid

Description

@n0mid

🐞 bug report

Affected Package

The issue is caused by package @angular/animations

Is this a regression?

I don't know

Description

I have group animations. Child animation is disabled on small screen, but child animation is called by animateChild despite being disabled.

 trigger('parentAnimation', [
      state('in', style({opacity: 1})),
      transition(':enter',  group([
        query('.main', [style({opacity: 0}), animate('2s ease')]),
        query('@*', animateChild())
      ])),
      ...
<div @parentAnimation *ngIf="display">
  <p class="main">Should animate</p>
  <p @childAnimation [@.disabled]="true">
    Shouldn't animates
  </p>
</div>

🔬 Minimal Reproduction

https://stackblitz.com/edit/animate-child

In Chrome and FF two animations are showing.
In Safari no animations.

🌍 Your Environment

Angular Version:


Angular CLI: 8.3.20
Node: 12.10.0
OS: darwin x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router, upgrade

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.803.20
@angular-devkit/build-angular     0.803.20
@angular-devkit/build-optimizer   0.803.20
@angular-devkit/build-webpack     0.803.20
@angular-devkit/core              8.3.8
@angular-devkit/schematics        8.3.20
@angular/cdk                      8.2.3
@angular/cli                      8.3.20
@ngtools/webpack                  8.3.8
@schematics/angular               8.3.20
@schematics/update                0.803.20
rxjs                              6.5.3
typescript                        3.5.3
webpack                           4.41.2

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions