feat(dependencies): update dependencies and fix tests

__tests__/buildtime/helpers/color.helpers.test.ts

@@ -299,7 +299,7 @@ describe('ColorHelpers', () => {
             expect(ColorHelpers.xyz2lab({x: 0.5497, y: 0.2676, z: 0.7421})).toEqual({
                 L: 58.75151708604609,
                 a: 94.37585303808727,
-                b: -47.12541423897125,
+                b: -47.125414238971274,
             });
         });
 
@@ -333,15 +333,15 @@ describe('ColorHelpers', () => {
             expect(ColorHelpers.rgba2lab({r: 20, g: 150, b: 172, a: 1}, {r: 0, g: 0, b: 0})).toEqual({
                 L: 57.01450522003452,
                 a: -24.232935785517274,
-                b: -20.680006803549134,
+                b: -20.680006803549112,
             });
         });
 
         test('it converts rgb color #2 to xyz color space correctly', () => {
             expect(ColorHelpers.rgba2lab({r: 133, g: 0, b: 22, a: 1}, {r: 0, g: 0, b: 0})).toEqual({
-                L: 26.865877930910933,
-                a: 49.84281929749121,
-                b: 29.202769536552836,
+                L: 26.865877930910926,
+                a: 49.84281929749124,
+                b: 29.202769536552825,
             });
         });
 
@@ -355,9 +355,9 @@ describe('ColorHelpers', () => {
 
         test('it converts rgb color #4 to xyz color space correctly', () => {
             expect(ColorHelpers.rgba2lab({r: 81, g: 190, b: 20, a: 1}, {r: 0, g: 0, b: 0})).toEqual({
-                L: 68.47865365064216,
-                a: -57.45249237364075,
-                b: 65.68058200854303,
+                L: 68.47865365064217,
+                a: -57.45249237364081,
+                b: 65.68058200854304,
             });
         });
     });

__tests__/buildtime/helpers/file.helpers.test.ts

@@ -19,13 +19,13 @@ describe('FileHelpers', () => {
         afterEach(() => fs.restore());
 
         test('it recursively finds all files within a folder that match regex', () => {
-           fsExtra.outputFileSync('test-root/directory/image.png');
-           fsExtra.outputFileSync('test-root/directory/subdirectory/image.jpeg');
-           fsExtra.outputFileSync('test-root/directory/subdirectory/image.png');
-           fsExtra.outputFileSync('test-root/directory/subdirectory/subsubdirectory/image.gif');
+           fsExtra.outputFileSync('test-root/directory/image.png', '');
+           fsExtra.outputFileSync('test-root/directory/subdirectory/image.jpeg', '');
+           fsExtra.outputFileSync('test-root/directory/subdirectory/image.png', '');
+           fsExtra.outputFileSync('test-root/directory/subdirectory/subsubdirectory/image.gif', '');
 
-           fsExtra.outputFileSync('other-dir/subsubdirectory/image.gif');
-           fsExtra.outputFileSync('test-root/subsubdirectory/text.txt');
+           fsExtra.outputFileSync('other-dir/subsubdirectory/image.gif', '');
+           fsExtra.outputFileSync('test-root/subsubdirectory/text.txt', '');
 
            const RESULT: string[] = FileHelpers.findFilesInDir('test-root', FileHelpers.IMAGE_REGEX);
            const EXPECTED: string[] = ['test-root/directory/image.png', 'test-root/directory/subdirectory/image.jpeg',
@@ -65,6 +65,10 @@ describe('FileHelpers', () => {
         test('png image', () => {
             expect(FileHelpers.IMAGE_REGEX.test('foo.png')).toBe(true);
         });
+
+        test('gif image', () => {
+            expect(FileHelpers.IMAGE_REGEX.test('foo.gif')).toBe(false);
+        });
     });
 
     describe('imageCompressionLevel', () => {

__tests__/buildtime/prepare_progressive_images.test.ts

@@ -11,7 +11,6 @@ describe('prepareProgressiveImages', () => {
     const IMG_SAMPLES: string[] = [
         '__tests__/buildtime/img-samples/sample-1.jpg',
         '__tests__/buildtime/img-samples/sample-2.jpeg',
-        '__tests__/buildtime/img-samples/sample-3.gif',
         '__tests__/buildtime/img-samples/sample-4.png',
         '__tests__/buildtime/img-samples/sample-5.jpg',
         '__tests__/buildtime/img-samples/sample-6.jpg',

__tests__/runtime/helpers.test.ts

@@ -66,7 +66,7 @@ describe('Helpers', () => {
             expect(await supportsWebp()).toBe(false);
         });
 
-        test('browser supports webp if image can be loaded in background', async (done: any) => {
+        test('browser supports webp if image can be loaded in background', (done: any) => {
             supportsWebp().then((isSupported: boolean) => {
                 expect(isSupported).toBe(true);
                 expect(window.optimus__supportsWebp).toBe(true);
@@ -79,7 +79,7 @@ describe('Helpers', () => {
             });
         });
 
-        test('browser does not support webp if the image cannot be loaded in background', async (done: any) => {
+        test('browser does not support webp if the image cannot be loaded in background', (done: any) => {
             supportsWebp().then((isSupported: boolean) => {
                 expect(isSupported).toBe(false);
                 expect(window.optimus__supportsWebp).toBe(false);

__tests__/runtime/inject_css.test.ts

@@ -2,13 +2,14 @@ import { InjectCSS } from '../../src/runtime/inject_css';
 
 describe('InjectCSS', () => {
     test('Optimus CSS does not get injected if it is already present in DOM', () => {
-        const SPY: any = jest.spyOn(document, 'createElement');
+        const SPY: jest.SpyInstance = jest.spyOn(document, 'createElement');
 
         document.body.innerHTML = '<style id="optimusIMG-css">';
 
         InjectCSS.execute();
 
         expect(SPY).not.toHaveBeenCalledWith('style');
+        SPY.mockRestore();
     });
 
     test('Optimus CSS gets injected if it is not present in DOM', () => {

__tests__/runtime/lazy_load.test.ts

@@ -9,9 +9,26 @@ describe('LazyLoad', () => {
     const REMOVE_EVENT_LISTENER: any = document.removeEventListener;
     const ADD_EVENT_LISTENER: any = document.addEventListener;
 
+    let originalInterval: typeof window['setInterval'];
+    let originalTimeout: typeof window['setTimeout'];
+    let originalClearInterval: typeof window['clearInterval'];
+    let originalClearTimeout: typeof window['clearTimeout'];
+
+    beforeEach(() => {
+        originalInterval = window.setInterval;
+        originalTimeout = window.setTimeout;
+        originalClearInterval = window.clearInterval;
+        originalClearTimeout = window.clearTimeout;
+    });
+
     afterEach(() => {
         document.removeEventListener = REMOVE_EVENT_LISTENER;
         document.addEventListener = ADD_EVENT_LISTENER;
+
+        window.setInterval = originalInterval;
+        window.setTimeout = originalTimeout;
+        window.clearInterval = originalClearInterval;
+        window.clearTimeout = originalClearTimeout;
     });
 
     describe('execute', () => {
@@ -123,7 +140,7 @@ describe('LazyLoad', () => {
                         });
 
                         PICTURE_3.querySelectorAll('source').forEach((source: HTMLSourceElement) => {
-                            expect(source.srcset).toBe('null');
+                            expect(source.srcset).toBe('');
                             expect(source.srcset).not.toEqual(source.getAttribute('data-optimus-lazy-srcset'));
                         });
                     }
@@ -292,6 +309,7 @@ describe('LazyLoad', () => {
                 });
 
                 test('interval gets added', () => {
+                    // @ts-ignore
                     window.setInterval = jest.fn();
 
                     new LazyLoad();
@@ -301,10 +319,10 @@ describe('LazyLoad', () => {
                 });
 
                 test('interval gets cleared once all images are loaded', () => {
-                    window.clearInterval = jest.fn();
-
                     jest.useFakeTimers();
 
+                    jest.spyOn(window, 'clearInterval');
+
                     new LazyLoad();
 
                     expect(document.querySelectorAll('img:not([data-optimus-loaded="true"])').length).not.toBe(0);