import type { IconifyJSON } from '@iconify/types'; import type { BrowserStorageItem, IconStorageWithCache, } from '../../lib/browser-storage/types'; import { storeInBrowserStorage } from '../../lib/browser-storage/store'; import { initBrowserStorage } from '../../lib/browser-storage'; import { browserStorageConfig, browserStorageEmptyItems, } from '../../lib/browser-storage/data'; import { getBrowserStorageItemsCount } from '../../lib/browser-storage/count'; import { getBrowserStorage } from '../../lib/browser-storage/global'; import { getStorage, iconExists } from '../../lib/storage/storage'; import { nextPrefix, createCache, reset } from '../../lib/browser-storage/mock'; import { browserCacheCountKey, browserCachePrefix, browserCacheVersion, browserCacheVersionKey, browserStorageHour, browserStorageCacheExpiration, } from '../../lib/browser-storage/config'; describe('Testing saving to localStorage', () => { const provider = ''; it('One icon set', () => { const prefix = nextPrefix(); const cache = createCache(); const storage = getStorage(provider, prefix) as IconStorageWithCache; // Add one icon set const icon: IconifyJSON = { prefix: prefix, icons: { foo: { body: '', }, }, }; const item: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon, }; // Set cache reset({ localStorage: cache, }); // Check icon storage expect(iconExists(storage, 'foo')).toBe(false); expect(storage.lastModifiedCached).toBeUndefined(); // Counter should be 0 // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 0 ); // Save item storeInBrowserStorage(storage, icon); // Storing in cache should not add item to storage expect(iconExists(storage, 'foo')).toBe(false); // lastModified is missing, so should not have updated expect(storage.lastModifiedCached).toBeUndefined(); // Check data that should have been updated because storeCache() // should call load function before first execution expect(browserStorageConfig).toEqual({ local: true, session: false, }); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // Check cache expect(cache.getItem(browserCachePrefix + '0')).toBe( JSON.stringify(item) ); expect(cache.getItem(browserCacheCountKey)).toBe('1'); expect(cache.getItem(browserCacheVersionKey)).toBe(browserCacheVersion); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 1 ); }); it('Multiple icon sets', () => { const prefix = nextPrefix(); const cache = createCache(); const storage = getStorage(provider, prefix) as IconStorageWithCache; const lastModified = 12345; // Add icon sets const icon0: IconifyJSON = { prefix: prefix, lastModified, icons: { foo0: { body: '', }, }, }; const item0: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon0, }; const icon1: IconifyJSON = { prefix: prefix, lastModified, icons: { foo: { body: '', }, }, }; const item1: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon1, }; // Set cache reset({ localStorage: cache, }); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 0 ); expect(storage.lastModifiedCached).toBeUndefined(); // Save items storeInBrowserStorage(storage, icon0); storeInBrowserStorage(storage, icon1); // Check data that should have been updated because storeCache() // should call load function before first execution expect(browserStorageConfig).toEqual({ local: true, session: false, }); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // lastModified should be set expect(storage.lastModifiedCached).toBe(lastModified); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 2 ); // Check cache expect(cache.getItem(browserCachePrefix + '0')).toBe( JSON.stringify(item0) ); expect(cache.getItem(browserCachePrefix + '1')).toBe( JSON.stringify(item1) ); expect(cache.getItem(browserCacheCountKey)).toBe('2'); expect(cache.getItem(browserCacheVersionKey)).toBe(browserCacheVersion); }); it('Multiple icon sets, first is outdated', () => { const prefix = nextPrefix(); const cache = createCache(); const storage = getStorage(provider, prefix) as IconStorageWithCache; const lastModified1 = 1234; const lastModified2 = 12345; // Add icon sets const icon0: IconifyJSON = { prefix: prefix, lastModified: lastModified1, icons: { foo0: { body: '', }, }, }; // lastModified is newer than first entry: first entry should be deleted const icon1: IconifyJSON = { prefix: prefix, lastModified: lastModified2, icons: { foo: { body: '', }, }, }; const item1: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon1, }; // Set cache reset({ localStorage: cache, }); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 0 ); expect(storage.lastModifiedCached).toBeUndefined(); // Save items storeInBrowserStorage(storage, icon0); storeInBrowserStorage(storage, icon1); // Check data that should have been updated because storeCache() // should call load function before first execution expect(browserStorageConfig).toEqual({ local: true, session: false, }); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // lastModified should be set to max value expect(storage.lastModifiedCached).toBe(lastModified2); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 1 ); // Check cache expect(cache.getItem(browserCachePrefix + '0')).toBe( // Second item! JSON.stringify(item1) ); expect(cache.getItem(browserCachePrefix + '1')).toBeFalsy(); expect(cache.getItem(browserCacheCountKey)).toBe('1'); expect(cache.getItem(browserCacheVersionKey)).toBe(browserCacheVersion); }); it('Multiple icon sets, second set is outdated', () => { const prefix = nextPrefix(); const cache = createCache(); const storage = getStorage(provider, prefix) as IconStorageWithCache; const lastModified1 = 12345; const lastModified2 = 1234; // Add icon sets const icon0: IconifyJSON = { prefix: prefix, lastModified: lastModified1, icons: { foo0: { body: '', }, }, }; const item0: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon0, }; // Icon set with lastModified lower than previous entry should not be stored const icon1: IconifyJSON = { prefix: prefix, lastModified: lastModified2, icons: { foo: { body: '', }, }, }; // Set cache reset({ localStorage: cache, }); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 0 ); expect(storage.lastModifiedCached).toBeUndefined(); // Save items storeInBrowserStorage(storage, icon0); storeInBrowserStorage(storage, icon1); // Check data that should have been updated because storeCache() // should call load function before first execution expect(browserStorageConfig).toEqual({ local: true, session: false, }); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // lastModified should be set to maximum value expect(storage.lastModifiedCached).toBe(lastModified1); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 1 ); // Check cache expect(cache.getItem(browserCachePrefix + '0')).toBe( JSON.stringify(item0) ); expect(cache.getItem(browserCachePrefix + '1')).toBeFalsy(); expect(cache.getItem(browserCacheCountKey)).toBe('1'); expect(cache.getItem(browserCacheVersionKey)).toBe(browserCacheVersion); }); it('Adding icon set on unused spot', () => { const prefix = nextPrefix(); const cache = createCache(); const storage = getStorage(provider, prefix); // Add icon sets const icon0: IconifyJSON = { prefix: prefix, icons: { foo0: { body: '', }, }, }; const item0: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon0, }; const icon1: IconifyJSON = { prefix: prefix, icons: { foo: { body: '', }, }, }; const item1: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon1, }; // Add item cache.setItem(browserCacheVersionKey, browserCacheVersion); cache.setItem(browserCacheCountKey, '2'); cache.setItem(browserCachePrefix + '1', JSON.stringify(item1)); // Set cache reset({ localStorage: cache, }); // Load data initBrowserStorage(); // Check data expect(browserStorageConfig).toEqual({ local: true, session: false, }); expect(browserStorageEmptyItems).toEqual({ local: new Set([0]), session: new Set(), }); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 2 ); // Save items storeInBrowserStorage(storage, icon0); // Check data expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 2 ); // Check cache expect(cache.getItem(browserCachePrefix + '0')).toBe( JSON.stringify(item0) ); expect(cache.getItem(browserCachePrefix + '1')).toBe( JSON.stringify(item1) ); expect(cache.getItem(browserCacheCountKey)).toBe('2'); expect(cache.getItem(browserCacheVersionKey)).toBe(browserCacheVersion); }); it('Adding multiple icon sets to existing data', () => { const prefix = nextPrefix(); const cache = createCache(); const storage = getStorage(provider, prefix); // Add icon sets const icons: IconifyJSON[] = []; const items: BrowserStorageItem[] = []; for (let i = 0; i < 12; i++) { const icon: IconifyJSON = { prefix: prefix, icons: { ['foo' + i.toString()]: { body: '', }, }, }; const item: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon, }; // Make items 2 and 4 expire if (i === 2 || i === 4) { item.cached -= browserStorageCacheExpiration + 1; } // Change expiration for items 6 and 8 to almost expire if (i === 6 || i === 8) { item.cached -= browserStorageCacheExpiration - 1; } icons.push(icon); items.push(item); // Skip items 1, 5, 9+ if (i !== 1 && i !== 5 && i < 9) { cache.setItem( browserCachePrefix + i.toString(), JSON.stringify(item) ); } } cache.setItem(browserCacheVersionKey, browserCacheVersion); cache.setItem(browserCacheCountKey, '10'); // Set cache reset({ sessionStorage: cache, }); // Load data initBrowserStorage(); // Check data expect(browserStorageConfig).toEqual({ local: false, session: true, }); // Counter should have changed to 9 after validation because last item is missing // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('session')!)).toBe( 9 ); expect(browserStorageEmptyItems).toEqual({ local: new Set(), // mix of expired and skipped items // reverse order, 9 should not be there because it is last item session: new Set([5, 4, 2, 1]), }); expect(cache.getItem(browserCacheCountKey)).toBe('9'); // Check cached items [0, 3, 6, 7, 8].forEach((index) => { expect(cache.getItem(browserCachePrefix + index.toString())).toBe( JSON.stringify(items[index]) ); }); // Check expired items - should have been deleted // Also check items that weren't supposed to be added [2, 4, 1, 5, 9, 10, 11, 12, 13].forEach((index) => { expect( cache.getItem(browserCachePrefix + index.toString()) ).toBeNull(); }); // Add item 5 storeInBrowserStorage(storage, icons[5]); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set([4, 2, 1]), }); expect(cache.getItem(browserCacheCountKey)).toBe('9'); // Add items 4, 2, 1 const list = [4, 2, 1]; list.slice(0).forEach((index) => { expect(list.shift()).toBe(index); storeInBrowserStorage(storage, icons[index]); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(list), }); expect(cache.getItem(browserCacheCountKey)).toBe('9'); }); // Add item 10 storeInBrowserStorage(storage, icons[10]); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); expect(cache.getItem(browserCacheCountKey)).toBe('10'); // Add item 11 storeInBrowserStorage(storage, icons[11]); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); expect(cache.getItem(browserCacheCountKey)).toBe('11'); }); it('Overwrite outdated data', () => { const prefix = nextPrefix(); const cache = createCache(); const storage = getStorage(provider, prefix); // Add data in old format cache.setItem(browserCacheVersionKey, '1.0.6'); cache.setItem(browserCacheCountKey, '3'); for (let i = 0; i < 3; i++) { cache.setItem( browserCachePrefix + i.toString(), JSON.stringify({ prefix: prefix, icons: { ['foo' + i.toString()]: { body: '', }, }, }) ); } // Set cache reset({ localStorage: cache, }); // Check icon storage expect(iconExists(storage, 'foo1')).toBe(false); // Load cache initBrowserStorage(); expect(browserStorageConfig).toEqual({ local: true, session: false, }); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // Add one icon set const icon: IconifyJSON = { prefix: prefix, icons: { foo: { body: '', }, }, }; const item: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon, }; // Save item storeInBrowserStorage(storage, icon); // Storing in cache should not add item to storage expect(iconExists(storage, 'foo')).toBe(false); // Check data that should have been updated because storeCache() // should call load function before first execution expect(browserStorageConfig).toEqual({ local: true, session: false, }); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // Check cache expect(cache.getItem(browserCachePrefix + '0')).toBe( JSON.stringify(item) ); expect(cache.getItem(browserCacheCountKey)).toBe('1'); expect(cache.getItem(browserCacheVersionKey)).toBe(browserCacheVersion); }); it('Using both storage options', () => { const prefix = nextPrefix(); const cache1 = createCache(); const cache2 = createCache(); const storage = getStorage(provider, prefix); // Add icon sets to localStorage cache1.setItem(browserCacheVersionKey, browserCacheVersion); cache1.setItem(browserCacheCountKey, '3'); [0, 1, 2].forEach((index) => { const icon: IconifyJSON = { prefix: prefix, icons: { ['foo' + index.toString()]: { body: '', }, }, }; const item: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon, }; cache1.setItem( browserCachePrefix + index.toString(), JSON.stringify(item) ); }); // Add icon sets to sessionStorage cache2.setItem(browserCacheVersionKey, browserCacheVersion); cache2.setItem(browserCacheCountKey, '4'); [0, 1, 2, 3].forEach((index) => { const icon: IconifyJSON = { prefix: prefix, icons: { ['bar' + index.toString()]: { body: '', }, }, }; const item: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon, }; cache2.setItem( browserCachePrefix + index.toString(), JSON.stringify(item) ); }); // Set cache reset({ localStorage: cache1, sessionStorage: cache2, }); // Load data initBrowserStorage(); // Check data expect(browserStorageConfig).toEqual({ local: true, session: true, }); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 3 ); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('session')!)).toBe( 4 ); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // Check icon storage for (let i = 0; i < 3; i++) { expect(iconExists(storage, 'foo' + i.toString())).toBe(true); } for (let i = 0; i < 4; i++) { expect(iconExists(storage, 'bar' + i.toString())).toBe(true); } // Add new item to localStorage const icon: IconifyJSON = { prefix: prefix, icons: { 'new-icon': { body: '', }, }, }; const item: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon, }; storeInBrowserStorage(storage, icon); // Check data expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 4 // +1 ); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('session')!)).toBe( 4 ); // Check cache expect(cache1.getItem(browserCachePrefix + '3')).toBe( JSON.stringify(item) ); }); it('Using both storage options, but localStorage is read only', () => { const prefix = nextPrefix(); const cache1 = createCache(); const cache2 = createCache(); const storage = getStorage(provider, prefix); // Add icon sets to localStorage cache1.setItem(browserCacheVersionKey, browserCacheVersion); cache1.setItem(browserCacheCountKey, '3'); [0, 1, 2].forEach((index) => { const icon: IconifyJSON = { prefix: prefix, icons: { ['foo' + index.toString()]: { body: '', }, }, }; const item: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon, }; cache1.setItem( browserCachePrefix + index.toString(), JSON.stringify(item) ); }); // Add icon sets to sessionStorage cache2.setItem(browserCacheVersionKey, browserCacheVersion); cache2.setItem(browserCacheCountKey, '4'); [0, 1, 2, 3].forEach((index) => { const icon: IconifyJSON = { prefix: prefix, icons: { ['bar' + index.toString()]: { body: '', }, }, }; const item: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon, }; cache2.setItem( browserCachePrefix + index.toString(), JSON.stringify(item) ); }); // Set cache reset({ localStorage: cache1, sessionStorage: cache2, }); // Load data initBrowserStorage(); // Check data expect(browserStorageConfig).toEqual({ local: true, session: true, }); expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 3 ); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('session')!)).toBe( 4 ); // Check icon storage for (let i = 0; i < 3; i++) { expect(iconExists(storage, 'foo' + i.toString())).toBe(true); } for (let i = 0; i < 4; i++) { expect(iconExists(storage, 'bar' + i.toString())).toBe(true); } // Set localStorage to read-only cache1.canWrite = false; // Add new item to localStorage const icon: IconifyJSON = { prefix: prefix, icons: { 'new-icon': { body: '', }, }, }; const item: BrowserStorageItem = { cached: Math.floor(Date.now() / browserStorageHour), provider, data: icon, }; storeInBrowserStorage(storage, icon); // Check data expect(browserStorageEmptyItems).toEqual({ local: new Set(), session: new Set(), }); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('local')!)).toBe( 3 ); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion expect(getBrowserStorageItemsCount(getBrowserStorage('session')!)).toBe( 5 // +1 ); // Check cache expect(cache2.getItem(browserCachePrefix + '4')).toBe( JSON.stringify(item) ); }); });