Angular9 upgrade to Angular11 IE11 issue

Question

We are trying to upgrade our angular 9.0.4 application to angular 11.2.7. In the previous version the application worked fine in IE11 but after the upgrade it does not works anymore (nothing shown nothing logged).

Any help or hint would be appreciated...

I have found many instruction to make it work in case of new applications like: https://dev.to/coly010/angular-how-to-support-ie11-4924 or angular CLI 11 version is not working in Internet explorer 11 but none of them worked so far for upgrade

I double checked our polyfills.ts and everything looks fine. The only thing what I could not find is the .browserlist file. Based on this post: https://github.com/angular/angular-cli/issues/18032 it seems that the IE11 support became an opt-in feature so I created a file called .browserlist (and I tried with the file name .browserlistrc) the content:

last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major version
last 2 iOS major versions
Firefox ESR
not IE 9-10
IE 11

Still not works... If I run the command: npx browserslist I get back the supported list including IE

chrome 90
edge 90
edge 89
firefox 87
firefox 78
ie 11
ios_saf 14.0-14.5
ios_saf 13.4-13.7
ios_saf 13.3
ios_saf 13.2
ios_saf 13.0-13.1
safari 14
safari 13.1

Here are some of the settings in case you can spot something what I missed:

The build target is set to es5 in our tsconfig.json file

{
  "compilerOptions": {
    "importHelpers": true,
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "suppressImplicitAnyIndexErrors": true,
    "outDir": "build/www/app",
    "lib": [
      "es6",
      "dom"
    ],
    "typeRoots": [
      "node_modules/@types"
    ],
    "baseUrl": "./"
  },
  "include": [
    "src/main/webapp/app",
    "src/test/javascript/"
  ],
  "exclude": [
  ]
}

Here is the content of our polyfills.ts:

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

import 'eligrey-classlist-js-polyfill';  // Run `npm install --save eligrey-classlist-js-polyfill`.

import 'core-js/es/reflect';
import 'reflect-metadata';

import 'web-animations-js';  // Run `npm install --save web-animations-js`.

import 'zone.js/dist/zone'; // Included with Angular CLI.

// IE 11 does not support matches only webkitMatchesSelector
if (!Element.prototype.matches) {
    Element.prototype.matches = (<any>Element.prototype).msMatchesSelector ||
        Element.prototype.webkitMatchesSelector;
}

require('../manifest.webapp');

Right now the plan is to start a brand new application and add the IE11 support there and try to apply those changes to the existing application but any help would be appreciated.