[REGRESSION] MatMenu hidden/ animation not ending in 6.0.0.beta.2 & 3 for specific situations

Bug, feature request, or proposal:

MatMenu hidden/ animation not ending in 6.0.0.beta.2 / beta.3 for specific situations.
The error happened between beta.1 and beta.2 and is still persistent in beta.3. It works in beta.1

I'm still at angular 5.2.6

What is the expected behavior?

MatMenu panel should be shown

What is the current behavior?

Open menu works and the DOM is constructed for the MatMenu but the menu is not visible, the element style is:
opacity: 0;
transform: scale(0.01, 0.01);

see the image, the menu is not visible because the animation didnt end
cdk-describedby-message-container is display: none
.cdk-overlay-transparent-backdrop, .cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing is opacity: 0
The menu div has the class:
ng-trigger-transformMenu
and element style:
opacity: 0;
transform: scale(0.01, 0.01);

What are the steps to reproduce?

Open the menu under specific conditions that i cant define :/, in one view it works in the other it doesnt

The animation file is changed one day before the release of beta.2:
1e2b79a#diff-95edce2011fbc21142204076143cd3f4
@crisbeto @andrewseguin

I'm stuck in this state:

transformMenu: trigger('transformMenu', [

• // TODO(kara): switch to :enter and :leave once Mobile Safari is sorted out.
  state('void', style({
  opacity: 0,
  // This starts off from 0.01, instead of 0, because there's an issue in the Angular animations
  // as of 4.2, which causes the animation to be skipped if it starts from 0.
  transform: 'scale(0.01, 0.01)'
  })),

[crisbeto]

@teterovic it's hard to know what is going on from a screenshot. Can you post what your code looks like?

@crisbeto The project is very complex and the issue happens in a view that is almost similar to the other view with a few small modifications.

What I could do is to try to fix the animation code to work with the other view using a custom animation / comparing the two review #10208 . This will also show if that specific commit is the issue or not

@crisbeto I commented out the inline code in:
transformMenu: trigger('transformMenu', [])

and after that the menu opens so it's definitely that commit. The TS code has also been changed so i need to take a look into it, I will probably have time next week for it.

the code:
this._panelAnimationState = 'enter'; is properly triggered but the animation is not changed

[kdcro101]

@teterovic ,

Problem is in zone-js support for rxjs 6. Not angular/material.

Adding import into polyfills.ts fixes problem.

import "zone.js/dist/zone-patch-rxjs";

[crisbeto]

It sounds like this should've been resolved by now.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}