refs #209 Add integration tests for ImageViewer modal

spec/renderer/integration/store/TimelineSpace/Modals/ImageViewer.spec.js

@@ -0,0 +1,208 @@
+import { createLocalVue } from '@vue/test-utils'
+import Vuex from 'vuex'
+import ImageViewer from '~/src/renderer/store/TimelineSpace/Modals/ImageViewer'
+
+const state = () => {
+  return {
+    modalOpen: false,
+    currentIndex: -1,
+    mediaList: [],
+    loading: false
+  }
+}
+
+const initStore = () => {
+  return {
+    namespaced: true,
+    state: state(),
+    actions: ImageViewer.actions,
+    mutations: ImageViewer.mutations,
+    getters: ImageViewer.getters
+  }
+}
+
+describe('ImageViewer', () => {
+  let store
+  let localVue
+
+  beforeEach(() => {
+    localVue = createLocalVue()
+    localVue.use(Vuex)
+    store = new Vuex.Store({
+      modules: {
+        ImageViewer: initStore()
+      }
+    })
+  })
+
+  // Actions
+  describe('openModal', () => {
+    it('should be changed', () => {
+      store.dispatch('ImageViewer/openModal', {
+        currentIndex: 1,
+        mediaList: ['media1', 'media2']
+      })
+      expect(store.state.ImageViewer.modalOpen).toEqual(true)
+      expect(store.state.ImageViewer.currentIndex).toEqual(1)
+      expect(store.state.ImageViewer.mediaList).toEqual(['media1', 'media2'])
+      expect(store.state.ImageViewer.loading).toEqual(true)
+    })
+  })
+
+  describe('closeModal', () => {
+    beforeEach(() => {
+      store.dispatch('ImageViewer/openModal', {
+        currentIndex: 1,
+        mediaList: ['media1', 'media2']
+      })
+    })
+    it('should be changed', () => {
+      store.dispatch('ImageViewer/closeModal')
+      expect(store.state.ImageViewer.modalOpen).toEqual(false)
+      expect(store.state.ImageViewer.currentIndex).toEqual(-1)
+      expect(store.state.ImageViewer.mediaList).toEqual([])
+      expect(store.state.ImageViewer.loading).toEqual(false)
+    })
+  })
+
+  describe('incrementIndex', () => {
+    it('should be changed', () => {
+      store.dispatch('ImageViewer/incrementIndex')
+      expect(store.state.ImageViewer.currentIndex).toEqual(0)
+      expect(store.state.ImageViewer.loading).toEqual(true)
+    })
+  })
+
+  describe('decrementIndex', () => {
+    it('should be changed', () => {
+      store.dispatch('ImageViewer/decrementIndex')
+      expect(store.state.ImageViewer.currentIndex).toEqual(-2)
+      expect(store.state.ImageViewer.loading).toEqual(true)
+    })
+  })
+
+  // Getters
+  describe('imageURL', () => {
+    describe('currentIndex exists', () => {
+      beforeEach(() => {
+        store.dispatch('ImageViewer/openModal', {
+          currentIndex: 0,
+          mediaList: [
+            {
+              url: 'http://github.com'
+            },
+            {
+              url: 'http://google.com'
+            }
+          ]
+        })
+      })
+      it('should return url', () => {
+        const url = store.getters['ImageViewer/imageURL']
+        expect(url).toEqual('http://github.com')
+      })
+    })
+  })
+
+  describe('imageType', () => {
+    describe('currentIndex exists', () => {
+      beforeEach(() => {
+        store.dispatch('ImageViewer/openModal', {
+          currentIndex: 0,
+          mediaList: [
+            {
+              type: 'image/png'
+            },
+            {
+              type: 'image/jpg'
+            }
+          ]
+        })
+      })
+      it('should return type', () => {
+        const type = store.getters['ImageViewer/imageType']
+        expect(type).toEqual('image/png')
+      })
+    })
+  })
+
+  describe('showLeft', () => {
+    describe('currentIndex > 0', () => {
+      describe('mediaList > 1', () => {
+        beforeEach(() => {
+          store.dispatch('ImageViewer/openModal', {
+            currentIndex: 1,
+            mediaList: [
+              {
+                type: 'image/png'
+              },
+              {
+                type: 'image/jpg'
+              }
+            ]
+          })
+        })
+        it('should return true', () => {
+          const left = store.getters['ImageViewer/showLeft']
+          expect(left).toEqual(true)
+        })
+      })
+      describe('mediaList < 1', () => {
+        beforeEach(() => {
+          store.dispatch('ImageViewer/openModal', {
+            currentIndex: 0,
+            mediaList: [
+              {
+                type: 'image/png'
+              }
+            ]
+          })
+        })
+        it('should not return true', () => {
+          const left = store.getters['ImageViewer/showLeft']
+          expect(left).toEqual(false)
+        })
+      })
+    })
+  })
+
+  describe('showRight', () => {
+    describe('current index is lower than media list length', () => {
+      describe('media list length > 1', () => {
+        beforeEach(() => {
+          store.dispatch('ImageViewer/openModal', {
+            currentIndex: 0,
+            mediaList: [
+              {
+                type: 'image/png'
+              },
+              {
+                type: 'image/jpeg'
+              }
+            ]
+          })
+        })
+        it('should return true', () => {
+          const right = store.getters['ImageViewer/showRight']
+          expect(right).toEqual(true)
+        })
+      })
+      describe('media list length <= 1', () => {
+        beforeEach(() => {
+          store.dispatch('ImageViewer/openModal', {
+            currentIndex: 0,
+            mediaList: [
+              {
+                type: 'image/png'
+              }
+            ]
+          })
+        })
+        it('should not return true', () => {
+          const right = store.getters['ImageViewer/showRight']
+          expect(right).toEqual(false)
+        })
+      })
+    })
+  })
+})