Export the cacheStore

README.md

@@ -134,6 +134,11 @@ Create unique IDs for each icon.
 />
 ```
 
+## Caching
+
+The internal cache is exported as `cacheStore` if you need to debug or pre-cache some files.  
+⚠️ Use it at your own risk.
+
 ## Browser Support
 
 Any browsers that support inlining [SVGs](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/svg) and [fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) will work.

src/index.tsx

@@ -11,7 +11,7 @@ import {
 } from './helpers';
 import { FetchError, Props, State, StorageItem } from './types';
 
-const cacheStore: { [key: string]: StorageItem } = Object.create(null);
+export const cacheStore: { [key: string]: StorageItem } = Object.create(null);
 
 export default class InlineSVG extends React.PureComponent<Props, State> {
   constructor(props: Props) {
@@ -221,7 +221,6 @@ export default class InlineSVG extends React.PureComponent<Props, State> {
         () => {
           const { cacheRequests, src } = this.props;
           const cache = cacheRequests && cacheStore[src];
-
           if (cache) {
             /* istanbul ignore else */
             if (cache.status === STATUS.LOADING) {

test/__snapshots__/index.spec.tsx.snap

@@ -2206,6 +2206,13 @@ exports[`react-inlinesvg cached requests should skip the cache if \`cacheRequest
 </svg>
 `;
 
+exports[`react-inlinesvg integration should handle pre-cached entries in the cacheStore 1`] = `
+<svg>
+  <circle>
+  </circle>
+</svg>
+`;
+
 exports[`react-inlinesvg integration should handle race condition with fast src changes 1`] = `
 <svg width="256px"
      height="256px"

test/index.spec.tsx

@@ -3,7 +3,7 @@ import { poll } from '@gilbarbara/helpers';
 import { mount, ReactWrapper } from 'enzyme';
 import fetchMock from 'jest-fetch-mock';
 
-import ReactInlineSVG, { Props } from '../src/index';
+import ReactInlineSVG, { cacheStore, Props } from '../src/index';
 
 const Loader = () => <div id="loader" />;
 
@@ -387,6 +387,10 @@ describe('react-inlinesvg', () => {
   });
 
   describe('integration', () => {
+    beforeAll(() => {
+      fetchMock.resetMocks();
+    });
+
     it('should handle race condition with fast src changes', async () => {
       const mockOnLoad = jest.fn();
 
@@ -446,6 +450,28 @@ describe('react-inlinesvg', () => {
       await multiSetup();
       expect(mockOnLoad).toHaveBeenCalledTimes(4);
     });
+
+    it('should handle pre-cached entries in the cacheStore', async () => {
+      fetchMock.enableMocks();
+      const mockOnLoad = jest.fn();
+
+      cacheStore['http://localhost:1337/react.svg'] = {
+        content: '<svg><circle /></svg>',
+        status: 'loaded',
+        queue: [],
+      };
+
+      const wrapper = mount(<ReactInlineSVG src={fixtures.react} onLoad={mockOnLoad} />);
+
+      await poll(() => !!mockOnLoad.mock.calls.length);
+      wrapper.update();
+
+      expect(fetchMock).toHaveBeenCalledTimes(0);
+      expect(wrapper.html()).toMatchSnapshot();
+
+      // clean up
+      fetchMock.disableMocks();
+    });
   });
 
   describe('with errors', () => {