-1

In my Angular 8.0 project dev mode, using angular CLI.

It only works in Chrome, everything is fine, but it doesn't work in Firefox / Edge / IE11.

When I open the project in Firefox / Edge, I am stuck on my login page, I type my account/password, then click login, but then nothing happens, no error or message in F12.

When I open the project in IE11, only got a white page, also without error or message.

Please help me how to do,

I found somebody say import es6-slim or reflict.js in polyfills, but it doesn't work either.

My package.json

{
  "name": "std-web",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.2.6",
    "@angular/cdk": "~8.2.0",
    "@angular/common": "~8.2.6",
    "@angular/compiler": "~8.2.6",
    "@angular/core": "~8.2.6",
    "@angular/flex-layout": "^8.0.0-beta.27",
    "@angular/forms": "^8.2.6",
    "@angular/material": "^8.2.0",
    "@angular/platform-browser": "~8.2.6",
    "@angular/platform-browser-dynamic": "~8.2.6",
    "@angular/router": "~8.2.6",
    "@ngx-formly/bootstrap": "^5.4.2",
    "@ngx-formly/core": "^5.4.2",
    "@ngx-formly/material": "^5.4.2",
    "bootstrap": "^4.3.1",
    "hammerjs": "^2.0.8",
    "ng-zorro-antd": "^8.3.0",
    "rxjs": "~6.5.3",
    "tslib": "^1.9.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.4",
    "@angular/cli": "~8.3.4",
    "@angular/compiler-cli": "~8.2.6",
    "@angular/language-service": "~8.2.6",
    "@types/jasmine": "~3.4.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~12.7.5",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.3.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~2.1.0",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-node": "~8.4.1",
    "tslint": "~5.20.0",
    "typescript": "3.5.3"
  }
}

My login page component:

completeSetup(): void {
    //console.log(data);
    this.loginService.postAccountInfo(this.username, this.password)
      .subscribe(res => { 
        this.obj = res 
        this.store.set(INIT_FLAG, true);
        this.store.set(USERNAME, this.username);
        this.store.set(AUTHTOKEN,this.obj.authToken);
        console.log("login sucess");
        this.router.navigateByUrl('main/sc/candidate');
      },
      (error) => {
         this.checkAuth = true;
         console.log(error);
      });
  }

My login service:

postAccountInfo(username, paswword) {
    //AuthInfo:AuthInfo;

    return this.http.post("/um/login", {
      observe: "response",
      userName:username,
      password:paswword,
      groupId:"1234",
      orgId:"ykdemo"
    }).pipe(
      catchError(this.handleError)
    );
  }

I found the problem is about my interceptor like below, The console.log will not show, but this work fine in Chrome, how strange!

return next.handle(authReq)
.pipe( map((event: any) => {
  this.handleData(event);
  console.log("------") //console will not show
  if (event instanceof HttpResponse && event.status === 200)
  {   
      return event;
  }

}),
catchError(
  (err: HttpErrorResponse) => this.handleData(err)
  )
)
Shaolin
  • 1
  • 4

2 Answers2

0

You need to edit the browserlist file and allow IE11 in this configuration file. If you use Angular CLI project, then this file automatically created. Just open the file and file contains as below - 

> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11 # For IE 9-11 support, remove 'not'.

As per the above instruction just remove the not keyword from the last line and then try.

debasissaha
  • 48
  • 5
-3

sorry guys, I found what happend, It's my fault, Not about browser or angular, I make a mistake at local storage, cause this happend, Thanks for you help, This question can be closed.

Shaolin
  • 1
  • 4