angular: Unhandled Promise rejection: 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.) ; Zone: ; Task: Promise.then ;

This is my package.json: "dependencies": { "@angular/common": "~4.2.0", "@angular/compiler": "~4.2.0", "@angular/core": "~4.2.0", "@angular/forms": "~4.2.0", "@angular/http": "~4.2.0", "@angular/platform-browser": "~4.2.0", "@angular/platform-browser-dynamic": "~4.2.0", "@angular/router": "~4.2.0", "bootstrap": "^3.3.7", "bootstrap-notify": "^3.1.3", "concurrently": "^3.5.0", "cookie-parser": "^1.4.3", "core-js": "^2.4.1", "jquery": "^3.2.1", "newrelic": "^2.0.2", "node-uuid": "^1.4.8", "request": "^2.81.0", "rxjs": "5.0.1", "sha256": "^0.2.0", "x-frame-options": "^1.0.0", "zone.js": "^0.8.4" }, "devDependencies": { "@types/jasmine": "2.5.36", "@types/jquery": "^3.2.12", "@types/node": "^6.0.45", "angular2-template-loader": "^0.6.0", "awesome-typescript-loader": "^3.0.4", "chalk": "^2.1.0", "copy-webpack-plugin": "^4.0.1", "css-loader": "^0.26.1", "extract-text-webpack-plugin": "2.0.0-beta.5", "figures": "^2.0.0", "file-loader": "^0.9.0", "html-loader": "^0.4.3", "html-webpack-plugin": "^2.16.1", "jasmine-core": "^2.4.1", "karma": "^1.2.0", "karma-chrome-launcher": "^2.0.0", "karma-jasmine": "^1.0.2", "karma-sourcemap-loader": "^0.3.7", "karma-webpack": "^2.0.1", "null-loader": "^0.1.1", "raw-loader": "^0.5.1", "rimraf": "^2.5.2", "style-loader": "^0.13.1", "to-string-loader": "^1.1.5", "typescript": "~2.3.1", "webpack": "2.2.1", "webpack-dev-middleware": "^1.12.0", "webpack-dev-server": "2.4.1", "webpack-hot-middleware": "^2.18.2", "webpack-merge": "^3.0.0" }

This is my webpack.common.js: `const path = require(‘path’); const webpack = require(‘webpack’); const HtmlWebpackPlugin = require(‘html-webpack-plugin’); const CopyWebpackPlugin = require(‘copy-webpack-plugin’); const ExtractTextPlugin = require(‘extract-text-webpack-plugin’); const helpers = require(‘./helpers’); const project = require(‘…/project.config’);

console.log(project.config.ui); module.exports = { entry: { ‘polyfills’: ‘./src/polyfills.ts’, ‘vendor’: ‘./src/vendor.ts’, ‘app’: ‘./src/main.ts’ },

resolve: { extensions: [‘.ts’, ‘.js’], modules: [ ‘node_modules’, helpers.root(‘src’) ] },

module: { rules: [{ test: /.ts$/, loaders: [‘awesome-typescript-loader’, ‘angular2-template-loader’] }, { test: /.html$/, loader: ‘html-loader’ }, { test: /.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, loader: ‘file-loader?name=assets/[name].[hash].[ext]’ }, { test: /.css$/, exclude: helpers.root(‘src’, ‘app’), loader: [‘to-string-loader’].concat(ExtractTextPlugin.extract({ fallbackLoader: ‘style-loader’, loader: ‘css-loader?sourceMap’ })) }, { test: /.css$/, include: helpers.root(‘src’, ‘app’), loader: ‘raw-loader’ } ] },

plugins: [ /* * Plugin: CopyWebpackPlugin * Description: Copy files and directories in webpack. * * Copies project static assets. * * See: https://www.npmjs.com/package/copy-webpack-plugin */ new CopyWebpackPlugin([{ from: ‘src/assets’, to: ‘assets’ }, { from: ‘src/login.html’ } ]), // Workaround for angular/angular#11580 new webpack.ContextReplacementPlugin( // The (\|/) piece accounts for path separators in *nix and Windows /angular(\|/)core(\|/)@angular/, helpers.root(‘./src’), // location of your src {} // a map of your routes ),

new webpack.ProvidePlugin({
  $: 'jquery',
  jQuery: 'jquery'
}),

new webpack.DefinePlugin({
  'ENV': JSON.stringify(process.env.NODE_ENV),
  'CONFIG': JSON.stringify(project.config.ui)
}),

new webpack.optimize.CommonsChunkPlugin({
  name: ['app', 'vendor', 'polyfills']
}),

new HtmlWebpackPlugin({
  template: 'src/index.ejs',
  title: 'Leasing Leads Management System',
  chunksSortMode: 'dependency',
  inject: 'body',
  env: process.env.NODE_ENV
})

] };`

This is the webpack.config.js: `var webpack = require(‘webpack’); var webpackMerge = require(‘webpack-merge’); var ExtractTextPlugin = require(‘extract-text-webpack-plugin’); var commonConfig = require(‘./webpack.common.js’); var helpers = require(‘./helpers’);

const ENV = process.env.NODE_ENV = process.env.ENV = ‘production’;

module.exports = webpackMerge(commonConfig, { devtool: ‘source-map’,

output: { path: helpers.root(‘dist’), publicPath: ‘/’, filename: ‘[name].[hash].js’, chunkFilename: ‘[id].[hash].chunk.js’ },

plugins: [ new webpack.NoEmitOnErrorsPlugin(), new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618 mangle: { keep_fnames: true } }), new ExtractTextPlugin(‘[name].[hash].css’), new webpack.DefinePlugin({ ‘process.env’: { ‘ENV’: JSON.stringify(ENV) } }), new webpack.LoaderOptionsPlugin({ htmlLoader: { minimize: false // workaround for ng2 } }) ] });`

polyfills.ts `import ‘core-js/es7/reflect’; require(‘zone.js/dist/zone’);

if (process.env.ENV === ‘production’) { // Production } else { // Development and test Error[‘stackTraceLimit’] = Infinity; require(‘zone.js/dist/long-stack-trace-zone’); }`

vendor.ts `// Angular import ‘@angular/platform-browser’; import ‘@angular/platform-browser-dynamic’; import ‘@angular/core’; import ‘@angular/common’; import ‘@angular/http’; import ‘@angular/router’;

// RxJS import ‘rxjs’;

// Other vendors for example jQuery, Lodash or Bootstrap // You can import js, ts, css, sass, … import ‘bootstrap-notify’; import ‘bootstrap/dist/js/bootstrap.min.js’; import ‘bootstrap/dist/css/bootstrap.min.css’; import ‘assets/css/dataTable.css’; import ‘assets/css/app.css’; import ‘assets/css/main.css’;`

We seem to be getting an error on production intermittently:

Unhandled Promise rejection: Zone.js has detected that ZoneAwarePromise (window|global).Promisehas 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.) ; Zone: <root> ; Task: Promise.then ; Value: Error: Zone.js has detected that ZoneAwarePromise(window|global).Promisehas 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.) at Function.Zone.assertZonePatched (polyfills.e62b826c4d59b0712100.js:43) at new NgZone (vendor.e62b826c4d59b0712100.js:188) at PlatformRef_._bootstrapModuleFactoryWithZone (vendor.e62b826c4d59b0712100.js:188) at vendor.e62b826c4d59b0712100.js:188 at nrWrapper (newrelic-production.js:4) at ZoneDelegate.invoke (polyfills.e62b826c4d59b0712100.js:43) at Zone.run (polyfills.e62b826c4d59b0712100.js:43) at polyfills.e62b826c4d59b0712100.js:50 at ZoneDelegate.invokeTask (polyfills.e62b826c4d59b0712100.js:43) at Zone.runTask (polyfills.e62b826c4d59b0712100.js:43) 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.) at Function.Zone.assertZonePatched (https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:43:985) at new NgZone (https://leasing-lms.olacabs.com/vendor.e62b826c4d59b0712100.js:188:5688) at PlatformRef_._bootstrapModuleFactoryWithZone (https://leasing-lms.olacabs.com/vendor.e62b826c4d59b0712100.js:188:10499) at https://leasing-lms.olacabs.com/vendor.e62b826c4d59b0712100.js:188:11358 at nrWrapper (https://leasing-lms.olacabs.com/assets/js/newrelic-production.js:4:14951) at ZoneDelegate.invoke (https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:43:7642) at Zone.run (https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:43:2729) at https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:50:1672 at ZoneDelegate.invokeTask (https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:43:8375) at Zone.runTask (https://leasing-lms.olacabs.com/polyfills.e62b826c4d59b0712100.js:43:3426) n.onUnhandledError @ polyfills.e62b826c4d59b0712100.js:50 handleUnhandledRejection @ polyfills.e62b826c4d59b0712100.js:50 e @ polyfills.e62b826c4d59b0712100.js:50 n.microtaskDrainDone @ polyfills.e62b826c4d59b0712100.js:50 drainMicroTaskQueue @ polyfills.e62b826c4d59b0712100.js:43 Promise resolved (async) scheduleMicroTask @ polyfills.e62b826c4d59b0712100.js:43 ZoneDelegate.scheduleTask @ polyfills.e62b826c4d59b0712100.js:43 Zone.scheduleTask @ polyfills.e62b826c4d59b0712100.js:43 Zone.scheduleMicroTask @ polyfills.e62b826c4d59b0712100.js:43 scheduleResolveOrReject @ polyfills.e62b826c4d59b0712100.js:50 ZoneAwarePromise.then @ polyfills.e62b826c4d59b0712100.js:50 nrWrapper @ newrelic-production.js:4 PlatformRef_._bootstrapModuleWithZone @ vendor.e62b826c4d59b0712100.js:188 PlatformRef_.bootstrapModule @ vendor.e62b826c4d59b0712100.js:188 535 @ app.e62b826c4d59b0712100.js:160 __webpack_require__ @ polyfills.e62b826c4d59b0712100.js:1 window.webpackJsonp @ polyfills.e62b826c4d59b0712100.js:1 (anonymous) @ app.e62b826c4d59b0712100.js:1

I am unable to find which library/code is overwriting the Promise.

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Comments: 43 (14 by maintainers)

Most upvoted comments

Unfortunately it’s not working on my side. The environment that I found the problem is as follow:

  • angular element (angular 9)
  • angular app (angular 8)

both running ng-zone 0.10.3

The issue is present on ie11. I try to include the angular element inside the angular app in the index.html file. if the element loads first I got the error in the object. I tried to include the element with a setTimeout and I don’t get the error but the component (angular element) doesn’t get clicks for example and I have to force using the zone.run()

@Prabin1111 have you got any solution for this error in fusioncharts?

@sdudal, this one will be released very soon, thanks for the waiting.

This issue seems to be resolved updating to Angular 5.2.0 and Zone 0.8.20

@dsozzi, this one has been fixed, could you check it in zone.js 0.10.3, thanks.

Same here, but only in Safari <= 10.1

Zone

I had the same problem with old Safari versions. Solved it by adding the versions to the browserslist file:

ios_saf >= 10
Safari >= 10

founde here

Same here, but only in Safari <= 10.1

Zone

getting this error on chrome half of the time, running “zone.js”: “0.8.4”