Firefox -> broken browser history back button when load PDF as byte array

[dafinel]

When you load the pdf using a byte array or a blob you have to press back twice come back to previos page.

For example : You have an overview with a list of files, and when you click on on row will be redirected to a detail page where the pdf content is shown. In this case I have to press twice back button to the to the overview page.

This issue can be reproduced on the demo app : https://ng2-pdfjs-viewer.azurewebsites.net/bytearray

Steps: Browser: Firefox

1. Click on "Simple Configuration" from sidebar
2. Click on " Blob and Byte array " from sidebar
3. Press back button

Actual result: The frame with the pdf content is cleared, and I have to press again back to go to "Simple Configuration" Expected result: Navigate back to "Simple Configuration"

If you know a solution for this issue please help me. I may case the back button is integrated in the application and we have an issue opened by the client

[codehippie1]

@dafinel Can you try this directly at https://mozilla.github.io/pdf.js/web/viewer.html#page=2 and let me know.

Looks like an issue of underlying component.

[Ciferlingvulo]

I have a somewhat similar issue. I think it's worth mentioning here instead of creating a new issue.

I have a few buttons on a page that load a different document in the same PDF viewer. The PDF are loaded as byte array too, as in the original issue. The code looks like this :

  @ViewChild('pdfViewer', { static: false }) public pdfViewer: PdfJsViewerComponent;
  @ViewChild('pdfViewerContainer', { static: false }) public pdfViewerContainer: ElementRef<HTMLElement>;

  displayPDF(pdfIndex: number): void {
    this.pdfIndex = pdfIndex;
    this.getPDF(pdfIndex).subscribe((file: any) => {
      this.pdfViewer.pdfSrc = file;
      this.pdfViewer.zoom = 'page-fit';
      this.pdfViewer.refresh();
      setTimeout(() => {
        this.pdfViewerContainer.nativeElement.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
      }, 0);
    });
  }

Everything is loaded fine and work as intended, but when I click on the back button of my browser, it stays on the same page and simply goes back to the previous file that was loaded in the PDF viewer. This is true on every browser I've tried, plus I get the issue mentioned by OP that PDF content is cleared when on Firefox.

Regards.

[roma2341]

Same issue in Chrome, when i click browser Back button it stays on the same browser page.

[MaxEtMoritz]

Same Issue here. Seems to be caused by the iFrame the PDF viewer is in and strange Behavior of Firefox to include iFrame URL changes in the back/forward History. A possible workaround is mentioned here: https://github.com/officert/vue-friendly-iframe/issues/20#issuecomment-573599850