Angular 9, KeyCloak, ServiceWorker and Edge Browser

Question

I am having a big problem as our Angular application is running fine with

• Angular 9.1
• KeyCloak
• and Service Worker

on Safari, Chrome and Firefox. But on Edge the page is staying blank. When I enter private browser mode it works fine, I assume it ignores the Service Worker then.

It first displays the KeyCloak Login page, that works. But after logging in it stays blank. There's no error in the console. If I disable the configuration in the angular.json to

...
"serviceWorker": false,
...

it works really fine. Do you have any hints on extra configuration or steps to resolve this issue? PWA has the following version:

"@angular/pwa": "^0.901.0",

ngsw.config looks like this

{
  "$schema": "./node_modules/@angular/service-worker/config/schema.json",
  "index": "/index.html",
  "assetGroups": [
    {
      "name": "app",
      "installMode": "prefetch",
      "resources": {
        "files": [
          "/favicon.ico",
          "/index.html",
          "/manifest.webmanifest",
          "/*.css",
          "/*.js"
        ]
      }
    }, {
      "name": "assets",
      "installMode": "lazy",
      "updateMode": "prefetch",
      "resources": {
        "files": [
          "/assets/**",
          "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
        ]
      }
    }
  ]
}

Answer 1

Looks like you are testing this issue with the MS Edge legacy browser. I suggest you try to make a test with the new MS Edge Chromium browser. I think that you will not have this issue in the MS Edge Chromium browser. You can download it from here.