angular: Staticaly downgraded components no longer rendered in AngularJS tests after call to $compile after upgrading @angular/upgrade from 7.1.4 to 7.2.0

🐞 bug report

Affected Package

The issue is caused by package @angular/upgrade: 7.2.0

Is this a regression?

Yes, the previous version in which this bug was not present was: 7.1.4

Description

A clear and concise description of the problem...

Our existing AngularJS tests started failing after upgrading @angular\upgrade from 7.1.4 to 7.2.0. The reason for the failures is that downgraded components are no-longer rendered in AngularJS tests after calling $compile. The cause seems to be the introduction of Promise.all at https://github.com/angular/angular/commit/bc0ee01#diff-fbe3a53baaa7090c3afd629acfd73fccR207

πŸ”¬ Minimal Reproduction

It will be very hard to create minimal reproduction environment due to the co-existence of angular & AngularJS in the app and considering our complex setup. In a nutshell we use $compile to compile templates containing downgraded components and than we call $scope.$apply(). After that we perform some verification of the rendered html. It seems that after this change doDowngrade is called well after the verification completes. In a sense this change is breaking the synchronous nature of Angular 1’s $compile as stated in the jsdoc of ParentInjectorPromise.

We are using UpgradeAppType.Static. In our case finalParentInjector & finalModuleInjector are the same injector so I did an experiment and reverted back to having parentInjector.then(downgradeFn); and all tests started passing again.

πŸ”₯ Exception or Error





🌍 Your Environment

Angular Version:




     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / β–³ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 7.3.7
Node: 8.11.1
OS: win32 x64
Angular: 7.2.14
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router, upgrade

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.13.7
@angular-devkit/build-angular      0.13.8
@angular-devkit/build-ng-packagr   0.13.8
@angular-devkit/build-optimizer    0.13.8
@angular-devkit/build-webpack      0.13.8
@angular-devkit/core               7.3.7
@angular-devkit/schematics         7.3.7
@angular/cli                       7.3.7
@ngtools/json-schema               1.1.0
@ngtools/webpack                   7.3.8
@schematics/angular                7.3.7
@schematics/update                 0.13.7
ng-packagr                         4.7.1
rxjs                               6.2.2
typescript                         3.2.4
webpack                            4.29.0


Anything else relevant?

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 2
  • Comments: 17 (12 by maintainers)

Commits related to this issue

Most upvoted comments

OK, I was able to create a minimal reproduction, based on https://github.com/angular/angular/issues/30330#issuecomment-500590820 (thx @brannislav). The issue happens when there are two β€œtop-level” downgraded components; one projected into the other.

Now, on to writing a test πŸ˜ƒ @artem-galas, are you still interested in working on this or should someone else take over?

I am having a hard time coming up with a test for this. I’ll poke at it some more this week, but I think we should land the fix with or without a test.

I went ahead and submitted #31840 πŸ‘Ό

We have a similar issue and patching angular/upgrade with replacing Promise.all() to sync version helped also. Will it be fixed soon?

@gkalpak I applied the patch verbatim and I can confirm all tests in our suite are back to green. Indeed this seems to be an issue in Promise.all/ZoneAwarePromise.all.

@gkalpak I would like to try solve this issue.

I just copy/paste your suggestion, and I want to test it. But I didn’t find any test file that test ParentInjectorPromise class.

Could you please give me a clue how to test it? Or we should test it manually (create AngularJS app -> downgrade some component, and so on)

Thanks.