fix(core): CHECKOUT-3012 Do not cache failed responses

bigcommerce · Mar 19, 2018 · 792de4a · 792de4a
1 parent 2b6c98b
commit 792de4a
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 27 deletions.
diff --git a/src/script-loader.spec.ts b/src/script-loader.spec.ts
@@ -6,48 +6,61 @@ describe('ScriptLoader', () => {
 
     beforeEach(() => {
         script = document.createElement('script');
-
         jest.spyOn(document, 'createElement').mockImplementation(() => script);
-        jest.spyOn(document.body, 'appendChild').mockImplementation((element) =>
-            element.onreadystatechange(new Event('readystatechange'))
-        );
-
         loader = new ScriptLoader();
     });
 
     afterEach(() => {
         jest.restoreAllMocks();
     });
 
-    it('attaches script tag to document', async () => {
-        await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js');
+    describe('when script succeeds to load', () => {
+        beforeEach(() => {
+            jest.spyOn(document.body, 'appendChild').mockImplementation((element) =>
+                setTimeout(() => element.onreadystatechange(new Event('readystatechange')), 0)
+            );
+        });
 
-        expect(document.body.appendChild).toHaveBeenCalledWith(script);
-        expect(script.src).toEqual('https://code.jquery.com/jquery-3.2.1.min.js');
-    });
+        it('attaches script tag to document', async () => {
+            await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js');
 
-    it('resolves promise if script is loaded', async () => {
-        const output = await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js');
+            expect(document.body.appendChild).toHaveBeenCalledWith(script);
+            expect(script.src).toEqual('https://code.jquery.com/jquery-3.2.1.min.js');
+        });
 
-        expect(output).toBeInstanceOf(Event);
-    });
+        it('resolves promise if script is loaded', async () => {
+            const output = await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js');
 
-    it('rejects promise if script is not loaded', async () => {
-        jest.spyOn(document.body, 'appendChild').mockImplementation(
-            (element) => element.onerror(new Event('error'))
-        );
+            expect(output).toBeInstanceOf(Event);
+        });
 
-        try {
+        it('does not load same script twice', async () => {
             await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js');
-        } catch (output) {
-            expect(output).toBeInstanceOf(Event);
-        }
+            await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js');
+
+            expect(document.body.appendChild).toHaveBeenCalledTimes(1);
+        });
     });
 
-    it('does not load same script twice', async () => {
-        await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js');
-        await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js');
+    describe('when script fails to load', () => {
+        beforeEach(() => {
+            jest.spyOn(document.body, 'appendChild').mockImplementation(element =>
+                setTimeout(() => element.onerror(new Event('error')), 0)
+            );
+        });
+
+        it('rejects promise if script is not loaded', async () => {
+            await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js')
+                .catch(error => expect(error).toBeTruthy());
+        });
+
+        it('loads the script again', async () => {
+            await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js')
+                .catch(() => {});
+            await loader.loadScript('https://code.jquery.com/jquery-3.2.1.min.js')
+                .catch(() => {});
 
-        expect(document.body.appendChild).toHaveBeenCalledTimes(1);
+            expect(document.body.appendChild).toHaveBeenCalledTimes(2);
+        });
     });
 });
diff --git a/src/script-loader.ts b/src/script-loader.ts
@@ -8,7 +8,10 @@ export default class ScriptLoader {
 
                 script.onload = (event) => resolve(event);
                 script.onreadystatechange = (event) => resolve(event);
-                script.onerror = (event) => reject(event);
+                script.onerror = (event) => {
+                    delete this._scripts[src];
+                    reject(event);
+                };
                 script.async = true;
                 script.src = src;