diff --git a/packages/venia-concept/src/ServiceWorker/Utilities/__tests__/imageCacheHandler.spec.js b/packages/venia-concept/src/ServiceWorker/Utilities/__tests__/imageCacheHandler.spec.js index 0aa2b005fd..adf7661e82 100644 --- a/packages/venia-concept/src/ServiceWorker/Utilities/__tests__/imageCacheHandler.spec.js +++ b/packages/venia-concept/src/ServiceWorker/Utilities/__tests__/imageCacheHandler.spec.js @@ -96,6 +96,25 @@ describe('Testing findSameOrLargerImage', () => { expect(returnedResponse.url).toBe(expectedUrl); }); + test('Should not return response if URL for same filename is not available', async () => { + const fileName1 = 'prefixed-file-name.jpg'; + const fileName2 = 'file-name.jpg'; + + mockMatchFn.mockReturnValue( + Promise.resolve({ + url: `https://develop.pwa-venia.com/media/catalog/v/s/${fileName1}?auto=webp&format=pjpg&width=1600&height=2000` + }) + ); + + const returnedResponse = await findSameOrLargerImage( + new URL( + `https://develop.pwa-venia.com/media/catalog/v/s/${fileName2}?auto=webp&format=pjpg&width=1600&height=2000` + ) + ); + + expect(returnedResponse).toBeUndefined(); + }); + test('Should return the closest high resolution image response from cache for a given width', async () => { const requestedUrl = 'https://develop.pwa-venia.com/media/catalog/v/s/vsk12-la_main_3.jpg?auto=webp&format=pjpg&width=800&height=1000'; diff --git a/packages/venia-concept/src/ServiceWorker/Utilities/imageCacheHandler.js b/packages/venia-concept/src/ServiceWorker/Utilities/imageCacheHandler.js index a13ae4755a..b02b7e8873 100644 --- a/packages/venia-concept/src/ServiceWorker/Utilities/imageCacheHandler.js +++ b/packages/venia-concept/src/ServiceWorker/Utilities/imageCacheHandler.js @@ -34,9 +34,11 @@ export const findSameOrLargerImage = async url => { const cache = await caches.open(CATALOG_CACHE_NAME); const cachedURLs = await cache.keys(); - const cachedSources = await cachedURLs.filter(({ url }) => - url.includes(requestedFilename) - ); + const cachedSources = await cachedURLs.filter(({ url }) => { + const cachedFileName = new URL(url).pathname.split('/').reverse()[0]; + + return cachedFileName === requestedFilename; + }); // Find the cached version of this image that is closest to the requested // width without going under it.