3

I have an Angular app generated with the CLI. Angular version 9.0.6

This app loads perfectly on Internet Explorer 11 but doesn't in Edge. in Edge, the network request shows that some bundles are pending and they don't finish downloading, thus it says not responding.

enter image description here

I am also suspecting a NPM package called ngx-swiper-wrapper(9.0.1) as this causes the app not to work when tested locally on port 4200 both IE 11 and Edge. On production/test ENV the app loads on IE but not on Edge, is there something I am missing?

When un-commenting the following lines in the polyfills.ts

import 'web-animations-js'
import 'classlist.js';
import 'zone.js/dist/zone'; 

After installing web-animations-js and classlist.js, the app does not work on both IE and Edge. It cries about the following on IE

SCRIPT1002: Syntax error
vendor.js (46943,1)

Which goes to some line with class Dom7 { ......

How can I fix this, I cannot seem to figure it out.

My Node/Express server does have the following headers

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept,Authorization");
  res.header("Access-Control-Allow-Methods","POST,GET,PUT,DELETE,OPTION");
  next();
});

There's no error on the developer tools. Here is a reproduction link

UPDATE This issue is caused by the library I am using, not Angular itself. There is an open issue respecting this here.

Thabo
  • 1,303
  • 2
  • 19
  • 40
  • 1
    Angular 8+ doesn't need to uncomment polyfills. Is there any error in console in Edge Legacy? Have you tried to clear browser cache and test again? I didn't reproduce the issue in angular 8 app in Edge Legacy. I suggest you could provide [a minimal, reproducible sample](https://stackoverflow.com/help/minimal-reproducible-example) so that we can have a test and see how to help. You could use some online code editor like StackBlitz. – Yu Zhou Apr 03 '20 at 03:11
  • @YuZhou please see edit, there's a reproduction link at the bottom – Thabo Apr 03 '20 at 04:40
  • The app on the reproduction link loads. Could it be the Node/Express server HTTP response configs? Or maybe the Angular version – Thabo Apr 03 '20 at 05:01
  • 1
    I update my angular version to 9.1.0 and test your code. It works fine except a minor error `Property 'index' does not exist on type 'AppComponent'`. We just need to define it in `AppComponent`. So I think the issue is not related with Angular version and your code is right. It might be related to the Edge version or the back end server. There's an open issue on Microsoft edge browser version 42: *Edge marks a request/response as pending indefinitely requests with content-encoding:identity.* I use Edge Legacy 44 and Edge Chromiun. You can try the latest Edge version to see if it works well. – Yu Zhou Apr 03 '20 at 07:47
  • @YuZhou, OK I see, thank you let me try that out – Thabo Apr 03 '20 at 07:56
  • 1
    No problem. Please feel free to contact me if you have any updates. – Yu Zhou Apr 03 '20 at 08:06
  • @YuZhou, it works fine in Edge 80, I have just update my Edge version. So I am wondering if the issue was with my Edge browser or the version which was 44 of Edge – Thabo Apr 03 '20 at 08:56
  • 1
    I think the issue is with Edge Legacy not only yours and it is fixed in the new Edge Chromium version. I realized this from [a former thread](https://stackoverflow.com/questions/58157960/post-method-not-working-in-edge-browser-but-it-is-working-in-other-browser-like/58182966#58182966) and I think you're not the only one. – Yu Zhou Apr 03 '20 at 09:33
  • @YuZhou thank you for assisting, I will see as time goes what I can do. – Thabo Apr 03 '20 at 09:41

0 Answers0