Programmatically change page in PDF.js with QWebEngineView

Question

I am making an application in PyQt5 that involves displaying a PDF using the QWebEngineView and PDF.js by Mozilla.

I am able to display the PDF no problem, but I cannot figure out how to either:

• 1: set the page on load, or
• 2: update the page after it is already loaded

I have tried the numerous options from other Stackoverflow posts that involve using self.runJavaScript() to change it, but it always results in either "Cannot set property of undefined" or "Object is NoneType".

Here is my method:

def load_file(self, file, page=0) -> None:
        url = QtCore.QUrl().fromLocalFile(os.path.abspath("./pdfjs/web/viewer.html"))
        query = QtCore.QUrlQuery()
        query.addQueryItem("file", os.path.normpath(os.path.abspath(file)))
        url.setQuery(query)
        self.pdf_view.load(url)

where self.pdf_view is QWebEngineView.

I would appreciate any help on how to accomplish this.

EDIT: I was able to specify the page on load with the # symbol, but as for changing the page without re-loading the whole thing is still unknown to me.

Answer 1

The PDF.js viewer loads some scripts that create a PDFViewer object with all the necessary properties for programmatically navigating pages. So you just need to run some simple javascript on the main viewer page to get the functionality you need. To make things a little nicer to work with, it's also helpful to provide a way to run the javascript synchronously so that return values can be accessed more easily.

Below is a simple working demo that implements that (only tested on Linux). Hopefully it should be clear how to adapt it to work with your own application:

import sys, os
from PyQt5 import QtCore, QtWidgets, QtWebEngineWidgets

# PDFJS = '/usr/share/pdf.js/web/viewer.html'
PDFJS = './pdfjs/web/viewer.html'

class Window(QtWidgets.QWidget):
    def __init__(self):
        super().__init__()
        self.buttonNext = QtWidgets.QPushButton('Next Page')
        self.buttonNext.clicked.connect(lambda: self.changePage(+1))
        self.buttonPrev = QtWidgets.QPushButton('Previous Page')
        self.buttonPrev.clicked.connect(lambda: self.changePage(-1))
        self.viewer = QtWebEngineWidgets.QWebEngineView()
        layout = QtWidgets.QGridLayout(self)
        layout.addWidget(self.viewer, 0, 0, 1, 2)
        layout.addWidget(self.buttonPrev, 1, 0)
        layout.addWidget(self.buttonNext, 1, 1)

    def loadFile(self, file):
        url = QtCore.QUrl.fromLocalFile(os.path.abspath(PDFJS))
        query = QtCore.QUrlQuery()
        query.addQueryItem('file', os.path.abspath(file))
        url.setQuery(query)
        self.viewer.load(url)

    def execJavaScript(self, script):
        result = None
        def callback(data):
            nonlocal result
            result = data
            loop.quit()
        loop = QtCore.QEventLoop()
        QtCore.QTimer.singleShot(
            0, lambda: self.viewer.page().runJavaScript(script, callback))
        loop.exec()
        return result

    def changePage(self, delta):
        page = self.execJavaScript(
            'PDFViewerApplication.pdfViewer.currentPageNumber')
        self.setCurrentPage(page + int(delta))

    def setCurrentPage(self, page):
        count = self.execJavaScript(
            'PDFViewerApplication.pdfViewer.pagesCount')
        if 1 <= page <= count:
            self.execJavaScript(
                f'PDFViewerApplication.pdfViewer.currentPageNumber = {page}')

if __name__ == '__main__':

    app = QtWidgets.QApplication(sys.argv)
    window = Window()
    if len(sys.argv) > 1:
        window.loadFile(sys.argv[1])
    window.setGeometry(600, 50, 800, 600)
    window.show()
    sys.exit(app.exec_())