Angular-cli: Angular 8 Karma tests on PhantomJS and IE11 not working

[teraxas]

After upgrade to Angular 8 I can't get tests working on PhantomJS and IE11 due to missing polyfils.

As I understand, polyfills are managed by Angular CLI, so during upgrade these lines are removed:

import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es7/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';

When running tests on IE/PhantomJS I get typical missing polyfils errors like:

PhantomJS 2.1.1 (Windows 8.0.0) ERROR
  ReferenceError: Can't find variable: Symbol
  at http://localhost:9877/_karma_webpack_/polyfills.js:4242:65

However, after returning now missing lines, I get errors about ZoneJS Promise being overwritten:

Error: Zone.js has detected that ZoneAwarePromise `(window|global).Promise` has been overwritten.
        Most likely cause is that a Promise polyfill has been loaded after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. If you must load one, do so before loading zone.js.) 

I'm not sure if this is cli bug, or if I am missing something, but I would really appreciate the help!

My ng --versions:

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.800.1
@angular-devkit/build-angular      0.800.1
@angular-devkit/build-ng-packagr   0.800.1
@angular-devkit/build-optimizer    0.800.1
@angular-devkit/build-webpack      0.800.1
@angular-devkit/core               8.0.1
@angular-devkit/schematics         8.0.1
@angular/cdk                       7.3.7
@angular/cli                       8.0.1
@angular/material                  7.3.7
@ngtools/json-schema               1.1.0
@ngtools/webpack                   8.0.1
@schematics/angular                8.0.1
@schematics/update                 0.800.1
ng-packagr                         5.2.0
rxjs                               6.5.2
typescript                         3.4.5
webpack                            4.30.0

[alan-agius4]

Duplicate of https://github.com/angular/angular-cli/issues/14455

[teraxas]

I think it's not a duplicate. I have changed target to 'es5', so serve works well for me.

[alan-agius4]

Sorry wrong issue.

Duplicate of #14618

[teraxas]

Can confirm that this is fixed now in versions:

• "@angular-devkit/build-angular": "^0.800.2",
• "@angular/cli": "^8.0.2",

[krawinkelm]

But your polyfills are still present in polyfills.ts?

[jamesbarrett95]

Can confirm that this is fixed now in versions:

• "@angular-devkit/build-angular": "^0.800.2",
• "@angular/cli": "^8.0.2",

Upgraded to these versions and I still receive an error when using PhantomJS with no core js polyfills:
PhantomJS 2.1.1 (Linux 0.0.0) ERROR
SyntaxError: Use of reserved word 'class'

8.0.3 was released recently too. I upgraded to that but still no luck.

[jamesbarrett95]

For anyone who's struggling with running PhantomJS tests with Angular 8 locally and/or in a build pipeline, this worked for me:

• Upgrade @angular/cli to 8.0.3
• Upgrade @angular-devkit/build-angular to 0.800.2
• Add "target": "es5" attribute to tsconfig.spec.json
• Remove the '#' and/or 'not' next to IE 9-11 in browserlist file.

EDIT:

This workaround isn't the best solution either. By changing the target attribute to es5, code coverage will suffer as reserved words like async, await and class won't be recognised. There are cases where our code coverage percentages dropped from 90's to 60's.

[angular-automatic-lock-bot[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._}