Not able to view cached static files in PWA

I have a React based PWA deployed on AWS Amplify and I'm trying to cache a few PDF documents for offline use. Using USB debugging I found that the documents are effectively added to the cache. However, when I try to open a document in offline mode, I'm presented with an blank page which seems to correspond to the bare index.html of my app. My documents are located in public/documents, and service-worker.js has this added at the end:

var CACHE_NAME = "app-documents";

var urlsToCache = [
  "/documents/document_1.pdf",
  "/documents/document_2.pdf",
  "/documents/document_3.pdf"
];

self.addEventListener("install", event => {
    event.waitUntil(
        caches.open(CACHE_NAME)
            .then(function (cache) {
                return cache.addAll(urlsToCache);
            })
    );
});

I'm linking from my app to the documents with a simple hyperlink:

<p><a href="/documents/document_1.pdf">Document</a></p>