Unable to initialize viewer TypeError: “views[index] is undefined”

Bug Report or Feature Request (mark with an x)
- [ ] Regression (a behavior that used to work and stopped working in a new release)
- [x] Bug report -> please search issues before submitting
- [ ] Feature request
- [ ] Documentation issue or request

Hello,

We are using Angular 6 + Angular Material, we have pdf-viewer inside the Material Tab sometimes we got error

Unable to initialize viewer TypeError: “views[index] is undefined”
backtrackBeforeAllVisibleElementswebpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:553:7getVisibleElementswebpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:600:30_getVisiblePageswebpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:5395:17updatewebpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:5411:21setDocumentwebpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:4712:11invokewebpack:///./node_modules/zone.js/dist/zone.js?:387:17node_modulesangular/core/fesm5/core.js?:4121:24invokewebpack:///./node_modules/zone.js/dist/zone.js?:386:17runwebpack:///./node_modules/zone.js/dist/zone.js?:137:24scheduleResolveOrRejectwebpack:///./node_modules/zone.js/dist/zone.js?:871:29invokeTaskwebpack:///./node_modules/zone.js/dist/zone.js?:420:17node_modulesangular/core/fesm5/core.js?:4112:24invokeTaskwebpack:///./node_modules/zone.js/dist/zone.js?:419:17runTaskwebpack:///./node_modules/zone.js/dist/zone.js?:187:28drainMicroTaskQueuewebpack:///./node_modules/zone.js/dist/zone.js?:594:25invokeTaskwebpack:///./node_modules/zone.js/dist/zone.js?:499:21invokeTaskwebpack:///./node_modules/zone.js/dist/zone.js?:1539:9globalZoneAwareCallbackwebpack:///./node_modules/zone.js/dist/zone.js?:1576:21 pdf_viewer.js:4718:9
setDocument/<
webpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:4718:9
ZoneDelegate.prototype.invoke
webpack:///./node_modules/zone.js/dist/zone.js?:387:17
onInvoke
webpack:///./node_modules/@angular/core/fesm5/core.js?:4121:24
ZoneDelegate.prototype.invoke
webpack:///./node_modules/zone.js/dist/zone.js?:386:17
Zone.prototype.run
webpack:///./node_modules/zone.js/dist/zone.js?:137:24
scheduleResolveOrReject/<
webpack:///./node_modules/zone.js/dist/zone.js?:871:29
ZoneDelegate.prototype.invokeTask
webpack:///./node_modules/zone.js/dist/zone.js?:420:17
onInvokeTask
webpack:///./node_modules/@angular/core/fesm5/core.js?:4112:24
ZoneDelegate.prototype.invokeTask
webpack:///./node_modules/zone.js/dist/zone.js?:419:17
Zone.prototype.runTask
webpack:///./node_modules/zone.js/dist/zone.js?:187:28
drainMicroTaskQueue
webpack:///./node_modules/zone.js/dist/zone.js?:594:25
ZoneTask.invokeTask
webpack:///./node_modules/zone.js/dist/zone.js?:499:21
invokeTask
webpack:///./node_modules/zone.js/dist/zone.js?:1539:9
globalZoneAwareCallback
webpack:///./node_modules/zone.js/dist/zone.js?:1576:21
ERROR Error: “Uncaught (in promise): TypeError: views[index] is undefined
backtrackBeforeAllVisibleElements@webpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:553:7
getVisibleElements@webpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:600:30
_getVisiblePages@webpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:5395:17
update@webpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:5411:21
_setScaleUpdatePages@webpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:4820:9
_setScale@webpack:///./node_modules/pdfjs-dist/web/pdf_viewer.js?:4830:9
PdfViewerComponent.prototype.updateSize/<@webpack:///./node_modules/ng2-pdf-viewer/ng2-pdf-viewer.es5.js?:287:13
ZoneDelegate.prototype.invoke@webpack:///./node_modules/zone.js/dist/zone.js?:387:17
onInvoke@webpack:///./node_modules/@angular/core/fesm5/core.js?:4121:24
ZoneDelegate.prototype.invoke@webpack:///./node_modules/zone.js/dist/zone.js?:386:17
Zone.prototype.run@webpack:///./node_modules/zone.js/dist/zone.js?:137:24
scheduleResolveOrReject/<@webpack:///./node_modules/zone.js/dist/zone.js?:871:29
ZoneDelegate.prototype.invokeTask@webpack:///./node_modules/zone.js/dist/zone.js?:420:17
onInvokeTask@webpack:///./node_modules/@angular/core/fesm5/core.js?:4112:24
ZoneDelegate.prototype.invokeTask@webpack:///./node_modules/zone.js/dist/zone.js?:419:17
Zone.prototype.runTask@webpack:///./node_modules/zone.js/dist/zone.js?:187:28
drainMicroTaskQueue@webpack:///./node_modules/zone.js/dist/zone.js?:594:25
ZoneTask.invokeTask@webpack:///./node_modules/zone.js/dist/zone.js?:499:21
invokeTask@webpack:///./node_modules/zone.js/dist/zone.js?:1539:9
globalZoneAwareCallback@webpack:///./node_modules/zone.js/dist/zone.js?:1576:21

resolvePromisewebpack:///./node_modules/zone.js/dist/zone.js?:813:31scheduleResolveOrRejectwebpack:///./node_modules/zone.js/dist/zone.js?:876:17invokeTaskwebpack:///./node_modules/zone.js/dist/zone.js?:420:17node_modulesangular/core/fesm5/core.js?:4112:24invokeTaskwebpack:///./node_modules/zone.js/dist/zone.js?:419:17runTaskwebpack:///./node_modules/zone.js/dist/zone.js?:187:28drainMicroTaskQueuewebpack:///./node_modules/zone.js/dist/zone.js?:594:25invokeTaskwebpack:///./node_modules/zone.js/dist/zone.js?:499:21invokeTaskwebpack:///./node_modules/zone.js/dist/zone.js?:1539:9globalZoneAwareCallbackwebpack:///./node_modules/zone.js/dist/zone.js?:1576:21 core.js:1970:5
defaultErrorLogger
webpack:///./node_modules/@angular/core/fesm5/core.js?:1970:5
ErrorHandler.prototype.handleError
webpack:///./node_modules/@angular/core/fesm5/core.js?:2016:9
next
webpack:///./node_modules/@angular/core/fesm5/core.js?:4616:111
EventEmitter.prototype.subscribe/schedulerFn<
webpack:///./node_modules/@angular/core/fesm5/core.js?:3852:36
SafeSubscriber.prototype.__tryOrUnsub
webpack:///./node_modules/rxjs/_esm5/internal/Subscriber.js?:204:13
SafeSubscriber.prototype.next
webpack:///./node_modules/rxjs/_esm5/internal/Subscriber.js?:142:17
Subscriber.prototype._next
webpack:///./node_modules/rxjs/_esm5/internal/Subscriber.js?:86:9
Subscriber.prototype.next
webpack:///./node_modules/rxjs/_esm5/internal/Subscriber.js?:63:13
Subject.prototype.next
webpack:///./node_modules/rxjs/_esm5/internal/Subject.js?:58:17
EventEmitter.prototype.emit
webpack:///./node_modules/@angular/core/fesm5/core.js?:3836:54
onHandleError/<
webpack:///./node_modules/@angular/core/fesm5/core.js?:4143:57
ZoneDelegate.prototype.invoke
webpack:///./node_modules/zone.js/dist/zone.js?:387:17
Zone.prototype.run
webpack:///./node_modules/zone.js/dist/zone.js?:137:24
NgZone.prototype.runOutsideAngular
webpack:///./node_modules/@angular/core/fesm5/core.js?:4080:16
onHandleError
webpack:///./node_modules/@angular/core/fesm5/core.js?:4143:13
ZoneDelegate.prototype.handleError
webpack:///./node_modules/zone.js/dist/zone.js?:391:17
Zone.prototype.runGuarded
webpack:///./node_modules/zone.js/dist/zone.js?:153:25
_loop_1
webpack:///./node_modules/zone.js/dist/zone.js?:676:21
api.microtaskDrainDone
webpack:///./node_modules/zone.js/dist/zone.js?:685:17
drainMicroTaskQueue
webpack:///./node_modules/zone.js/dist/zone.js?:601:13
ZoneTask.invokeTask
webpack:///./node_modules/zone.js/dist/zone.js?:499:21
invokeTask
webpack:///./node_modules/zone.js/dist/zone.js?:1539:9
globalZoneAwareCallback
webpack:///./node_modules/zone.js/dist/zone.js?:1576:21

and the PDF is not rendered (it stucks on the loading icons on the empty pages)

Thanks

1 possible answer(s) on “Unable to initialize viewer TypeError: “views[index] is undefined”

  1. I have the same problem that you have. I was trying to display the PDF in a tab from the p-tabview from primeng (https://www.primefaces.org/primeng/#/tabview).

    From what you said about the tabs, I tried to display the PDF outside or without the tabs with the same methods that I was using and it works. I think it has some problems when trying to display the PDF inside tabs.

    Greetings.