Fix (dev): respect base path for pdf worker js (#12704)

src-ui/src/app/app.component.ts

@@ -41,7 +41,10 @@ export class AppComponent implements OnInit, OnDestroy {
 
   constructor() {
     let anyWindow = window as any
-    anyWindow.pdfWorkerSrc = 'assets/js/pdf.worker.min.mjs'
+    anyWindow.pdfWorkerSrc = new URL(
+      'assets/js/pdf.worker.min.mjs',
+      document.baseURI
+    ).toString()
     this.settings.updateAppearanceSettings()
   }
 

src-ui/src/app/components/common/pdf-viewer/pdf-viewer.component.spec.ts

@@ -9,6 +9,15 @@ describe('PngxPdfViewerComponent', () => {
   let fixture: ComponentFixture<PngxPdfViewerComponent>
   let component: PngxPdfViewerComponent
 
+  const setBaseHref = (href: string) => {
+    let base = document.querySelector('base')
+    if (!base) {
+      base = document.createElement('base')
+      document.head.appendChild(base)
+    }
+    base.setAttribute('href', href)
+  }
+
   const initComponent = async (src = 'test.pdf') => {
     component.src = src
     fixture.detectChanges()
@@ -24,6 +33,10 @@ describe('PngxPdfViewerComponent', () => {
     component = fixture.componentInstance
   })
 
+  afterEach(() => {
+    setBaseHref('/')
+  })
+
   it('loads a document and emits events', async () => {
     const loadSpy = jest.fn()
     const renderedSpy = jest.fn()
@@ -33,7 +46,7 @@ describe('PngxPdfViewerComponent', () => {
     await initComponent()
 
     expect(pdfjs.GlobalWorkerOptions.workerSrc).toBe(
-      '/assets/js/pdf.worker.min.mjs'
+      new URL('assets/js/pdf.worker.min.mjs', document.baseURI).toString()
     )
     const isVisible = (component as any).findController.onIsPageVisible as
       | (() => boolean)
@@ -46,6 +59,19 @@ describe('PngxPdfViewerComponent', () => {
     expect((component as any).pdfViewer).toBeInstanceOf(PDFViewer)
   })
 
+  it('resolves the worker source relative to the document base URI', async () => {
+    setBaseHref('/paperless/')
+
+    await initComponent()
+
+    expect(pdfjs.GlobalWorkerOptions.workerSrc).toBe(
+      new URL('assets/js/pdf.worker.min.mjs', document.baseURI).toString()
+    )
+    expect(pdfjs.GlobalWorkerOptions.workerSrc).toContain(
+      '/paperless/assets/js/pdf.worker.min.mjs'
+    )
+  })
+
   it('initializes single-page viewer and disables text layer', async () => {
     component.renderMode = PdfRenderMode.Single
     component.selectable = false

src-ui/src/app/components/common/pdf-viewer/pdf-viewer.component.ts

@@ -1,8 +1,10 @@
 import {
   AfterViewInit,
   Component,
+  DOCUMENT,
   ElementRef,
   EventEmitter,
+  inject,
   Input,
   OnChanges,
   OnDestroy,
@@ -39,6 +41,8 @@ import {
 export class PngxPdfViewerComponent
   implements AfterViewInit, OnChanges, OnDestroy
 {
+  private readonly document = inject<Document>(DOCUMENT)
+
   @Input() src!: PdfSource
   @Input() page?: number
   @Output() pageChange = new EventEmitter<number>()
@@ -166,7 +170,10 @@ export class PngxPdfViewerComponent
     this.lastFindQuery = ''
     this.loadingTask?.destroy()
 
-    GlobalWorkerOptions.workerSrc = '/assets/js/pdf.worker.min.mjs'
+    GlobalWorkerOptions.workerSrc = new URL(
+      'assets/js/pdf.worker.min.mjs',
+      this.document.baseURI
+    ).toString()
     this.loadingTask = getDocument(this.src)
 
     try {