Angular project WebViewer integration issues

• The WebViewer does not load properly and the HTML component is recursively re-rendered inside (see image below). How should I fix this?This error has likely occurred because WebViewer can't find it's library. Please make sure that you have done the following:

  • The library containing the webviewer.min.js file is not located inside the PROJ_PATH/src/app/ folder or any of its sub-folders
  • You have correctly added the path to webviewer.min.js to the scripts array under the build options array in angular.json
  • You have correctly added the path to the library in the assets array under the build options in angular.json

• WebViewer having issues with progressive web application (PWA)

When using WebViewer as part of a PWA, make sure to include the path to WebViewer "lib" folder in your ngsw-config.json file. Also WebViewer needs to pass configuration information to it's workers. Make sure that you are not setting ignoreSearch to be true under cacheQueryOptions. So in your ngsw-config.json file

JSON

"assetGroups": [
  {
    "name": "app",
    "installMode": "prefetch",
    "resources": {
      "files": [
        "/favicon.ico",
        "/index.html",
        "/manifest.webmanifest",
        "/*.css",
        "/*.js",
      ]
    },
    "cacheQueryOptions": {
      "ignoreSearch": true
    }
  },
  {
    "name": "webviewerResources",
    "installMode": "prefetch",
    "resources": {
      "files": [
        "/path to WebViewer lib folder/lib/**"
      ]
    },
    "cacheQueryOptions": {
      "ignoreSearch": false
    }
  },
]

ignoreSearch default value is false so the ignoreSearch above is actually not needed. If a project requires ignoreSearch be to true for other resources, make sure to not set it to true for WebViewer's resources