Add tests for view-mode-switch.vue

kobihcmomanyi · Jan 14, 2018 · af6c92b · af6c92b
1 parent 26fe41c
commit af6c92b
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 5 deletions.
diff --git a/resources/assets/js/components/main-wrapper/main-content/albums.vue b/resources/assets/js/components/main-wrapper/main-content/albums.vue
@@ -2,7 +2,7 @@
   <section id="albumsWrapper">
     <h1 class="heading">
       <span>Albums</span>
-      <view-mode-switch :mode="viewMode" for="albums"/>
+      <view-mode-switch :mode="viewMode" for="albums" @viewModeChanged="changeViewMode"/>
     </h1>
 
     <div ref="scroller" class="albums main-scroll-wrap" :class="`as-${viewMode}`" @scroll="scrolling">

diff --git a/resources/assets/js/components/main-wrapper/main-content/artists.vue b/resources/assets/js/components/main-wrapper/main-content/artists.vue
@@ -2,7 +2,7 @@
   <section id="artistsWrapper">
     <h1 class="heading">
       <span>Artists</span>
-      <view-mode-switch :mode="viewMode" for="artists"/>
+      <view-mode-switch :mode="viewMode" for="artists" @viewModeChanged="changeViewMode"/>
     </h1>
 
     <div class="artists main-scroll-wrap" :class="`as-${viewMode}`" @scroll="scrolling">

diff --git a/resources/assets/js/components/shared/view-mode-switch.vue b/resources/assets/js/components/shared/view-mode-switch.vue
@@ -20,12 +20,12 @@ export default {
     mode: {
       type: String,
       default: 'thumbnails',
-      validator: value => ['thumbnails', 'list'].indexOf(value) !== -1
+      validator: value => ['thumbnails', 'list'].includes(value)
     },
     for: {
       type: String,
       required: true,
-      validator: value => ['albums', 'artists'].indexOf(value) !== -1
+      validator: value => ['albums', 'artists'].includes(value)
     }
   },
 
@@ -49,7 +49,7 @@ export default {
   methods: {
     setMode (mode) {
       preferences[this.preferenceKey] = this.mutatedMode = mode
-      this.$parent.changeViewMode(mode)
+      this.$emit('viewModeChanged', mode)
     }
   },
 

diff --git a/resources/assets/js/tests/components/shared/view-mode-switch.spec.js b/resources/assets/js/tests/components/shared/view-mode-switch.spec.js
@@ -0,0 +1,14 @@
+import Component from '@/components/shared/view-mode-switch.vue'
+
+describe('components/shared/view-mode-switch', () => {
+  it('changes the view mode', () => {
+    const wrapper = shallow(Component, { propsData: { 
+      mode: 'list',
+      for: 'albums'
+    }})
+    wrapper.find('a.thumbnails').trigger('click')
+    wrapper.emitted().viewModeChanged[0].should.eql(['thumbnails'])
+    wrapper.find('a.list').trigger('click')
+    wrapper.emitted().viewModeChanged[1].should.eql(['list'])
+  })
+})