diff --git a/ui/app/helpers/utils/fetch-with-cache.js b/ui/app/helpers/utils/fetch-with-cache.js index 351ee4ab9..ca2bbd7f0 100644 --- a/ui/app/helpers/utils/fetch-with-cache.js +++ b/ui/app/helpers/utils/fetch-with-cache.js @@ -16,7 +16,6 @@ const fetchWithCache = async ( fetchOptions.headers = new window.Headers(fetchOptions.headers) } if ( - fetchOptions.headers && fetchOptions.headers.has('Content-Type') && fetchOptions.headers.get('Content-Type') !== 'application/json' ) { @@ -24,8 +23,8 @@ const fetchWithCache = async ( } const currentTime = Date.now() - const cachedFetch = (await getStorageItem('cachedFetch')) || {} - const { cachedResponse, cachedTime } = cachedFetch[url] || {} + const cacheKey = `cachedFetch:${url}` + const { cachedResponse, cachedTime } = (await getStorageItem(cacheKey)) || {} if (cachedResponse && currentTime - cachedTime < cacheRefreshTime) { return cachedResponse } @@ -48,8 +47,8 @@ const fetchWithCache = async ( cachedResponse: responseJson, cachedTime: currentTime, } - cachedFetch[url] = cacheEntry - await setStorageItem('cachedFetch', cachedFetch) + + await setStorageItem(cacheKey, cacheEntry) return responseJson } diff --git a/ui/app/helpers/utils/fetch-with-cache.test.js b/ui/app/helpers/utils/fetch-with-cache.test.js index 43336a85e..3c98cadba 100644 --- a/ui/app/helpers/utils/fetch-with-cache.test.js +++ b/ui/app/helpers/utils/fetch-with-cache.test.js @@ -37,10 +37,8 @@ describe('Fetch with cache', function () { .reply(200, '{"average": 2}') fakeStorage.getStorageItem.returns({ - 'https://fetchwithcache.metamask.io/price': { - cachedResponse: { average: 1 }, - cachedTime: Date.now(), - }, + cachedResponse: { average: 1 }, + cachedTime: Date.now(), }) const response = await fetchWithCache( @@ -57,10 +55,8 @@ describe('Fetch with cache', function () { .reply(200, '{"average": 3}') fakeStorage.getStorageItem.returns({ - 'https://fetchwithcache.metamask.io/cached': { - cachedResponse: { average: 1 }, - cachedTime: Date.now() - 1000, - }, + cachedResponse: { average: 1 }, + cachedTime: Date.now() - 1000, }) const response = await fetchWithCache( @@ -135,4 +131,43 @@ describe('Fetch with cache', function () { { message: 'fetchWithCache only supports JSON responses' }, ) }) + + it('should correctly cache responses from interwoven requests', async function () { + nock('https://fetchwithcache.metamask.io') + .get('/foo') + .reply(200, '{"average": 9}') + nock('https://fetchwithcache.metamask.io') + .get('/bar') + .reply(200, '{"average": 9}') + + const testCache = {} + fakeStorage.getStorageItem.callsFake((key) => testCache[key]) + fakeStorage.setStorageItem.callsFake((key, value) => { + testCache[key] = value + }) + + await Promise.all([ + fetchWithCache( + 'https://fetchwithcache.metamask.io/foo', + {}, + { cacheRefreshTime: 123 }, + ), + fetchWithCache( + 'https://fetchwithcache.metamask.io/bar', + {}, + { cacheRefreshTime: 123 }, + ), + ]) + + assert.deepStrictEqual( + testCache['cachedFetch:https://fetchwithcache.metamask.io/foo'] + .cachedResponse, + { average: 9 }, + ) + assert.deepStrictEqual( + testCache['cachedFetch:https://fetchwithcache.metamask.io/bar'] + .cachedResponse, + { average: 9 }, + ) + }) })